mirror of
https://gitlab.xiph.org/xiph/icecast-server.git
synced 2024-12-04 14:46:30 -05:00
982 lines
20 KiB
CSS
982 lines
20 KiB
CSS
|
@charset "UTF-8";
|
||
|
|
|
||
|
|
/* Typeface */
|
||
|
|
@font-face {
|
||
|
|
font-family: 'FiraSans';
|
||
|
|
font-style: normal;
|
||
|
|
font-weight: normal;
|
||
|
|
src: url('../font/FiraSans-Regular.eot');
|
||
|
|
src: url('../font/FiraSans-Regular.eot?#iefix') format('embedded-opentype'), url('../font/FiraSans-Regular.woff') format('woff');
|
||
|
|
}
|
||
|
|
@font-face {
|
||
|
|
font-family: 'FiraSans';
|
||
|
|
font-style: italic;
|
||
|
|
font-weight: normal;
|
||
|
|
src: url('../font/FiraSans-Italic.eot');
|
||
|
|
src: url('../font/FiraSans-Italic.eot?#iefix') format('embedded-opentype'), url('../font/FiraSans-Italic.woff') format('woff');
|
||
|
|
}
|
||
|
|
@font-face {
|
||
|
|
font-family: 'FiraSans';
|
||
|
|
font-style: normal;
|
||
|
|
font-weight: bold;
|
||
|
|
src: url('fonts/FiraSans/FiraSans-Bold.eot');
|
||
|
|
src: url('../font/FiraSans-Bold.eot?#iefix') format('embedded-opentype'), url('../font/FiraSans-Bold.woff') format('woff');
|
||
|
|
}
|
||
|
|
@font-face {
|
||
|
|
font-family: 'FiraSans';
|
||
|
|
font-style: italic;
|
||
|
|
font-weight: bold;
|
||
|
|
src: url('../font/FiraSans-BoldItalic.eot');
|
||
|
|
src: url('../font/FiraSans-BoldItalic.eot?#iefix') format('embedded-opentype'), url('../font/FiraSans-BoldItalic.woff') format('woff');
|
||
|
|
}
|
||
|
|
@font-face {
|
||
|
|
font-family: 'FiraMono';
|
||
|
|
font-style: normal;
|
||
|
|
font-weight: normal;
|
||
|
|
src: url('../font/FiraMono-Regular.eot');
|
||
|
|
src: url('../font/FiraMono-Regular.eot?#iefix') format('embedded-opentype'), url('../font/FiraMono-Regular.woff') format('woff');
|
||
|
|
}
|
||
|
|
@font-face {
|
||
|
|
font-family: 'FiraMono';
|
||
|
|
font-style: normal;
|
||
|
|
font-weight: bold;
|
||
|
|
src: url('../font/FiraMono-Bold.eot');
|
||
|
|
src: url('../font/FiraMono-Bold.eot?#iefix') format('embedded-opentype'), url('../font/FiraMono-Bold.woff') format('woff');
|
||
|
|
}
|
||
|
|
|
||
|
|
/* General */
|
||
|
|
*,
|
||
|
|
*:before,
|
||
|
|
*:after {
|
||
|
|
font-family: 'FiraSans', sans-serif;
|
||
|
|
line-height: 1;
|
||
|
|
margin: 0;
|
||
|
|
padding: 0;
|
||
|
|
border: 0;
|
||
|
|
-webkit-box-sizing: border-box;
|
||
|
|
-moz-box-sizing: border-box;
|
||
|
|
box-sizing: border-box;
|
||
|
|
-webkit-font-smoothing: antialiased;
|
||
|
|
-moz-osx-font-smoothing: grayscale;
|
||
|
|
text-rendering: optimizelegibility;
|
||
|
|
}
|
||
|
|
::selection {
|
||
|
|
background: #9AABB5;
|
||
|
|
color: #001826;
|
||
|
|
text-shadow: none;
|
||
|
|
}
|
||
|
|
::-moz-selection {
|
||
|
|
background: #9AABB5;
|
||
|
|
color: #001826;
|
||
|
|
text-shadow: none;
|
||
|
|
}
|
||
|
|
.hidden {
|
||
|
|
clip: rect(0 0 0 0);
|
||
|
|
overflow: hidden;
|
||
|
|
width: 1px;
|
||
|
|
height: 1px;
|
||
|
|
padding: 0;
|
||
|
|
margin: -1px;
|
||
|
|
position: absolute;
|
||
|
|
border: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Typography */
|
||
|
|
h1,
|
||
|
|
h2,
|
||
|
|
h3,
|
||
|
|
h4 {
|
||
|
|
line-height: 1.25;
|
||
|
|
}
|
||
|
|
h1 {
|
||
|
|
font-size: 2em;
|
||
|
|
font-weight: normal;
|
||
|
|
}
|
||
|
|
h2 {
|
||
|
|
font-size: 2em;
|
||
|
|
}
|
||
|
|
h3 {
|
||
|
|
font-size: 1.5em;
|
||
|
|
}
|
||
|
|
h4 {
|
||
|
|
font-size: 1.25em;
|
||
|
|
}
|
||
|
|
h5 {
|
||
|
|
font-size: 1em;
|
||
|
|
text-transform: uppercase;
|
||
|
|
}
|
||
|
|
p,
|
||
|
|
li,
|
||
|
|
blockquote,
|
||
|
|
dl > *,
|
||
|
|
aside {
|
||
|
|
line-height: 1.6;
|
||
|
|
-webkit-hyphens: auto;
|
||
|
|
-moz-hyphens: auto;
|
||
|
|
hyphens: auto;
|
||
|
|
}
|
||
|
|
blockquote {
|
||
|
|
font-style: italic;
|
||
|
|
}
|
||
|
|
q {
|
||
|
|
quotes:"\201E" "\201C";
|
||
|
|
}
|
||
|
|
code,
|
||
|
|
pre {
|
||
|
|
background-color: #000E17;
|
||
|
|
color: #9AABB5;
|
||
|
|
font-family: 'FiraMono', monospace;
|
||
|
|
line-height: 1.6;
|
||
|
|
}
|
||
|
|
code {
|
||
|
|
word-break: break-all;
|
||
|
|
}
|
||
|
|
pre {
|
||
|
|
white-space: pre-wrap;
|
||
|
|
padding: 1em;
|
||
|
|
}
|
||
|
|
code span,
|
||
|
|
pre span {
|
||
|
|
font-family: 'FiraMono', monospace;
|
||
|
|
}
|
||
|
|
/* Chrome fix */
|
||
|
|
@media screen and (-webkit-min-device-pixel-ratio: 0) {
|
||
|
|
pre {
|
||
|
|
word-break: break-all;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
hr {
|
||
|
|
padding-bottom: 1em;
|
||
|
|
margin-top: 2em;
|
||
|
|
clear: both;
|
||
|
|
border: 0;
|
||
|
|
border-top: 2px solid #29495C;
|
||
|
|
}
|
||
|
|
dt {
|
||
|
|
font-weight: bold;
|
||
|
|
}
|
||
|
|
dd {
|
||
|
|
margin-left: 1em;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Tables */
|
||
|
|
table {
|
||
|
|
width: 100%;
|
||
|
|
border-collapse: collapse;
|
||
|
|
border-spacing: 0;
|
||
|
|
}
|
||
|
|
th, td {
|
||
|
|
text-align: left;
|
||
|
|
line-height: 1.6;
|
||
|
|
padding: .5em;
|
||
|
|
vertical-align: top;
|
||
|
|
}
|
||
|
|
th {
|
||
|
|
background-color: #000E17;
|
||
|
|
text-shadow: 1px 1px 0 rgba(0,0,0,0.5);
|
||
|
|
}
|
||
|
|
td {
|
||
|
|
border: 2px solid #000E17;
|
||
|
|
}
|
||
|
|
td a {
|
||
|
|
word-break: break-all;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Inputs */
|
||
|
|
::-webkit-input-placeholder {
|
||
|
|
color: #9AABB5;
|
||
|
|
}
|
||
|
|
:-moz-placeholder {
|
||
|
|
color: #9AABB5;
|
||
|
|
opacity: 1;
|
||
|
|
}
|
||
|
|
::-moz-placeholder {
|
||
|
|
color: #9AABB5;
|
||
|
|
opacity: 1;
|
||
|
|
}
|
||
|
|
:-ms-input-placeholder {
|
||
|
|
color: #9AABB5;
|
||
|
|
}
|
||
|
|
input::-ms-clear {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
input:not([type="submit"]), textarea {
|
||
|
|
font: 1em 'FiraMono', monospace
|
||
|
|
}
|
||
|
|
input, textarea {
|
||
|
|
width: 50%;
|
||
|
|
}
|
||
|
|
input[type='text'],
|
||
|
|
input[type='email'],
|
||
|
|
input[type='password'],
|
||
|
|
input[type='url'] {
|
||
|
|
background-color: #000E17;
|
||
|
|
color: #9AABB5;
|
||
|
|
display: block;
|
||
|
|
padding: 1em;
|
||
|
|
}
|
||
|
|
input[type='submit'] {
|
||
|
|
background-color: #001826;
|
||
|
|
font-size: 1em;
|
||
|
|
color: #FFFFFF;
|
||
|
|
display: block;
|
||
|
|
padding: 1em;
|
||
|
|
border: 2px solid #29495C;
|
||
|
|
}
|
||
|
|
input[type='submit']:hover {
|
||
|
|
background-color: #29495C;
|
||
|
|
cursor: pointer;
|
||
|
|
}
|
||
|
|
input[type='checkbox'] + label {
|
||
|
|
display: inline-block !important;
|
||
|
|
margin: 10px 0 0 10px;
|
||
|
|
}
|
||
|
|
form > *:not(:last-child) {
|
||
|
|
margin-bottom: 1em;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Links */
|
||
|
|
a:link,
|
||
|
|
a:visited {
|
||
|
|
color: #9AABB5;
|
||
|
|
text-decoration: underline;
|
||
|
|
}
|
||
|
|
a:hover,
|
||
|
|
a:focus,
|
||
|
|
a:active {
|
||
|
|
color: #29495C;
|
||
|
|
}
|
||
|
|
a.permalink:link,
|
||
|
|
a.permalink:visited {
|
||
|
|
text-decoration: none;
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
a.permalink:hover,
|
||
|
|
*:hover > a.permalink {
|
||
|
|
display: inline-block;
|
||
|
|
padding-left: .25em;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Body */
|
||
|
|
body {
|
||
|
|
background-color: #CAD5DB;
|
||
|
|
color: #001826;
|
||
|
|
}
|
||
|
|
body > * {
|
||
|
|
margin: 0 auto;
|
||
|
|
}
|
||
|
|
body > *:not(:first-child) {
|
||
|
|
width: 75%;
|
||
|
|
margin: 0 auto;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Header */
|
||
|
|
header,
|
||
|
|
.header {
|
||
|
|
background-color: #001826;
|
||
|
|
position: relative;
|
||
|
|
margin-bottom: 2em;
|
||
|
|
box-shadow: 0 0 2em rgba(0,0,0,0.5) inset;
|
||
|
|
}
|
||
|
|
#xiphbar {
|
||
|
|
background-color: #666666;
|
||
|
|
height: 2.25em;
|
||
|
|
box-shadow: 0 .25em .25em rgba(0,0,0,.5);
|
||
|
|
}
|
||
|
|
#xiphbar > div {
|
||
|
|
width: 75%;
|
||
|
|
margin: 0 auto;
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
#xiphbar > div > * {
|
||
|
|
position: absolute;
|
||
|
|
top: 0.5em;
|
||
|
|
}
|
||
|
|
#xiphbar > div > a {
|
||
|
|
display: block;
|
||
|
|
}
|
||
|
|
#xiphbar img {
|
||
|
|
width: auto;
|
||
|
|
height: 1.25em;
|
||
|
|
}
|
||
|
|
#xiphbar > div > ul {
|
||
|
|
right: 0;
|
||
|
|
display: -webkit-box;
|
||
|
|
display: -moz-box;
|
||
|
|
display: -ms-flexbox;
|
||
|
|
display: flex;
|
||
|
|
flex-direction: row;
|
||
|
|
list-style: none;
|
||
|
|
}
|
||
|
|
#xiphbar li {
|
||
|
|
font-size: 14px;
|
||
|
|
margin: 0;
|
||
|
|
}
|
||
|
|
#xiphbar li:not(:first-child) {
|
||
|
|
margin-left: 1em;
|
||
|
|
}
|
||
|
|
#xiphbar a:link,
|
||
|
|
#xiphbar a:visited {
|
||
|
|
color: #ffcc66;
|
||
|
|
text-decoration: none;
|
||
|
|
text-transform: uppercase;
|
||
|
|
border: none;
|
||
|
|
}
|
||
|
|
#xiphbar a:hover,
|
||
|
|
#xiphbar a:focus {
|
||
|
|
color: #ffe6b3;
|
||
|
|
}
|
||
|
|
#xiphbar a:active {
|
||
|
|
color: #FFFFFF;
|
||
|
|
}
|
||
|
|
header h1,
|
||
|
|
.header h1 {
|
||
|
|
color: #29495C;
|
||
|
|
text-shadow: 1px 1px 0 rgba(0,0,0,0.5);
|
||
|
|
width: 75%;
|
||
|
|
padding: 2em 0;
|
||
|
|
margin: 0 auto;
|
||
|
|
}
|
||
|
|
header h1 a:link,
|
||
|
|
header h1 a:visited,
|
||
|
|
.header h1 a:link,
|
||
|
|
.header h1 a:visited {
|
||
|
|
color: #FFFFFF;
|
||
|
|
font-weight: bold;
|
||
|
|
text-decoration: none;
|
||
|
|
border-bottom: none;
|
||
|
|
}
|
||
|
|
header h1 a:hover,
|
||
|
|
header h1 a:focus,
|
||
|
|
.header h1 a:hover,
|
||
|
|
.header h1 a:focus {
|
||
|
|
text-decoration: underline;
|
||
|
|
}
|
||
|
|
header h1 a:active,
|
||
|
|
.header h1 a:active {
|
||
|
|
color: #29495C;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Navigation */
|
||
|
|
nav,
|
||
|
|
.nav {
|
||
|
|
margin: 0 auto;
|
||
|
|
border-top: 2px solid #29495C;
|
||
|
|
border-bottom: 2px solid #29495C;
|
||
|
|
}
|
||
|
|
nav label,
|
||
|
|
.nav label,
|
||
|
|
#toggle-nav {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
nav label:before,
|
||
|
|
.nav label:before {
|
||
|
|
content: '\2261';
|
||
|
|
color: #29495C;
|
||
|
|
font-size: 4em;
|
||
|
|
text-shadow: 1px 1px 0 rgba(0,0,0,0.5);
|
||
|
|
position: absolute;
|
||
|
|
top: 0.9em;
|
||
|
|
right: 0.5em;
|
||
|
|
}
|
||
|
|
nav label.nobar:before,
|
||
|
|
.nav label.nobar:before {
|
||
|
|
top: 0.4em;
|
||
|
|
}
|
||
|
|
nav label:hover,
|
||
|
|
nav label:hover:before,
|
||
|
|
.nav label:hover,
|
||
|
|
.nav label:hover:before {
|
||
|
|
color: #FFFFFF;
|
||
|
|
cursor: pointer;
|
||
|
|
}
|
||
|
|
#toggle-nav:checked + ul {
|
||
|
|
display: block;
|
||
|
|
}
|
||
|
|
nav ul,
|
||
|
|
.nav ul {
|
||
|
|
margin: 0 auto;
|
||
|
|
}
|
||
|
|
nav ul:before,
|
||
|
|
nav ul:after,
|
||
|
|
.nav ul:before,
|
||
|
|
.nav ul:after {
|
||
|
|
display: table;
|
||
|
|
content: ' ';
|
||
|
|
clear: both;
|
||
|
|
}
|
||
|
|
nav li,
|
||
|
|
.nav li {
|
||
|
|
display: table-cell;
|
||
|
|
width: 1%;
|
||
|
|
}
|
||
|
|
nav li.on a,
|
||
|
|
.nav li.on a {
|
||
|
|
font-weight: bold;
|
||
|
|
}
|
||
|
|
nav a:link,
|
||
|
|
nav a:visited,
|
||
|
|
.nav a:link,
|
||
|
|
.nav a:visited {
|
||
|
|
background-color: #001826;
|
||
|
|
color: #FFFFFF
|
||
|
|
;letter-spacing: 0.1em;
|
||
|
|
white-space: nowrap;
|
||
|
|
text-transform: uppercase;
|
||
|
|
text-decoration: none;
|
||
|
|
text-align: center;
|
||
|
|
padding: 1em;
|
||
|
|
display: block;
|
||
|
|
border-right: 2px solid #29495C;
|
||
|
|
border-bottom: none;
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
nav li:last-child a,
|
||
|
|
.nav li:last-child a {
|
||
|
|
border-right: none;
|
||
|
|
}
|
||
|
|
nav a:after,
|
||
|
|
.nav a:after {
|
||
|
|
content: '\0020';
|
||
|
|
color: transparent;
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
position: absolute;
|
||
|
|
top: 0;
|
||
|
|
left: 0;
|
||
|
|
opacity: 0;
|
||
|
|
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
|
||
|
|
filter: alpha(opacity=0);
|
||
|
|
border: 5px solid #29495C;
|
||
|
|
}
|
||
|
|
nav a:focus,
|
||
|
|
.nav a:focus {
|
||
|
|
color: #29495C;
|
||
|
|
}
|
||
|
|
nav a:hover:after,
|
||
|
|
nav a:active:after,
|
||
|
|
nav a:focus:after,
|
||
|
|
.nav a:hover:after,
|
||
|
|
.nav a:active:after,
|
||
|
|
.nav a:focus:after {
|
||
|
|
opacity: 1;
|
||
|
|
-ms-filter: none;
|
||
|
|
filter: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Content */
|
||
|
|
section h2,
|
||
|
|
.section h2 {
|
||
|
|
margin-bottom: 1em;
|
||
|
|
}
|
||
|
|
section > a:link,
|
||
|
|
section > a:visited,
|
||
|
|
.section > a:link,
|
||
|
|
.section > a:visited {
|
||
|
|
color: #29495C;
|
||
|
|
}
|
||
|
|
section > a:hover,
|
||
|
|
.section > a:hover {
|
||
|
|
text-decoration: none;
|
||
|
|
}
|
||
|
|
.error {
|
||
|
|
background-color: #DBCAD5;
|
||
|
|
color: #5C2949;
|
||
|
|
padding: .5em 2em;
|
||
|
|
margin: -1em 0 1em 0;
|
||
|
|
border: 1px solid #5C2949;
|
||
|
|
}
|
||
|
|
.error a {
|
||
|
|
color: #5C2949;
|
||
|
|
}
|
||
|
|
.error a:hover {
|
||
|
|
text-decoration: none;
|
||
|
|
}
|
||
|
|
section > article:not(:last-child),
|
||
|
|
.section > .article:not(:last-child) {
|
||
|
|
margin-bottom: 2em;
|
||
|
|
}
|
||
|
|
article,
|
||
|
|
.article {
|
||
|
|
background-color: #001826;
|
||
|
|
color: #FFFFFF;
|
||
|
|
padding: 2em;
|
||
|
|
}
|
||
|
|
article h3,
|
||
|
|
.article h3 {
|
||
|
|
text-shadow: 1px 1px 0 rgba(0,0,0,0.5);
|
||
|
|
margin-bottom: 0.7em;
|
||
|
|
border-bottom: 2px solid #29495C;
|
||
|
|
}
|
||
|
|
article h4,
|
||
|
|
article h5,
|
||
|
|
.article h4,
|
||
|
|
.article h5 {
|
||
|
|
margin-top: 2em;
|
||
|
|
}
|
||
|
|
article h3 + h4,
|
||
|
|
article h3 + h5,
|
||
|
|
.article h3 + h4,
|
||
|
|
.article h3 + h5 {
|
||
|
|
margin-top: 0;
|
||
|
|
}
|
||
|
|
article > *:not(:last-child),
|
||
|
|
.article > *:not(:last-child) {
|
||
|
|
margin-bottom: 1em;
|
||
|
|
}
|
||
|
|
article img,
|
||
|
|
.article img {
|
||
|
|
max-width: 100%;
|
||
|
|
}
|
||
|
|
article ul,
|
||
|
|
.article ul {
|
||
|
|
padding-left: 1em;
|
||
|
|
margin-top: 1em;
|
||
|
|
}
|
||
|
|
article li > ul,
|
||
|
|
.article li > ul {
|
||
|
|
margin-top: 0;
|
||
|
|
}
|
||
|
|
article nav,
|
||
|
|
.article .nav {
|
||
|
|
border-right: 2px solid #29495C;
|
||
|
|
border-left: 2px solid #29495C;
|
||
|
|
}
|
||
|
|
article nav ul,
|
||
|
|
.article .nav ul {
|
||
|
|
padding: 0;
|
||
|
|
margin-top: 0;
|
||
|
|
}
|
||
|
|
article aside,
|
||
|
|
.article .aside {
|
||
|
|
color: #29495C;
|
||
|
|
text-align: center;
|
||
|
|
letter-spacing: 0.1em;
|
||
|
|
text-transform: uppercase;
|
||
|
|
padding: 1em 2em 0 2em;
|
||
|
|
margin: 2em -2em -1em -2em;
|
||
|
|
border-top: 2px solid #29495C;
|
||
|
|
}
|
||
|
|
article aside a:link,
|
||
|
|
article aside a:visited,
|
||
|
|
.article .aside a:link,
|
||
|
|
.article .aside a:visited {
|
||
|
|
font-weight: bold;
|
||
|
|
text-decoration: none;
|
||
|
|
}
|
||
|
|
.play:link,
|
||
|
|
.play:visited {
|
||
|
|
background-color: #000E17;
|
||
|
|
color: #FFFFFF;
|
||
|
|
text-decoration: none;
|
||
|
|
white-space: nowrap;
|
||
|
|
display: inline-block;
|
||
|
|
padding: 1em;
|
||
|
|
}
|
||
|
|
.play:hover,
|
||
|
|
.play:active,
|
||
|
|
.play:focus {
|
||
|
|
color: #9AABB5;
|
||
|
|
}
|
||
|
|
.play span {
|
||
|
|
font-weight: bold;
|
||
|
|
}
|
||
|
|
ul.buttons {
|
||
|
|
display: -webkit-box;
|
||
|
|
display: -moz-box;
|
||
|
|
display: -ms-flexbox;
|
||
|
|
display: -webkit-flex;
|
||
|
|
display: flex;
|
||
|
|
-webkit-flex-flow: row;
|
||
|
|
flex-direction: row;
|
||
|
|
-webkit-box-pack: justify;
|
||
|
|
-moz-box-pack: justify;
|
||
|
|
-webkit-justify-content: space-between;
|
||
|
|
-ms-flex-pack: justify;
|
||
|
|
justify-content: space-between;
|
||
|
|
padding: 0;
|
||
|
|
list-style: none;
|
||
|
|
}
|
||
|
|
ul.buttons li {
|
||
|
|
width: 49%;
|
||
|
|
}
|
||
|
|
ul.buttons a {
|
||
|
|
background-color: #000E17;
|
||
|
|
color: #FFFFFF;
|
||
|
|
font-size: 1.25em;
|
||
|
|
font-weight: bold;
|
||
|
|
text-decoration: none;
|
||
|
|
display: block;
|
||
|
|
padding: 1em;
|
||
|
|
}
|
||
|
|
ul.buttons a:hover {
|
||
|
|
text-decoration: underline;
|
||
|
|
}
|
||
|
|
ul.buttons .linux {
|
||
|
|
background: #000E17 url('../img/logo-linux.svg') no-repeat 95% 50%;
|
||
|
|
background-size: 2em;
|
||
|
|
}
|
||
|
|
ul.buttons .windows {
|
||
|
|
background: #000E17 url('../img/logo-windows.svg') no-repeat 95% 50%;
|
||
|
|
background-size: 2em;
|
||
|
|
}
|
||
|
|
ul.buttons span {
|
||
|
|
display: inline-block;
|
||
|
|
margin-top: 1em;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Footer */
|
||
|
|
footer,
|
||
|
|
.footer {
|
||
|
|
text-align: center;
|
||
|
|
padding: 2em 0;
|
||
|
|
}
|
||
|
|
footer a:link,
|
||
|
|
footer a:visited,
|
||
|
|
.footer a:link,
|
||
|
|
.footer a:visited {
|
||
|
|
color: #29495C;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Desktop and tablet */
|
||
|
|
@media only screen and (max-width: 1024px) {
|
||
|
|
#xiphbar > div > a {
|
||
|
|
text-align: center;
|
||
|
|
position: static;
|
||
|
|
padding-top: 0.5em;
|
||
|
|
}
|
||
|
|
#xiphbar > div > ul {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
article nav ul:before,
|
||
|
|
.article .nav ul:before,
|
||
|
|
nav ul:after,
|
||
|
|
.nav ul:after {
|
||
|
|
display: block;
|
||
|
|
}
|
||
|
|
article nav li,
|
||
|
|
.article .nav li {
|
||
|
|
display: block;
|
||
|
|
width: auto;
|
||
|
|
}
|
||
|
|
article nav a:after,
|
||
|
|
.article .nav a:after {
|
||
|
|
border-right: 7px solid #29495C;
|
||
|
|
border-left: 7px solid #29495C;
|
||
|
|
}
|
||
|
|
article nav li:not(:last-child) a,
|
||
|
|
.article .nav li:not(:last-child) a {
|
||
|
|
border-right: none;
|
||
|
|
border-bottom: 2px solid #29495C;
|
||
|
|
}
|
||
|
|
ul.buttons {
|
||
|
|
-webkit-flex-flow: column;
|
||
|
|
flex-direction: column;
|
||
|
|
}
|
||
|
|
ul.buttons li {
|
||
|
|
width: 100%;
|
||
|
|
}
|
||
|
|
ul.buttons li:not(:last-child) {
|
||
|
|
margin-bottom: 1em;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Tablet and smartphone */
|
||
|
|
@media only screen and (max-width: 768px) {
|
||
|
|
* {
|
||
|
|
-ms-text-size-adjust: 100%;
|
||
|
|
-webkit-text-size-adjust: 100%;
|
||
|
|
}
|
||
|
|
input, textarea {
|
||
|
|
width: 100%;
|
||
|
|
}
|
||
|
|
.table-block {
|
||
|
|
word-break: break-all;
|
||
|
|
}
|
||
|
|
.table-block thead {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
.table-block td {
|
||
|
|
display: block;
|
||
|
|
}
|
||
|
|
.table-block tr td:first-child {
|
||
|
|
font-weight: bold;
|
||
|
|
padding-bottom: 0;
|
||
|
|
border-bottom: none;
|
||
|
|
}
|
||
|
|
.table-block tr td:last-child {
|
||
|
|
border-top: none;
|
||
|
|
}
|
||
|
|
.table-block tr:not(:last-child) td:last-child {
|
||
|
|
border-bottom: none;
|
||
|
|
}
|
||
|
|
.table-flipscroll {
|
||
|
|
display: block;
|
||
|
|
width: 100%;
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
.table-flipscroll:after {
|
||
|
|
content: ' ';
|
||
|
|
background-image: -ms-linear-gradient(left, transparent 0%, #001826 100%);
|
||
|
|
background-image: -moz-linear-gradient(left, transparent 0%, #001826 100%);
|
||
|
|
background-image: -o-linear-gradient(left, transparent 0%, #001826 100%);
|
||
|
|
background-image: -webkit-gradient(linear, left top, right top, color-stop(0, transparent), color-stop(1, #001826));
|
||
|
|
background-image: -webkit-linear-gradient(left, transparent 0%, #001826 100%);
|
||
|
|
background-image: linear-gradient(to right, transparent 0%, #001826 100%);
|
||
|
|
position: absolute;
|
||
|
|
top: 0;
|
||
|
|
right: 0;
|
||
|
|
width: 2em;
|
||
|
|
height: 100%;
|
||
|
|
}
|
||
|
|
.table-flipscroll thead {
|
||
|
|
display: block;
|
||
|
|
float: left;
|
||
|
|
}
|
||
|
|
.table-flipscroll thead tr {
|
||
|
|
display: block;
|
||
|
|
}
|
||
|
|
.table-flipscroll th {
|
||
|
|
white-space: nowrap;
|
||
|
|
text-align: right;
|
||
|
|
display: block;
|
||
|
|
border-bottom: 3px solid #000E17;
|
||
|
|
}
|
||
|
|
.table-flipscroll tbody {
|
||
|
|
white-space: nowrap;
|
||
|
|
display: block;
|
||
|
|
width: auto;
|
||
|
|
position: relative;
|
||
|
|
overflow-x: auto;
|
||
|
|
}
|
||
|
|
.table-flipscroll tbody tr {
|
||
|
|
display: inline-block;
|
||
|
|
vertical-align: top;
|
||
|
|
}
|
||
|
|
.table-flipscroll tbody tr:first-child td {
|
||
|
|
border-left: none;
|
||
|
|
}
|
||
|
|
.table-flipscroll tbody tr:not(:last-child) td {
|
||
|
|
border-right: none;
|
||
|
|
}
|
||
|
|
.table-flipscroll td {
|
||
|
|
text-align: left;
|
||
|
|
display: block;
|
||
|
|
border-bottom: none;
|
||
|
|
}
|
||
|
|
.table-flipscroll td:last-child {
|
||
|
|
border-bottom: 2px solid #000E17;
|
||
|
|
}
|
||
|
|
nav,
|
||
|
|
.nav {
|
||
|
|
width: auto;
|
||
|
|
}
|
||
|
|
nav ul:before,
|
||
|
|
nav ul:after,
|
||
|
|
.nav ul:before,
|
||
|
|
.nav ul:after {
|
||
|
|
display: block;
|
||
|
|
}
|
||
|
|
nav li,
|
||
|
|
.nav li {
|
||
|
|
display: block;
|
||
|
|
width: auto;
|
||
|
|
}
|
||
|
|
nav a:after,
|
||
|
|
nav a:after,
|
||
|
|
.nav a:after,
|
||
|
|
.nav a:after {
|
||
|
|
border-right: 7px solid #29495C;
|
||
|
|
border-left: 7px solid #29495C;
|
||
|
|
}
|
||
|
|
nav li:not(:last-child) a,
|
||
|
|
.nav li:not(:last-child) a {
|
||
|
|
border-right: none;
|
||
|
|
border-bottom: 2px solid #29495C;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Smartphone */
|
||
|
|
@media only screen and (max-width: 450px) {
|
||
|
|
body > *:not(:first-child) {
|
||
|
|
width: 100%;
|
||
|
|
}
|
||
|
|
#xiphbar > div {
|
||
|
|
width: 100%;
|
||
|
|
padding: 0 2em;
|
||
|
|
}
|
||
|
|
#xiphbar > div > a {
|
||
|
|
text-align: left;
|
||
|
|
}
|
||
|
|
#xiphbar img {
|
||
|
|
max-width: 100%;
|
||
|
|
}
|
||
|
|
header h1,
|
||
|
|
.header h1 {
|
||
|
|
line-height: 1;
|
||
|
|
padding: 1em;
|
||
|
|
width: auto;
|
||
|
|
}
|
||
|
|
header h1 span,
|
||
|
|
.header h1 span {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
header nav label,
|
||
|
|
.header nav label {
|
||
|
|
display: block;
|
||
|
|
}
|
||
|
|
header nav ul,
|
||
|
|
.header nav ul {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
section h2,
|
||
|
|
section > p,
|
||
|
|
.section h2,
|
||
|
|
.section > p {
|
||
|
|
padding: 0 1em;
|
||
|
|
}
|
||
|
|
.error {
|
||
|
|
border-right: none;
|
||
|
|
border-left: none;
|
||
|
|
}
|
||
|
|
article > *:not(:first-child):not(.buttons),
|
||
|
|
.article > *:not(:first-child):not(.buttons) {
|
||
|
|
text-align: justify;
|
||
|
|
}
|
||
|
|
.play {
|
||
|
|
width: 100%;
|
||
|
|
}
|
||
|
|
footer,
|
||
|
|
.footer {
|
||
|
|
padding: 2em;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Print */
|
||
|
|
@media print {
|
||
|
|
* {
|
||
|
|
background-color: #FFFFFF !important;
|
||
|
|
color: #000000 !important;
|
||
|
|
text-shadow: none !important;
|
||
|
|
text-align: left !important;
|
||
|
|
border: none;
|
||
|
|
width: 100% !important;
|
||
|
|
}
|
||
|
|
h1,
|
||
|
|
h2,
|
||
|
|
h3 {
|
||
|
|
font-size: 1.25em;
|
||
|
|
}
|
||
|
|
h3,
|
||
|
|
h4 {
|
||
|
|
page-break-after: avoid;
|
||
|
|
}
|
||
|
|
pre {
|
||
|
|
page-break-inside: avoid;
|
||
|
|
}
|
||
|
|
table:after {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
th,
|
||
|
|
td {
|
||
|
|
width: auto !important;
|
||
|
|
border: 1px solid #000000;
|
||
|
|
}
|
||
|
|
#xiphbar,
|
||
|
|
nav,
|
||
|
|
.nav {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
header,
|
||
|
|
.header {
|
||
|
|
box-shadow: none;
|
||
|
|
margin: 0;
|
||
|
|
}
|
||
|
|
article,
|
||
|
|
.article {
|
||
|
|
padding: 0 1em;
|
||
|
|
}
|
||
|
|
article h3,
|
||
|
|
.article h3 {
|
||
|
|
border-bottom: none;
|
||
|
|
}
|
||
|
|
article a:after,
|
||
|
|
.article a:after {
|
||
|
|
content: ' [' attr(href) ']';
|
||
|
|
}
|
||
|
|
article aside,
|
||
|
|
.article aside {
|
||
|
|
text-transform: none;
|
||
|
|
padding: 0;
|
||
|
|
margin: 0;
|
||
|
|
border-top: none;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Highlight (Solarized Dark) */
|
||
|
|
.highlight{background-color:#073642;color:#93a1a1}
|
||
|
|
.highlight .c{color:#586e75 !important;}
|
||
|
|
.highlight .cm{color:#586e75 !important;}
|
||
|
|
.highlight .cp{color:#586e75 !important;}
|
||
|
|
.highlight .c1{color:#586e75 !important;}
|
||
|
|
.highlight .cs{color:#586e75 !important;font-weight:bold !important;}
|
||
|
|
.highlight .err{color:#dc322f !important;background:none !important;}
|
||
|
|
.highlight .k{color:#cb4b16 !important}
|
||
|
|
.highlight .o{color:#93a1a1 !important;font-weight:bold !important;}
|
||
|
|
.highlight .p{color:#93a1a1 !important}
|
||
|
|
.highlight .ow{color:#2aa198 !important;font-weight:bold !important;}
|
||
|
|
.highlight .gd{color:#93a1a1 !important;background-color:#372c34 !important;display:inline-block;}
|
||
|
|
.highlight .gd .x{color:#93a1a1 !important;background-color:#4d2d33 !important;display:inline-block;}
|
||
|
|
.highlight .ge{color:#93a1a1 !important;}
|
||
|
|
.highlight .gr{color:#aa0000}
|
||
|
|
.highlight .gh{color:#586e75 !important;}
|
||
|
|
.highlight .gi{color:#93a1a1 !important;background-color:#1a412b !important;display:inline-block;}
|
||
|
|
.highlight .gi .x{color:#93a1a1 !important;background-color:#355720 !important;display:inline-block;}
|
||
|
|
.highlight .go{color:#888888;}
|
||
|
|
.highlight .gp{color:#555555;}
|
||
|
|
.highlight .gs{color:#93a1a1 !important;font-weight:bold !important;}
|
||
|
|
.highlight .gu{color:#6c71c4 !important;}
|
||
|
|
.highlight .gt{color:#aa0000;}
|
||
|
|
.highlight .kc{color:#859900 !important;font-weight:bold !important;}
|
||
|
|
.highlight .kd{color:#268bd2 !important;}
|
||
|
|
.highlight .kp{color:#cb4b16 !important;font-weight:bold !important;}
|
||
|
|
.highlight .kr{color:#d33682 !important;font-weight:bold !important;}
|
||
|
|
.highlight .kt{color:#2aa198 !important;}
|
||
|
|
.highlight .n{color:#268bd2 !important;}
|
||
|
|
.highlight .na{color:#268bd2 !important;}
|
||
|
|
.highlight .nb{color:#859900 !important;}
|
||
|
|
.highlight .nc{color:#d33682 !important;}
|
||
|
|
.highlight .no{color:#b58900 !important;}
|
||
|
|
.highlight .ni{color:#800080;}
|
||
|
|
.highlight .nl{color:#859900 !important;}
|
||
|
|
.highlight .ne{color:#268bd2 !important;font-weight:bold !important;}
|
||
|
|
.highlight .nf{color:#268bd2 !important;font-weight:bold !important;}
|
||
|
|
.highlight .nn{color:#b58900 !important;}
|
||
|
|
.highlight .nt{color:#268bd2 !important;font-weight:bold !important;}
|
||
|
|
.highlight .nx{color:#b58900 !important;}
|
||
|
|
.highlight .bp{color:#999999;}
|
||
|
|
.highlight .vc{color:#008080;}
|
||
|
|
.highlight .vg{color:#268bd2 !important;}
|
||
|
|
.highlight .vi{color:#268bd2 !important;}
|
||
|
|
.highlight .nv{color:#268bd2 !important;}
|
||
|
|
.highlight .w{color:#bbbbbb;}
|
||
|
|
.highlight .mf{color:#2aa198 !important;}
|
||
|
|
.highlight .m{color:#2aa198 !important;}
|
||
|
|
.highlight .mh{color:#2aa198 !important;}
|
||
|
|
.highlight .mi{color:#2aa198 !important;}
|
||
|
|
.highlight .mo{color:#009999;}
|
||
|
|
.highlight .s{color:#2aa198 !important;}
|
||
|
|
.highlight .sb{color:#d14;}
|
||
|
|
.highlight .sc{color:#d14;}
|
||
|
|
.highlight .sd{color:#2aa198 !important;}
|
||
|
|
.highlight .s2{color:#2aa198 !important;}
|
||
|
|
.highlight .se{color:#dc322f !important;}
|
||
|
|
.highlight .sh{color:#d14;}
|
||
|
|
.highlight .si{color:#268bd2 !important;}
|
||
|
|
.highlight .sx{color:#d14;}
|
||
|
|
.highlight .sr{color:#2aa198 !important;}
|
||
|
|
.highlight .s1{color:#2aa198 !important;}
|
||
|
|
.highlight .ss{color:#990073;}
|
||
|
|
.highlight .il{color:#009999;}
|
||
|
|
.highlight div .gd,.highlight div .gd .x,.highlight div .gi,.highlight div .gi .x{display:inline-block;width:100%;}
|