@import url(https://fonts.googleapis.com/css?family=Droid+Sans);
@import url(https://fonts.googleapis.com/css?family=Lobster);
@import url(https://fonts.googleapis.com/css?family=Raleway:700);
@import url(https://fonts.googleapis.com/css?family=Lato:700);
@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:200,300,400,600,700,900);
html, body {
box-sizing: border-box;
}
*, *:before, *:after {
box-sizing: inherit;
}
body {
height: 100%;
width: 100%;
margin: 0;
padding: 0;
background: #de332e;
font-family: 'Source Sans Pro', sans-serif;
overflow-x: hidden;
}
div#header {
height: 59px;
width: 100%;
z-index: 1;
position: relative;
overflow: hidden;
}
div#mobile-header {
display: none;
}
div.page {
min-height: 100vh;
width: 100%;
padding: 15px 10px;
min-width: 700px;
position: relative;
font-weight: 300;
}
div.page.exactly-one-page {
max-height: 100vh;
}
div.page > div.centered {
max-width: 640px;
margin: 0 auto;
}
div.page > div.centered.questions > h1 {
font-family: 'Lobster', sans-serif;
font-size: 4em;
text-align: center;
margin: 32px 0 24px;
}
div.page > div.centered.questions > p+h1 {
margin-top: 64px;
}
div.page.blue a,
div.page.teal a {
color: #f26527;
}
div.page.blue a:focus,
div.page.blue a:hover,
div.page.teal a:focus,
div.page.teal a:hover {
color: #da4323;
}
div.page.blue a:visited,
div.page.teal a:visited {
color: #f26527;
}
div.page.blue > div.questions > div.contributors {
width: 596px;
margin: 0 auto;
overflow: hidden;
}
div.page.blue > div.questions > div.contributors+div {
margin-top: 16px;
}
div.page.blue > div.questions > div.contributors > div.contributors-cell {
margin: 0 auto 1em;
width: 348px;
overflow: hidden;
}
div.page.blue > div.questions > div.contributors > div.contributors-cell > div.contributor {
float: left;
display: inline;
width: 100px;
}
div.page.blue > div.questions > div.contributors > div.contributors-cell > div.contributor {
text-align: center;
font-size: 12px;
color: #fff;
}
div.page.blue > div.questions > div.contributors > div.contributors-cell > div.contributor > a:hover {
opacity: 0.9;
}
div.page.blue > div.questions > div.contributors > div.contributors-cell > div.contributor > a > img {
width: 100%;
border-radius: 50%;
margin-bottom: 9px;
}
div.page.blue > div.questions > div.contributors > div.contributors-cell > div.contributor+div {
margin-left: 24px;
}
div.page > div.centered > h2 {
margin: 32px 0;
}
div#header nav.nav {
float: right;
line-height: 43px;
font-family: 'Source Sans Pro', sans-serif;
}
div#header nav img#github-logo {
margin-right: 10px;
width: 40px;
height: auto;
}
div#header li.nav-item > a.nav-link {
color: #fff;
}
div.scala-logo-container {
width: 232px;
height: calc(400px + 13em);
margin: auto;
position: absolute;
top: 0; right: 0; bottom: 0; left: 0;
}
div.scala-logo-container > p {
margin: 0;
padding: 0;
height: 100%;
width: 100%;
}
div.scala-logo-container > p > img {
width: 100%;
height: auto;
}
h1#dotty {
font-family: 'Source Sans Pro', sans-serif;
font-weight: 700;
text-align: center;
font-size: 3.5em;
margin-top: 20px;
}
div.centered-subtitle {
text-align: center;
font-family: 'Source Sans Pro', sans-serif;
position: absolute;
bottom: 0;
left: 0;
right: 0;
}
div.centered-subtitle > a {
color: #fff;
}
div.centered-subtitle > a > i#scroll-down-arrow {
font-size: 3em;
}
pre {
background-color: #efefef;
border-radius: 4px;
padding: 4px 10px;
}
pre.bright {
background-color: #efefef;
border-radius: 4px;
padding: 4px 10px;
color: #bd4147;
text-align: left;
}
h1#getting-started {
margin-top: 25px;
}
div.centered-table > table {
width: 100%;
}
div.centered-table+p {
text-align: center;
margin-top: 2em;
}
/* Decorator classes */
.centered-text {
text-align: center;
clear: both;
}
.no-top-padding {
padding-top: 0 !important;
}
.page.no-top-padding {
margin-top: -32px;
}
.red {
background: rgb(202, 68, 94);
color: #fff;
}
.white {
background: #fff;
color: #000;
}
.blue {
background: #002B36;
color: #fff;
}
.teal {
background: #224951;
color: #fff;
}
div#build-status > div.centered > div.project {
margin-bottom: 2em;
position: relative;
}
div#build-status progress.progress {
position: relative;
height: 38px !important;
}
div#build-status progress.progress-animate:after {
content: "";
position: absolute;
top: 0; left: 0; bottom: 0; right: 0;
background-image: linear-gradient(
60deg,
rgba(255, 255, 255, .2) 25%,
transparent 25%,
transparent 50%,
rgba(255, 255, 255, .2) 50%,
rgba(255, 255, 255, .2) 75%,
transparent 75%,
transparent
);
z-index: 1;
background-size: 30px 52px;
animation: move 2s linear infinite;
border-top-right-radius: 0.2em;
border-bottom-right-radius: 0.2em;
border-top-left-radius: 0.2em;
border-bottom-left-radius: 0.2em;
overflow: hidden;
animation: move 0.5s linear infinite;
}
@keyframes move {
0% {
background-position: 0 0;
}
100% {
background-position: 88px 50px;
}
}
div#build-status h1.title {
margin-top: 1em;
}
div#build-status div.console-output {
font-family: "Source Sans pro";
font-weight: 600;
font-size: 15px;
}
div#build-status button.console-output-button,
div#build-status button.console-output-button:hover,
div#build-status button.console-output-button:active,
div#build-status button.console-output-button:focus,
div#build-status button.console-output-button:visited {
color: #f26527;
font-size: 13px !important;
position: absolute;
top: 7px;
right: 1px;
}
div#home-button-container {
position: fixed;
top: 2em;
left: 2em;
z-index: 2;
text-align: center;
color: #fff;
width: 41px;
}
a#home-button {
color: #fff;
}
a#home-button > img {
width: 100%;
}
/** Blog */
#content > div.page.teal > div > h1.blog-title {
margin-top: 1em;
}
#content > div.page.teal > div > h2.blog-sub-title {
font-size: 1.5rem;
margin: 0;
}
div.blog-post code {
font-weight: 400;
font-size: 100%;
border-radius: 2px;
background: transparent;
padding: 0 0.15rem;
color: #3ca7c7;
}
div.blog-post pre code {
color: #000;
}
div.author-container {
margin: 1em 0;
width: 100%;
overflow: hidden;
font-weight: 400;
}
div.author-container > img {
float: left;
width: 100px;
border-radius: 50%;
border: 2px solid #aaa;
margin-right: 1em;
}
div.author-container > div.float-container {
float: left;
margin-top: 1.3em;
}
div.author-container > div.float-container > div.author,
div.author-container > div.float-container > div.date {
font-size: 1.1em;
}
div#old-posts {
position: fixed;
z-index: 2;
top: 2em;
right: 0.5em;
color: #fff;
width: 265px;
overflow: ellipsis;
}
div#old-posts a,
div#old-posts a:hover,
div#old-posts a:focus,
div#old-posts a:visited {
color: #f26527;
}
/** End Blog */
/** Media queries for smaller devices */
@media screen and (max-width: 1194px) {
div#old-posts {
display: none;
}
}
@media screen and (max-width: 899px) {
div.blog-post > div.centered > h1 {
text-align: center;
}
div.blog-post > div.centered > div.author-container {
width: 140px;
text-align: center;
margin: 1em auto;
}
div.blog-post > div.centered > div.author-container > img {
width: 140px;
}
div.author-container > div.float-container {
float: none;
margin-top: 0;
}
div#home-button-container {
position: relative;
top: auto;
left: auto;
width: 100%;
padding: 15px 10px;
min-width: 700px;
}
div#home-button-container > a#home-button > span {
display: none;
}
div#home-button-container > a#home-button > img {
width: 55px;
height: auto;
}
}
/* Media query rules specifically for mobile devices */
@media
screen /* HiDPI device like Nexus 5 */
and (max-device-width: 360px)
and (max-device-height: 640px)
and (-webkit-device-pixel-ratio: 3)
,
screen /* Most mobile devices */
and (max-device-width: 480px)
and (orientation: portrait)
,
only screen /* iPhone 6 */
and (max-device-width: 667px)
and (-webkit-device-pixel-ratio: 2)
{
div#header {
display: none;
}
div#mobile-header {
display: block;
}
div#mobile-header > nav {
z-index: 2;
}
div#mobile-header > nav #collapsed-header > div > ul {
list-style-type: none;
padding-left: 0;
font-size: 2em;
}
#collapsed-header > div > ul > li > a {
color: #fff;
}
div#mobile-header nav #github-logo {
width: 41px;
}
div.page {
min-width: 0;
}
div.page > div.centered.questions > h1 {
font-size: 2.2em;
}
div#home-button-container {
min-width: 0;
}
div.page.blue > div.questions > div.contributors {
width: 338px;
}
div.page.blue > div.questions > div.contributors > div.contributors-cell {
width: 194px;
margin: 0 auto;
}
div.page.blue > div.questions > div.contributors > div.contributors-cell+div.contributors-cell {
margin: 2em auto 0;
}
div.page.blue > div.questions > div.contributors > div.contributors-cell > div.contributor {
width: 50px;
}
div.page.blue > div.questions > div.contributors > div.contributors-cell > div.contributor+div {
margin-left: 22px;
}
div.scala-logo-container {
width: 40%;
height: 84%;
top: 70px;
}
#content > div.page.red.exactly-one-page > div.scala-logo-container > div > p {
font-size: 0.8em;
}
/* Feature */
div.centered-table > table > tbody > tr > td:nth-child(1) {
font-size: 0.8em;
}
/* Status */
div.centered-table > table > tbody > tr > td:nth-child(2) {
font-size: 0.8em;
text-align: right;
}
div#header > nav.nav {
float: none;
}
div#header > nav.nav.nav-pills .nav-item+.nav-item {
margin-left: 0;
}
}