moth/www/res/style.css

130 lines
2.3 KiB
CSS
Raw Permalink Normal View History

2016-09-22 16:01:07 -06:00
@font-face {
font-family: 'Lato';
font-style: normal;
font-weight: 400;
src: local('Lato Regular'), local('Lato-Regular'), url(Lato-Regular.ttf) format('truetype');
}
@font-face {
font-family: 'Lato';
font-style: normal;
font-weight: 700;
src: local('Lato Bold'), local('Lato-Bold'), url(Lato-Bold.ttf) format('truetype');
}
@font-face {
font-family: 'Lato';
font-style: italic;
font-weight: 400;
src: local('Lato Italic'), local('Lato-Italic'), url(Lato-Italic.ttf) format('truetype');
}
@font-face {
font-family: 'Inconsolata';
2016-09-22 16:01:07 -06:00
font-style: normal;
font-weight: 400;
src: local('Inconsolata Regular'), local('Inconsolata-Regular'), url(Inconsolata-Regular.ttf) format('truetype');
2016-09-22 16:01:07 -06:00
}
2016-04-04 21:45:00 -06:00
2016-04-03 21:12:48 -06:00
html {
background: rgba(61, 50, 44, 0) url(brown-lines.jpg) no-repeat center center fixed;
background-size: cover;
color: #ccb;
height: 100%;
2016-09-22 09:53:03 -06:00
font-family: Lato, sans-serif;
2016-04-03 21:12:48 -06:00
}
2016-04-03 18:07:38 -06:00
2016-04-03 21:12:48 -06:00
body {
margin: 0;
height: 100%
}
2016-09-22 16:01:07 -06:00
pre, tt {
font-family: Inconsolata, monospace;
2016-10-15 21:47:50 -06:00
background-color: rgba(0, 0, 0, 0.3);
2016-09-22 16:01:07 -06:00
}
2016-04-03 21:12:48 -06:00
.terminal {
2016-04-03 21:23:16 -06:00
background: rgba(80, 70, 60, 0.96);
2016-04-03 21:12:48 -06:00
display: inline-block;
margin: 1%;
border: solid black 0.2em;
2016-04-04 21:45:00 -06:00
border-radius: 1em 1em 0.5em 1em;
2016-04-03 21:12:48 -06:00
overflow: auto;
}
.terminal p {
padding: 0.25em 0.5em;
}
#preview {
background-image: url(preview.png);
background-size: contain;
max-width: 40em;
display: block;
margin: 1% auto;
}
2016-04-03 21:12:48 -06:00
#overview, #messages {
width: 47%;
height: 20%;
}
#puzzles {
width: 24%;
height: 70%;
}
#main {
width: 70%;
height: 70%;
}
2016-04-03 21:23:16 -06:00
2016-04-04 21:45:00 -06:00
h1 {
text-align: center;
font-size: 120%;
}
2016-09-22 09:34:01 -06:00
a:link, .link {
2016-04-04 21:45:00 -06:00
color: #13a5de;
2016-09-22 09:34:01 -06:00
cursor: pointer;
2016-04-04 21:45:00 -06:00
}
a:visited {
color: #999999;
}
2016-09-22 09:34:01 -06:00
.category h2 {
margin: 0;
font-size: 100%;
2016-04-04 21:45:00 -06:00
}
2016-09-22 09:34:01 -06:00
.category ul {
2016-04-04 21:45:00 -06:00
margin: 0;
2016-09-22 09:34:01 -06:00
padding-left: 1em;
font-size: 90%;
}
.category li {
display: inline;
}
.category li + li:before {
content: " ";
2016-04-04 21:45:00 -06:00
}
2016-04-03 21:23:16 -06:00
@media (max-width: 52em) {
#overview, #messages, #puzzles, #main {
width: 96%;
}
2016-04-04 21:45:00 -06:00
}
::-webkit-scrollbar {
width: 0.7em;
}
::-webkit-scrollbar-track {
/* -webkit-box-shadow: inset 0 0 0.5em rgba(200, 200, 200, 0.3); */
background: rgba(0, 0, 0, 0.2);
}
::-webkit-scrollbar-thumb {
background: rgba(255, 255, 255, 0.2);
border-radius: 1em;
}