+++ /dev/null
-html, body {
- margin: 0;
- padding: 0;
- height: 100%;
- background: black;
- color: #ccc;
- font-family: Lato; }
-
-header {
- font-size: 16px; }
- header a {
- text-decoration: none;
- color: #ddd;
- display: block;
- padding: .5em;
- float: left; }
- header a:before {
- content: url(/static/img/brackets.png);
- margin-right: .5em;
- vertical-align: middle; }
- header #buy {
- padding: 4px 10px 0 10px;
- float: right; }
-
-.fnp-logo {
- text-align: right;
- margin-top: 8.5em;
- text-align: center; }
- .fnp-logo img {
- height: 4em; }
-
-h1.main {
- margin-left: 1em;
- font-size: 5vw; }
- @media screen and (min-width: 45em) {
- h1.main {
- font-size: 2vw; } }
-
-#intro {
- background-color: #222; }
-
-.desc-container, .right-desc-container {
- display: flex;
- flex-direction: column;
- justify-content: space-around;
- position: absolute;
- left: 4.75em;
- top: 6.75em;
- bottom: 6.75em;
- right: 4.75em; }
-
-.right-desc-container {
- top: 14em; }
-
-.card-container, .three-container {
- display: block;
- line-height: 1.3em;
- position: relative;
- font-size: 4vw;
- clear: both;
- width: 100%; }
- @media screen and (min-width: 45em) {
- .card-container, .three-container {
- font-size: 2vw;
- width: 50%;
- display: inline-block; } }
- .card-container .card-dummy, .three-container .card-dummy {
- padding-top: 148.39%; }
-
-.three-container {
- font-size: 4vw; }
- @media screen and (min-width: 45em) {
- .three-container {
- font-size: 1.3333vw;
- width: 33.33%;
- display: inline-block; } }
-
-.list-card {
- font-size: 1.5em;
- padding: 1em;
- display: flex;
- flex-direction: column;
- justify-content: space-around; }
- .list-card ul {
- column-count: 2;
- -moz-column-count: 2;
- -webkit-column-count: 2;
- column-gap: 1.5em;
- -moz-column-gap: 1.5em;
- -webkit-column-gap: 1.5em;
- list-style: none;
- padding: 0;
- margin: 0;
- line-height: 1em; }
- .list-card ul li {
- margin-bottom: 0.6em; }
-
-.card, .list-card {
- position: absolute;
- top: 0;
- bottom: 0;
- left: 0;
- right: 0; }
- .card h1, .list-card h1 {
- font-size: 1.5em;
- margin-top: 1.5em;
- width: 14.9em;
- text-align: right;
- text-transform: uppercase;
- line-height: 1.3em; }
- .card h1 .next, .list-card h1 .next {
- display: block;
- margin-right: 2em; }
- .card a, .list-card a {
- color: #ccc;
- text-decoration: none; }
- .card a:hover, .list-card a:hover {
- text-decoration: underline; }
- .card .examples p, .list-card .examples p, .card .usage p, .list-card .usage p, .card .recommendations p, .list-card .recommendations p {
- font-size: .85em;
- margin: .5em 0; }
- .card .examples, .list-card .examples {
- text-transform: uppercase;
- text-align: center; }
- .card .examples p, .list-card .examples p {
- font-size: 1em;
- line-height: 1.2em; }
- .card .usage, .list-card .usage {
- hyphens: auto;
- -moz-hyphens: auto; }
- .card .recommendations, .list-card .recommendations {
- hyphens: auto;
- -moz-hyphens: auto; }
- .card .inside-card, .list-card .inside-card {
- margin: 0 5em; }
-
-.chaotic {
- background-image: url(/static/img/bg/chaotic.png);
- background-size: 100%; }
-
-.neutral {
- background-image: url(/static/img/bg/neutral.png);
- background-size: 100%;
- color: #fff; }
- .neutral a {
- color: #fff; }
-
-.lawful {
- background-image: url(/static/img/bg/lawful.png);
- background-size: 100%; }
-
-.info {
- background-image: url(/static/img/bg/info.png);
- background-size: 100%;
- color: #656263; }
- .info a {
- color: #656263; }
-
-.btn {
- background: #fac878;
- background-image: -webkit-linear-gradient(top, #85db81, #2e8a0f);
- background-image: -moz-linear-gradient(top, #85db81, #2e8a0f);
- background-image: -ms-linear-gradient(top, #85db81, #2e8a0f);
- background-image: -o-linear-gradient(top, #85db81, #2e8a0f);
- background-image: linear-gradient(to bottom, #85db81, #2e8a0f);
- -webkit-border-radius: 100%;
- -moz-border-radius: 100%;
- border-radius: 100%;
- border: 1em double white;
- color: #ffffff;
- padding: 2em;
- text-decoration: none;
- cursor: pointer;
- font-size: 3.75vw; }
- @media screen and (min-width: 45em) {
- .btn {
- font-size: 1.25vw; } }
-
-.btn:hover {
- background: #fcba58;
- background-image: -webkit-linear-gradient(top, #abe6a9, #3db814);
- background-image: -moz-linear-gradient(top, #abe6a9, #3db814);
- background-image: -ms-linear-gradient(top, #abe6a9, #3db814);
- background-image: -o-linear-gradient(top, #abe6a9, #3db814);
- background-image: linear-gradient(to bottom, #abe6a9, #3db814);
- text-decoration: none; }
-
-.flatpage {
- background: #ddd;
- color: black;
- padding: 3em; }
-
-footer {
- margin: 3em 1em;
- font-size: .8em; }