docs/ayu.css
html {
line-height: 1.15;
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%; }
body {
margin: 0; }
article,
aside,
footer,
header,
nav,
section {
display: block; }
h1 {
font-size: 2em;
margin: .67em 0; }
figcaption,
figure,
main {
display: block; }
figure {
margin: 1em 40px; }
hr {
box-sizing: content-box;
height: 0;
overflow: visible; }
pre {
font-family: monospace, monospace; }
a {
background-color: transparent;
-webkit-text-decoration-skip: objects; }
a:active,
a:hover {
outline-width: 0; }
abbr[title] {
border-bottom: none;
text-decoration: underline;
text-decoration: underline dotted; }
b,
strong {
font-weight: inherit; }
b,
strong {
font-weight: bolder; }
code,
kbd,
samp {
font-family: monospace, monospace;
font-size: 1em; }
dfn {
font-style: italic; }
mark {
background-color: #ff0;
color: #000; }
small {
font-size: 80%; }
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline; }
sub {
bottom: -0.25em; }
sup {
top: -0.5em; }
audio,
video {
display: inline-block; }
audio:not([controls]) {
display: none;
height: 0; }
img {
border-style: none; }
svg:not(:root) {
overflow: hidden; }
button,
input,
optgroup,
select,
textarea {
font-size: 100%;
line-height: 1.15;
margin: 0; }
button,
input {
overflow: visible; }
button,
select {
text-transform: none; }
button,
html [type="button"],
[type="reset"],
[type="submit"] {
-webkit-appearance: button; }
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
border-style: none;
padding: 0; }
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
outline: 1px dotted ButtonText; }
fieldset {
border: 1px solid #c0c0c0;
margin: 0 2px;
padding: .35em .625em .75em; }
legend {
box-sizing: border-box;
color: inherit;
display: table;
max-width: 100%;
padding: 0;
white-space: normal; }
progress {
display: inline-block;
vertical-align: baseline; }
textarea {
overflow: auto; }
[type="checkbox"],
[type="radio"] {
box-sizing: border-box;
padding: 0; }
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
height: auto; }
[type="search"] {
-webkit-appearance: textfield;
outline-offset: -2px; }
[type="search"]::-webkit-search-cancel-button,
[type="search"]::-webkit-search-decoration {
-webkit-appearance: none; }
::-webkit-file-upload-button {
-webkit-appearance: button;
font: inherit; }
details,
menu {
display: block; }
summary {
display: list-item; }
canvas {
display: inline-block; }
template {
display: none; }
[hidden] {
display: none; }
.container:after {
content: "";
display: table;
clear: both; }
.row:before, .row-reverse:before, .row:after, .row-reverse:after {
content: "";
display: table; }
.row:after, .row-reverse:after {
clear: both; }
.row, .row-reverse {
zoom: 1; }
.gr-0, .gr-1, .gr-2, .gr-3, .gr-4, .gr-5, .gr-6, .gr-7, .gr-8, .gr-9, .gr-10, .gr-11, .gr-12 {
display: inline-block;
min-height: 1px;
float: left;
box-sizing: border-box;
vertical-align: top;
padding-right: 10px;
padding-left: 10px; }
.gr-adapt {
display: table-cell;
width: 1px;
white-space: nowrap !important;
box-sizing: border-box;
padding-right: 10px;
padding-left: 10px; }
.gr-grow {
display: table-cell;
width: 99999px;
box-sizing: border-box;
padding-right: 10px;
padding-left: 10px; }
.push-0, .push-1, .push-2, .push-3, .push-4, .push-5, .push-6, .push-7, .push-8, .push-9, .push-10, .push-11, .push-12 {
position: relative; }
.pull-0, .pull-1, .pull-2, .pull-3, .pull-4, .pull-5, .pull-6, .pull-7, .pull-8, .pull-9, .pull-10, .pull-11, .pull-12 {
position: relative; }
.nowrap {
white-space: nowrap; }
.nowrap > * {
white-space: normal; }
.wrap {
white-space: normal; }
.gr-centered {
display: block !important;
float: none !important;
margin-left: auto !important;
margin-right: auto !important;
clear: both !important; }
@media screen and (max-width: 767px) {
.container--mobile:after {
content: "";
display: table;
clear: both; } }
@media screen and (max-width: 767px) {
.row--mobile:before, .row-reverse--mobile:before, .row--mobile:after, .row-reverse--mobile:after {
content: "";
display: table; }
.row--mobile:after, .row-reverse--mobile:after {
clear: both; }
.row--mobile, .row-reverse--mobile {
zoom: 1; } }
@media screen and (max-width: 767px) {
.gr-0--mobile, .gr-1--mobile, .gr-2--mobile, .gr-3--mobile, .gr-4--mobile, .gr-5--mobile, .gr-6--mobile, .gr-7--mobile, .gr-8--mobile, .gr-9--mobile, .gr-10--mobile, .gr-11--mobile, .gr-12--mobile {
display: inline-block;
min-height: 1px;
float: left;
box-sizing: border-box;
vertical-align: top;
padding-right: 10px;
padding-left: 10px; } }
@media screen and (max-width: 767px) {
.gr-adapt--mobile {
display: table-cell;
width: 1px;
white-space: nowrap !important;
box-sizing: border-box;
padding-right: 10px;
padding-left: 10px; } }
@media screen and (max-width: 767px) {
.gr-grow--mobile {
display: table-cell;
width: 99999px;
box-sizing: border-box;
padding-right: 10px;
padding-left: 10px; } }
@media screen and (max-width: 767px) {
.push-0--mobile, .push-1--mobile, .push-2--mobile, .push-3--mobile, .push-4--mobile, .push-5--mobile, .push-6--mobile, .push-7--mobile, .push-8--mobile, .push-9--mobile, .push-10--mobile, .push-11--mobile, .push-12--mobile {
position: relative; } }
@media screen and (max-width: 767px) {
.pull-0--mobile, .pull-1--mobile, .pull-2--mobile, .pull-3--mobile, .pull-4--mobile, .pull-5--mobile, .pull-6--mobile, .pull-7--mobile, .pull-8--mobile, .pull-9--mobile, .pull-10--mobile, .pull-11--mobile, .pull-12--mobile {
position: relative; } }
@media screen and (max-width: 767px) {
.nowrap--mobile {
white-space: nowrap; }
.nowrap--mobile > * {
white-space: normal; } }
@media screen and (max-width: 767px) {
.wrap--mobile {
white-space: normal; } }
@media screen and (max-width: 767px) {
.gr-centered--mobile {
display: block !important;
float: none !important;
margin-left: auto !important;
margin-right: auto !important;
clear: both !important; } }
@media screen and (min-width: 768px) and (max-width: 1024px) {
.container--tablet:after {
content: "";
display: table;
clear: both; } }
@media screen and (min-width: 768px) and (max-width: 1024px) {
.row--tablet:before, .row-reverse--tablet:before, .row--tablet:after, .row-reverse--tablet:after {
content: "";
display: table; }
.row--tablet:after, .row-reverse--tablet:after {
clear: both; }
.row--tablet, .row-reverse--tablet {
zoom: 1; } }
@media screen and (min-width: 768px) and (max-width: 1024px) {
.gr-0--tablet, .gr-1--tablet, .gr-2--tablet, .gr-3--tablet, .gr-4--tablet, .gr-5--tablet, .gr-6--tablet, .gr-7--tablet, .gr-8--tablet, .gr-9--tablet, .gr-10--tablet, .gr-11--tablet, .gr-12--tablet {
display: inline-block;
min-height: 1px;
float: left;
box-sizing: border-box;
vertical-align: top;
padding-right: 10px;
padding-left: 10px; } }
@media screen and (min-width: 768px) and (max-width: 1024px) {
.gr-adapt--tablet {
display: table-cell;
width: 1px;
white-space: nowrap !important;
box-sizing: border-box;
padding-right: 10px;
padding-left: 10px; } }
@media screen and (min-width: 768px) and (max-width: 1024px) {
.gr-grow--tablet {
display: table-cell;
width: 99999px;
box-sizing: border-box;
padding-right: 10px;
padding-left: 10px; } }
@media screen and (min-width: 768px) and (max-width: 1024px) {
.push-0--tablet, .push-1--tablet, .push-2--tablet, .push-3--tablet, .push-4--tablet, .push-5--tablet, .push-6--tablet, .push-7--tablet, .push-8--tablet, .push-9--tablet, .push-10--tablet, .push-11--tablet, .push-12--tablet {
position: relative; } }
@media screen and (min-width: 768px) and (max-width: 1024px) {
.pull-0--tablet, .pull-1--tablet, .pull-2--tablet, .pull-3--tablet, .pull-4--tablet, .pull-5--tablet, .pull-6--tablet, .pull-7--tablet, .pull-8--tablet, .pull-9--tablet, .pull-10--tablet, .pull-11--tablet, .pull-12--tablet {
position: relative; } }
@media screen and (min-width: 768px) and (max-width: 1024px) {
.nowrap--tablet {
white-space: nowrap; }
.nowrap--tablet > * {
white-space: normal; } }
@media screen and (min-width: 768px) and (max-width: 1024px) {
.wrap--tablet {
white-space: normal; } }
@media screen and (min-width: 768px) and (max-width: 1024px) {
.gr-centered--tablet {
display: block !important;
float: none !important;
margin-left: auto !important;
margin-right: auto !important;
clear: both !important; } }
@media screen and (max-width: 400px) {
@-ms-viewport {
width: device-width; } }
#gridle-settings {
content: '{ "version" : "2.0.48", "states" : { "default":{ "name" : "default", "min-width" : null, "max-width" : null, "query" : null, "classes" : true, "context" : "12", "column-width" : null, "gutter-width" : "20px", "gutter-height" : "0", "gutter-top" : "0", "gutter-right" : "10px", "gutter-bottom" : "0", "gutter-left" : "10px", "direction" : "ltr", "dir-attribute" : false, "name-multiplicator" : "1", "states-classes" : false, "classes-prefix" : null, "_" : true }, "mobile":{ "name" : "mobile", "min-width" : null, "max-width" : "767px", "query" : "screen and (max-width: 767px)", "classes" : true, "context" : "12", "column-width" : null, "gutter-width" : "20px", "gutter-height" : "0", "gutter-top" : "0", "gutter-right" : "10px", "gutter-bottom" : "0", "gutter-left" : "10px", "direction" : "ltr", "dir-attribute" : false, "name-multiplicator" : "1", "states-classes" : false, "classes-prefix" : null, "_" : true }, "tablet":{ "name" : "tablet", "min-width" : "768px", "max-width" : "1024px", "query" : "screen and (min-width: 768px) and (max-width: 1024px)", "classes" : true, "context" : "12", "column-width" : null, "gutter-width" : "20px", "gutter-height" : "0", "gutter-top" : "0", "gutter-right" : "10px", "gutter-bottom" : "0", "gutter-left" : "10px", "direction" : "ltr", "dir-attribute" : false, "name-multiplicator" : "1", "states-classes" : false, "classes-prefix" : null, "_" : true }} }'; }
.gr-0 {
width: 0%; }
.push-0 {
left: 0%;
right: auto; }
.pull-0 {
right: 0%;
left: auto; }
.prefix-0 {
margin-left: 0%; }
.suffix-0 {
margin-right: 0%; }
.gr-1 {
width: 8.33333%; }
.push-1 {
left: 8.33333%;
right: auto; }
.pull-1 {
right: 8.33333%;
left: auto; }
.prefix-1 {
margin-left: 8.33333%; }
.suffix-1 {
margin-right: 8.33333%; }
.gr-2 {
width: 16.66667%; }
.push-2 {
left: 16.66667%;
right: auto; }
.pull-2 {
right: 16.66667%;
left: auto; }
.prefix-2 {
margin-left: 16.66667%; }
.suffix-2 {
margin-right: 16.66667%; }
.gr-3 {
width: 25%; }
.push-3 {
left: 25%;
right: auto; }
.pull-3 {
right: 25%;
left: auto; }
.prefix-3 {
margin-left: 25%; }
.suffix-3 {
margin-right: 25%; }
.gr-4 {
width: 33.33333%; }
.push-4 {
left: 33.33333%;
right: auto; }
.pull-4 {
right: 33.33333%;
left: auto; }
.prefix-4 {
margin-left: 33.33333%; }
.suffix-4 {
margin-right: 33.33333%; }
.gr-5 {
width: 41.66667%; }
.push-5 {
left: 41.66667%;
right: auto; }
.pull-5 {
right: 41.66667%;
left: auto; }
.prefix-5 {
margin-left: 41.66667%; }
.suffix-5 {
margin-right: 41.66667%; }
.gr-6 {
width: 50%; }
.push-6 {
left: 50%;
right: auto; }
.pull-6 {
right: 50%;
left: auto; }
.prefix-6 {
margin-left: 50%; }
.suffix-6 {
margin-right: 50%; }
.gr-7 {
width: 58.33333%; }
.push-7 {
left: 58.33333%;
right: auto; }
.pull-7 {
right: 58.33333%;
left: auto; }
.prefix-7 {
margin-left: 58.33333%; }
.suffix-7 {
margin-right: 58.33333%; }
.gr-8 {
width: 66.66667%; }
.push-8 {
left: 66.66667%;
right: auto; }
.pull-8 {
right: 66.66667%;
left: auto; }
.prefix-8 {
margin-left: 66.66667%; }
.suffix-8 {
margin-right: 66.66667%; }
.gr-9 {
width: 75%; }
.push-9 {
left: 75%;
right: auto; }
.pull-9 {
right: 75%;
left: auto; }
.prefix-9 {
margin-left: 75%; }
.suffix-9 {
margin-right: 75%; }
.gr-10 {
width: 83.33333%; }
.push-10 {
left: 83.33333%;
right: auto; }
.pull-10 {
right: 83.33333%;
left: auto; }
.prefix-10 {
margin-left: 83.33333%; }
.suffix-10 {
margin-right: 83.33333%; }
.gr-11 {
width: 91.66667%; }
.push-11 {
left: 91.66667%;
right: auto; }
.pull-11 {
right: 91.66667%;
left: auto; }
.prefix-11 {
margin-left: 91.66667%; }
.suffix-11 {
margin-right: 91.66667%; }
.gr-12 {
width: 100%; }
.push-12 {
left: 100%;
right: auto; }
.pull-12 {
right: 100%;
left: auto; }
.prefix-12 {
margin-left: 100%; }
.suffix-12 {
margin-right: 100%; }
.float-left {
float: left; }
.float-right {
float: right; }
.clear {
clear: both; }
.clear-left {
clear: left; }
.clear-right {
clear: right; }
.no-gutter {
padding-top: 0;
padding-right: 0;
padding-bottom: 0;
padding-left: 0; }
.no-gutter-left {
padding-left: 0; }
.no-gutter-right {
padding-right: 0; }
.no-gutter-top {
padding-top: 0; }
.no-gutter-bottom {
padding-bottom: 0; }
.gutter {
padding-right: 10px;
padding-left: 10px; }
.gutter-left {
padding-left: 10px; }
.gutter-right {
padding-right: 10px; }
.auto-height {
height: inherit; }
.row {
padding-left: 0 !important;
padding-right: 0 !important;
margin-left: -10px;
margin-right: -10px; }
[class*=no-gutter] > .row {
margin-left: 0 !important;
margin-right: 0 !important; }
.row-reverse {
padding-left: 0 !important;
padding-right: 0 !important;
margin-left: -10px;
margin-right: -10px;
transform: rotateY(180deg); }
.row-reverse > [class*="gr-"] {
transform: rotateY(-180deg); }
[class*=no-gutter] > .row-reverse {
margin-left: 0 !important;
margin-right: 0 !important; }
.row-full {
width: 100vw;
margin-left: 50% !important;
margin-right: 0 !important;
-webkit-transform: translateX(-50%);
-moz-transition: translateX(-50%);
transform: translateX(-50%); }
.col {
padding-left: 0 !important;
padding-right: 0 !important;
margin-left: -10px;
margin-right: -10px; }
.col-reverse {
padding-left: 0 !important;
padding-right: 0 !important;
margin-left: -10px;
margin-right: -10px;
transform: rotateX(180deg); }
.col-reverse > [class*="gr-"] {
transform: rotateX(-180deg); }
.gr-table {
display: table-cell;
float: none;
vertical-align: top; }
.row-align-left {
font-size: 0;
clear: both;
text-align: left; }
.row-align-left > * {
float: none !important;
vertical-align: bottom;
font-size: 1rem; }
@-moz-document url-prefix() {
.row-align-left > * {
margin-right: -0.5px; } }
.row-align-center {
font-size: 0;
clear: both;
text-align: center; }
.row-align-center > * {
float: none !important;
vertical-align: bottom;
font-size: 1rem; }
@-moz-document url-prefix() {
.row-align-center > * {
margin-right: -0.5px; } }
.row-align-center > * {
text-align: left; }
.row-align-right {
font-size: 0;
clear: both;
text-align: right; }
.row-align-right > * {
float: none !important;
vertical-align: bottom;
font-size: 1rem; }
@-moz-document url-prefix() {
.row-align-right > * {
margin-right: -0.5px; } }
.row-align-right > * {
text-align: left; }
.row-align-middle {
font-size: 0;
clear: both;
vertical-align: middle; }
.row-align-middle > * {
float: none !important;
vertical-align: middle;
font-size: 1rem; }
@-moz-document url-prefix() {
.row-align-middle > * {
margin-right: -0.5px; } }
.row-align-top {
font-size: 0;
clear: both;
vertical-align: top; }
.row-align-top > * {
float: none !important;
vertical-align: top;
font-size: 1rem; }
@-moz-document url-prefix() {
.row-align-top > * {
margin-right: -0.5px; } }
.row-align-bottom {
font-size: 0;
clear: both;
vertical-align: bottom; }
.row-align-bottom > * {
float: none !important;
vertical-align: bottom;
font-size: 1rem; }
@-moz-document url-prefix() {
.row-align-bottom > * {
margin-right: -0.5px; } }
.hide {
display: none; }
.not-visible {
visibility: hidden; }
.show {
display: block; }
.show-inline {
display: inline-block; }
.visible {
visibility: visible; }
.row-debug {
position: relative;
z-index: 99999;
overflow: hidden; }
.row-debug:before {
pointer-events: none;
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 99999px;
background: linear-gradient(to right, transparent 50%, rgba(0, 0, 0, 0.02) 50%);
background-size: 16.66667% 100%;
z-index: 99999; }
body {
direction: ltr; }
@media screen and (max-width: 767px) {
.gr-0--mobile {
width: 0%; }
.push-0--mobile {
left: 0%;
right: auto; }
.pull-0--mobile {
right: 0%;
left: auto; }
.prefix-0--mobile {
margin-left: 0%; }
.suffix-0--mobile {
margin-right: 0%; }
.gr-1--mobile {
width: 8.33333%; }
.push-1--mobile {
left: 8.33333%;
right: auto; }
.pull-1--mobile {
right: 8.33333%;
left: auto; }
.prefix-1--mobile {
margin-left: 8.33333%; }
.suffix-1--mobile {
margin-right: 8.33333%; }
.gr-2--mobile {
width: 16.66667%; }
.push-2--mobile {
left: 16.66667%;
right: auto; }
.pull-2--mobile {
right: 16.66667%;
left: auto; }
.prefix-2--mobile {
margin-left: 16.66667%; }
.suffix-2--mobile {
margin-right: 16.66667%; }
.gr-3--mobile {
width: 25%; }
.push-3--mobile {
left: 25%;
right: auto; }
.pull-3--mobile {
right: 25%;
left: auto; }
.prefix-3--mobile {
margin-left: 25%; }
.suffix-3--mobile {
margin-right: 25%; }
.gr-4--mobile {
width: 33.33333%; }
.push-4--mobile {
left: 33.33333%;
right: auto; }
.pull-4--mobile {
right: 33.33333%;
left: auto; }
.prefix-4--mobile {
margin-left: 33.33333%; }
.suffix-4--mobile {
margin-right: 33.33333%; }
.gr-5--mobile {
width: 41.66667%; }
.push-5--mobile {
left: 41.66667%;
right: auto; }
.pull-5--mobile {
right: 41.66667%;
left: auto; }
.prefix-5--mobile {
margin-left: 41.66667%; }
.suffix-5--mobile {
margin-right: 41.66667%; }
.gr-6--mobile {
width: 50%; }
.push-6--mobile {
left: 50%;
right: auto; }
.pull-6--mobile {
right: 50%;
left: auto; }
.prefix-6--mobile {
margin-left: 50%; }
.suffix-6--mobile {
margin-right: 50%; }
.gr-7--mobile {
width: 58.33333%; }
.push-7--mobile {
left: 58.33333%;
right: auto; }
.pull-7--mobile {
right: 58.33333%;
left: auto; }
.prefix-7--mobile {
margin-left: 58.33333%; }
.suffix-7--mobile {
margin-right: 58.33333%; }
.gr-8--mobile {
width: 66.66667%; }
.push-8--mobile {
left: 66.66667%;
right: auto; }
.pull-8--mobile {
right: 66.66667%;
left: auto; }
.prefix-8--mobile {
margin-left: 66.66667%; }
.suffix-8--mobile {
margin-right: 66.66667%; }
.gr-9--mobile {
width: 75%; }
.push-9--mobile {
left: 75%;
right: auto; }
.pull-9--mobile {
right: 75%;
left: auto; }
.prefix-9--mobile {
margin-left: 75%; }
.suffix-9--mobile {
margin-right: 75%; }
.gr-10--mobile {
width: 83.33333%; }
.push-10--mobile {
left: 83.33333%;
right: auto; }
.pull-10--mobile {
right: 83.33333%;
left: auto; }
.prefix-10--mobile {
margin-left: 83.33333%; }
.suffix-10--mobile {
margin-right: 83.33333%; }
.gr-11--mobile {
width: 91.66667%; }
.push-11--mobile {
left: 91.66667%;
right: auto; }
.pull-11--mobile {
right: 91.66667%;
left: auto; }
.prefix-11--mobile {
margin-left: 91.66667%; }
.suffix-11--mobile {
margin-right: 91.66667%; }
.gr-12--mobile {
width: 100%; }
.push-12--mobile {
left: 100%;
right: auto; }
.pull-12--mobile {
right: 100%;
left: auto; }
.prefix-12--mobile {
margin-left: 100%; }
.suffix-12--mobile {
margin-right: 100%; }
.float-left--mobile {
float: left; }
.float-right--mobile {
float: right; }
.clear--mobile {
clear: both; }
.clear-left--mobile {
clear: left; }
.clear-right--mobile {
clear: right; }
.no-gutter--mobile {
padding-top: 0;
padding-right: 0;
padding-bottom: 0;
padding-left: 0; }
.no-gutter-left--mobile {
padding-left: 0; }
.no-gutter-right--mobile {
padding-right: 0; }
.no-gutter-top--mobile {
padding-top: 0; }
.no-gutter-bottom--mobile {
padding-bottom: 0; }
.gutter--mobile {
padding-right: 10px;
padding-left: 10px; }
.gutter-left--mobile {
padding-left: 10px; }
.gutter-right--mobile {
padding-right: 10px; }
.auto-height--mobile {
height: inherit; }
.row--mobile {
padding-left: 0 !important;
padding-right: 0 !important;
margin-left: -10px;
margin-right: -10px; }
[class*=no-gutter] > .row--mobile {
margin-left: 0 !important;
margin-right: 0 !important; }
.row-reverse--mobile {
padding-left: 0 !important;
padding-right: 0 !important;
margin-left: -10px;
margin-right: -10px;
transform: rotateY(180deg); }
.row-reverse--mobile > [class*="gr-"] {
transform: rotateY(-180deg); }
[class*=no-gutter] > .row-reverse--mobile {
margin-left: 0 !important;
margin-right: 0 !important; }
.row-full--mobile {
width: 100vw;
margin-left: 50% !important;
margin-right: 0 !important;
-webkit-transform: translateX(-50%);
-moz-transition: translateX(-50%);
transform: translateX(-50%); }
.col--mobile {
padding-left: 0 !important;
padding-right: 0 !important;
margin-left: -10px;
margin-right: -10px; }
.col-reverse--mobile {
padding-left: 0 !important;
padding-right: 0 !important;
margin-left: -10px;
margin-right: -10px;
transform: rotateX(180deg); }
.col-reverse--mobile > [class*="gr-"] {
transform: rotateX(-180deg); }
.gr-table--mobile {
display: table-cell;
float: none;
vertical-align: top; }
.row-align-left--mobile {
font-size: 0;
clear: both;
text-align: left; }
.row-align-left--mobile > * {
float: none !important;
vertical-align: bottom;
font-size: 1rem; }
@-moz-document url-prefix() {
.row-align-left--mobile > * {
margin-right: -0.5px; } }
.row-align-center--mobile {
font-size: 0;
clear: both;
text-align: center; }
.row-align-center--mobile > * {
float: none !important;
vertical-align: bottom;
font-size: 1rem; }
@-moz-document url-prefix() {
.row-align-center--mobile > * {
margin-right: -0.5px; } }
.row-align-center--mobile > * {
text-align: left; }
.row-align-right--mobile {
font-size: 0;
clear: both;
text-align: right; }
.row-align-right--mobile > * {
float: none !important;
vertical-align: bottom;
font-size: 1rem; }
@-moz-document url-prefix() {
.row-align-right--mobile > * {
margin-right: -0.5px; } }
.row-align-right--mobile > * {
text-align: left; }
.row-align-middle--mobile {
font-size: 0;
clear: both;
vertical-align: middle; }
.row-align-middle--mobile > * {
float: none !important;
vertical-align: middle;
font-size: 1rem; }
@-moz-document url-prefix() {
.row-align-middle--mobile > * {
margin-right: -0.5px; } }
.row-align-top--mobile {
font-size: 0;
clear: both;
vertical-align: top; }
.row-align-top--mobile > * {
float: none !important;
vertical-align: top;
font-size: 1rem; }
@-moz-document url-prefix() {
.row-align-top--mobile > * {
margin-right: -0.5px; } }
.row-align-bottom--mobile {
font-size: 0;
clear: both;
vertical-align: bottom; }
.row-align-bottom--mobile > * {
float: none !important;
vertical-align: bottom;
font-size: 1rem; }
@-moz-document url-prefix() {
.row-align-bottom--mobile > * {
margin-right: -0.5px; } }
.hide--mobile {
display: none; }
.not-visible--mobile {
visibility: hidden; }
.show--mobile {
display: block; }
.show-inline--mobile {
display: inline-block; }
.visible--mobile {
visibility: visible; }
.row-debug--mobile {
position: relative;
z-index: 99999;
overflow: hidden; }
.row-debug--mobile:before {
pointer-events: none;
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 99999px;
background: linear-gradient(to right, transparent 50%, rgba(0, 0, 0, 0.02) 50%);
background-size: 16.66667% 100%;
z-index: 99999; }
body {
direction: ltr; } }
@media screen and (min-width: 768px) and (max-width: 1024px) {
.gr-0--tablet {
width: 0%; }
.push-0--tablet {
left: 0%;
right: auto; }
.pull-0--tablet {
right: 0%;
left: auto; }
.prefix-0--tablet {
margin-left: 0%; }
.suffix-0--tablet {
margin-right: 0%; }
.gr-1--tablet {
width: 8.33333%; }
.push-1--tablet {
left: 8.33333%;
right: auto; }
.pull-1--tablet {
right: 8.33333%;
left: auto; }
.prefix-1--tablet {
margin-left: 8.33333%; }
.suffix-1--tablet {
margin-right: 8.33333%; }
.gr-2--tablet {
width: 16.66667%; }
.push-2--tablet {
left: 16.66667%;
right: auto; }
.pull-2--tablet {
right: 16.66667%;
left: auto; }
.prefix-2--tablet {
margin-left: 16.66667%; }
.suffix-2--tablet {
margin-right: 16.66667%; }
.gr-3--tablet {
width: 25%; }
.push-3--tablet {
left: 25%;
right: auto; }
.pull-3--tablet {
right: 25%;
left: auto; }
.prefix-3--tablet {
margin-left: 25%; }
.suffix-3--tablet {
margin-right: 25%; }
.gr-4--tablet {
width: 33.33333%; }
.push-4--tablet {
left: 33.33333%;
right: auto; }
.pull-4--tablet {
right: 33.33333%;
left: auto; }
.prefix-4--tablet {
margin-left: 33.33333%; }
.suffix-4--tablet {
margin-right: 33.33333%; }
.gr-5--tablet {
width: 41.66667%; }
.push-5--tablet {
left: 41.66667%;
right: auto; }
.pull-5--tablet {
right: 41.66667%;
left: auto; }
.prefix-5--tablet {
margin-left: 41.66667%; }
.suffix-5--tablet {
margin-right: 41.66667%; }
.gr-6--tablet {
width: 50%; }
.push-6--tablet {
left: 50%;
right: auto; }
.pull-6--tablet {
right: 50%;
left: auto; }
.prefix-6--tablet {
margin-left: 50%; }
.suffix-6--tablet {
margin-right: 50%; }
.gr-7--tablet {
width: 58.33333%; }
.push-7--tablet {
left: 58.33333%;
right: auto; }
.pull-7--tablet {
right: 58.33333%;
left: auto; }
.prefix-7--tablet {
margin-left: 58.33333%; }
.suffix-7--tablet {
margin-right: 58.33333%; }
.gr-8--tablet {
width: 66.66667%; }
.push-8--tablet {
left: 66.66667%;
right: auto; }
.pull-8--tablet {
right: 66.66667%;
left: auto; }
.prefix-8--tablet {
margin-left: 66.66667%; }
.suffix-8--tablet {
margin-right: 66.66667%; }
.gr-9--tablet {
width: 75%; }
.push-9--tablet {
left: 75%;
right: auto; }
.pull-9--tablet {
right: 75%;
left: auto; }
.prefix-9--tablet {
margin-left: 75%; }
.suffix-9--tablet {
margin-right: 75%; }
.gr-10--tablet {
width: 83.33333%; }
.push-10--tablet {
left: 83.33333%;
right: auto; }
.pull-10--tablet {
right: 83.33333%;
left: auto; }
.prefix-10--tablet {
margin-left: 83.33333%; }
.suffix-10--tablet {
margin-right: 83.33333%; }
.gr-11--tablet {
width: 91.66667%; }
.push-11--tablet {
left: 91.66667%;
right: auto; }
.pull-11--tablet {
right: 91.66667%;
left: auto; }
.prefix-11--tablet {
margin-left: 91.66667%; }
.suffix-11--tablet {
margin-right: 91.66667%; }
.gr-12--tablet {
width: 100%; }
.push-12--tablet {
left: 100%;
right: auto; }
.pull-12--tablet {
right: 100%;
left: auto; }
.prefix-12--tablet {
margin-left: 100%; }
.suffix-12--tablet {
margin-right: 100%; }
.float-left--tablet {
float: left; }
.float-right--tablet {
float: right; }
.clear--tablet {
clear: both; }
.clear-left--tablet {
clear: left; }
.clear-right--tablet {
clear: right; }
.no-gutter--tablet {
padding-top: 0;
padding-right: 0;
padding-bottom: 0;
padding-left: 0; }
.no-gutter-left--tablet {
padding-left: 0; }
.no-gutter-right--tablet {
padding-right: 0; }
.no-gutter-top--tablet {
padding-top: 0; }
.no-gutter-bottom--tablet {
padding-bottom: 0; }
.gutter--tablet {
padding-right: 10px;
padding-left: 10px; }
.gutter-left--tablet {
padding-left: 10px; }
.gutter-right--tablet {
padding-right: 10px; }
.auto-height--tablet {
height: inherit; }
.row--tablet {
padding-left: 0 !important;
padding-right: 0 !important;
margin-left: -10px;
margin-right: -10px; }
[class*=no-gutter] > .row--tablet {
margin-left: 0 !important;
margin-right: 0 !important; }
.row-reverse--tablet {
padding-left: 0 !important;
padding-right: 0 !important;
margin-left: -10px;
margin-right: -10px;
transform: rotateY(180deg); }
.row-reverse--tablet > [class*="gr-"] {
transform: rotateY(-180deg); }
[class*=no-gutter] > .row-reverse--tablet {
margin-left: 0 !important;
margin-right: 0 !important; }
.row-full--tablet {
width: 100vw;
margin-left: 50% !important;
margin-right: 0 !important;
-webkit-transform: translateX(-50%);
-moz-transition: translateX(-50%);
transform: translateX(-50%); }
.col--tablet {
padding-left: 0 !important;
padding-right: 0 !important;
margin-left: -10px;
margin-right: -10px; }
.col-reverse--tablet {
padding-left: 0 !important;
padding-right: 0 !important;
margin-left: -10px;
margin-right: -10px;
transform: rotateX(180deg); }
.col-reverse--tablet > [class*="gr-"] {
transform: rotateX(-180deg); }
.gr-table--tablet {
display: table-cell;
float: none;
vertical-align: top; }
.row-align-left--tablet {
font-size: 0;
clear: both;
text-align: left; }
.row-align-left--tablet > * {
float: none !important;
vertical-align: bottom;
font-size: 1rem; }
@-moz-document url-prefix() {
.row-align-left--tablet > * {
margin-right: -0.5px; } }
.row-align-center--tablet {
font-size: 0;
clear: both;
text-align: center; }
.row-align-center--tablet > * {
float: none !important;
vertical-align: bottom;
font-size: 1rem; }
@-moz-document url-prefix() {
.row-align-center--tablet > * {
margin-right: -0.5px; } }
.row-align-center--tablet > * {
text-align: left; }
.row-align-right--tablet {
font-size: 0;
clear: both;
text-align: right; }
.row-align-right--tablet > * {
float: none !important;
vertical-align: bottom;
font-size: 1rem; }
@-moz-document url-prefix() {
.row-align-right--tablet > * {
margin-right: -0.5px; } }
.row-align-right--tablet > * {
text-align: left; }
.row-align-middle--tablet {
font-size: 0;
clear: both;
vertical-align: middle; }
.row-align-middle--tablet > * {
float: none !important;
vertical-align: middle;
font-size: 1rem; }
@-moz-document url-prefix() {
.row-align-middle--tablet > * {
margin-right: -0.5px; } }
.row-align-top--tablet {
font-size: 0;
clear: both;
vertical-align: top; }
.row-align-top--tablet > * {
float: none !important;
vertical-align: top;
font-size: 1rem; }
@-moz-document url-prefix() {
.row-align-top--tablet > * {
margin-right: -0.5px; } }
.row-align-bottom--tablet {
font-size: 0;
clear: both;
vertical-align: bottom; }
.row-align-bottom--tablet > * {
float: none !important;
vertical-align: bottom;
font-size: 1rem; }
@-moz-document url-prefix() {
.row-align-bottom--tablet > * {
margin-right: -0.5px; } }
.hide--tablet {
display: none; }
.not-visible--tablet {
visibility: hidden; }
.show--tablet {
display: block; }
.show-inline--tablet {
display: inline-block; }
.visible--tablet {
visibility: visible; }
.row-debug--tablet {
position: relative;
z-index: 99999;
overflow: hidden; }
.row-debug--tablet:before {
pointer-events: none;
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 99999px;
background: linear-gradient(to right, transparent 50%, rgba(0, 0, 0, 0.02) 50%);
background-size: 16.66667% 100%;
z-index: 99999; }
body {
direction: ltr; } }
[class*="gr-"] > [class^="row"],
[class*="gr-"] > [class^="col"] {
margin-left: -10px;
margin-right: -10px; }
@media screen and (max-width: 767px) {
[class*="gr-"] > [class^="row"],
[class*="gr-"] > [class^="col"] {
margin-left: -10px;
margin-right: -10px; } }
@media screen and (min-width: 768px) and (max-width: 1024px) {
[class*="gr-"] > [class^="row"],
[class*="gr-"] > [class^="col"] {
margin-left: -10px;
margin-right: -10px; } }
.container {
max-width: 1224px;
margin: 0 auto; }
figure {
margin: 0;
margin-bottom: 1em;
padding: 5px 20px;
border-radius: 3px;
overflow-y: auto; }
h1,
h2,
h3,
h4,
h5,
h6 {
margin: 0;
font-size: 14px; }
html {
min-height: 100%;
color: #0c0d12;
background-color: #fff;
font-family: "Helvetica", Arial, Serif;
font-size: 14px;
font-weight: 400;
line-height: 1.4;
letter-spacing: 0;
overflow-y: scroll;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale; }
body {
overflow: hidden; }
a {
text-decoration: none;
color: inherit; }
img {
width: 100%;
height: auto;
vertical-align: middle; }
p {
margin-top: 0;
margin-bottom: 14px;
text-align: left; }
.badge {
display: inline-block;
box-sizing: border-box;
margin-right: 6px;
padding: 3px 6px;
color: #fff;
background: #569e3d;
font-size: 12px;
line-height: 1.4;
font-weight: 400;
border-radius: 3px;
text-decoration: none; }
.badge:hover {
cursor: pointer;
background: #60b044; }
.badge--gray {
background: #979b9c; }
.badge--gray:hover {
background: #a4a8a8; }
.badge--blue {
background: #51a7e8; }
.badge--blue:hover {
background: #68b2eb; }
.badge--red {
background: #d90429; }
.badge--red:hover {
background: #f2042e; }
.badge--orange {
background: #c99600; }
.badge--orange:hover {
background: #e3a900; }
.btn {
border-width: 1px;
border-style: solid;
border-color: #979b9c;
border-radius: 3px;
display: inline-block;
box-sizing: border-box;
font-family: "Helvetica", Arial, Serif;
font-size: 14px;
font-weight: 700;
text-transform: capitalize;
text-decoration: none;
letter-spacing: 0;
word-spacing: 1px;
padding: 6px 9px;
position: relative;
background: #fff;
color: #0c0d12; }
.btn:hover {
background: #f2f2f2;
cursor: pointer; }
.btn--small {
padding: 3px 6px;
font-size: 12px; }
.btn--large {
padding: 9px 12px;
font-size: 18px; }
.btn--x-large {
padding: 15px 18px;
font-size: 20px; }
.btn--block {
width: 100%; }
.btn--icon {
padding: 0; }
.btn-group,
.btn-dropdown {
position: relative;
display: inline-block;
font-size: 0; }
.btn-group .btn:not(:first-child):not(:last-child) {
margin-left: -1px;
margin-right: -1px;
border-radius: 0; }
.btn-group .btn:first-child {
border-top-right-radius: 0;
border-bottom-right-radius: 0; }
.btn-group .btn:last-child {
border-top-left-radius: 0;
border-bottom-left-radius: 0; }
.btn-group .btn + .btn {
margin-left: -1px; }
.btn[disabled] {
border-width: 1px;
border-style: solid;
border-color: #979b9c;
border-radius: 3px;
background: #e5e6e7;
color: #979b9c; }
.btn[disabled]:hover {
cursor: not-allowed;
background: #e5e6e7;
color: #979b9c;
border-color: #979b9c; }
.btn--cta {
border-width: 1px;
border-style: solid;
border-color: #60b044;
border-radius: 3px;
background: #60b044;
color: #fff; }
.btn--cta:hover {
background: #569e3d;
color: #fff;
border-color: #569e3d; }
.btn--i-cta {
border-width: 1px;
border-style: solid;
border-color: #60b044;
border-radius: 3px;
background: transparent;
color: #60b044; }
.btn--i-cta:hover {
color: #569e3d;
background: transparent;
border-color: #569e3d; }
.btn--secondary {
border-width: 1px;
border-style: solid;
border-color: #e3a900;
border-radius: 3px;
background: #e3a900;
color: #fff; }
.btn--secondary:hover {
background: #c99600;
color: #fff;
border-color: #c99600; }
.btn--i-secondary {
border-width: 1px;
border-style: solid;
border-color: #e3a900;
border-radius: 3px;
background: transparent;
color: #e3a900; }
.btn--i-secondary:hover {
color: #c99600;
background: transparent;
border-color: #c99600; }
.btn-social--facebook {
border-width: 1px;
border-style: solid;
border-color: #4b66a0;
border-radius: 3px;
background: #4b66a0;
color: #fff; }
.btn-social--facebook:hover {
background: #435b8f;
border-color: #435b8f; }
.btn-social--twitter {
border-width: 1px;
border-style: solid;
border-color: #55acee;
border-radius: 3px;
background: #55acee;
color: #fff; }
.btn-social--twitter:hover {
background: #3ea1ec;
border-color: #3ea1ec; }
.btn-social--googleplus {
border-width: 1px;
border-style: solid;
border-color: #d8232b;
border-radius: 3px;
background: #d8232b;
color: #fff; }
.btn-social--googleplus:hover {
background: #c21f27;
border-color: #c21f27; }
.box {
box-sizing: border-box;
border-collapse: separate; }
.box__header {
border-width: 1px 1px 0;
border-style: solid;
border-color: #d8dada;
border-radius: 3px 3px 0 0;
background: #f2f3f3;
color: #0c0d12;
font-size: 14px;
font-weight: bold;
text-align: left;
padding: 18px;
position: relative; }
.box__header-actions {
position: absolute;
top: 18px;
right: 18px; }
.box__content {
border-width: 1px;
border-style: solid;
border-color: #d8dada;
border-radius: 3px;
background: #fff;
color: #0c0d12;
font-size: 14px;
padding: 18px; }
.box__header ~ .box__content {
border-top-right-radius: 0;
border-top-left-radius: 0; }
.box__separator {
display: block;
background: #d8dada;
margin: 18px -18px;
padding: 0 18px;
width: 100%;
height: 1px; }
.box--danger .box__header {
border-color: #d90429;
background: #fb2e52;
color: #fff; }
.callout {
border-width: 1px;
border-style: solid;
border-color: #979b9c;
border-radius: 3px;
font-size: 14px;
font-family: "Helvetica", Arial, Serif;
color: #979b9c;
background: #e5e6e7;
padding: 3px 6px;
box-sizing: border-box;
width: 500px; }
.callout--notification {
position: fixed;
top: -50px;
left: 0;
right: 0;
transition: all 0.15s ease-out;
margin: 0 auto; }
.callout--notification.is-show {
top: 12px; }
.callout--red {
border-color: #d90429;
background: #fedee3;
color: #d90429; }
.callout--green {
border-color: #569e3d;
background: #e9f5e5;
color: #569e3d; }
.callout--yellow {
border-color: #c99600;
background: #fff1c9;
color: #c99600; }
.callout--large {
padding: 6px 9px; }
.callout--x-large {
padding: 9px 12px; }
.callout--block {
width: 100%; }
.dropdown {
border-width: 1px;
border-style: solid;
border-color: #979b9c;
border-radius: 3px;
list-style: none;
font-family: "Helvetica", Arial, Serif;
font-size: 14px;
letter-spacing: 0;
word-spacing: 1px;
background: #fff;
margin: 10px 0;
padding: 0;
min-width: 100%;
max-width: 150%;
position: absolute;
top: 100%;
left: 0;
z-index: 1;
display: none; }
.dropdown.is-dropped {
display: block; }
.dropdown--small {
padding: 3px;
font-size: 12px; }
.dropdown--large {
padding: 6px 9px;
font-size: 18px; }
.dropdown--x-large {
padding: 9px 12px;
font-size: 20px; }
.dropdown--right {
left: initial;
right: 0; }
.dropdown--top {
top: initial;
bottom: 100%; }
.dropdown__item {
padding: 3px 6px; }
.dropdown__item:first-child {
border-top-left-radius: 3px;
border-top-right-radius: 3px; }
.dropdown__item:last-child {
border-bottom-left-radius: 3px;
border-bottom-right-radius: 3px; }
.dropdown__item:hover {
cursor: pointer;
background: #d8dada; }
.dropdown__item__item-title {
font-weight: bold; }
.field {
font-family: "Helvetica", Arial, Serif;
margin-bottom: 14px;
display: block; }
.field__label {
font-size: 14px;
text-align: left;
color: #0c0d12;
margin-bottom: 2px;
display: block; }
.field__input,
.field__select {
border-width: 1px;
border-style: solid;
border-color: #d8dada;
border-radius: 3px;
font-size: 14px;
font-family: "Helvetica", Arial, Serif;
color: #0c0d12;
background: #fff;
letter-spacing: 0;
word-spacing: 1px;
padding: 3px 6px;
width: 100%;
height: 32px;
box-sizing: border-box;
transition: border .25s ease-out;
display: block; }
.field__input:active, .field__input:focus,
.field__select:active,
.field__select:focus {
border-color: #51a7e8;
outline: none; }
.field__input--large,
.field__select--large {
font-size: 18px;
padding: 6px 9px;
height: 44px; }
.field__input--x-large,
.field__select--x-large {
font-size: 20px;
padding: 9px 12px;
height: 53px; }
.is-error .field__input, .is-error
.field__select {
border-color: #fb153d; }
.field__select {
background: #fff url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAYCAYAAAC8/X7cAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAN1wAADdcBQiibeAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAADQSURBVFiF1c+7ccMwFEXBZS0oUqGgzE2+WqzE9li2KOIrkncGAZDg7BIRF3w45/ICJ0XklNJt+b6dDJFTSjdYfr+eBPETzx8Ah0c8xPMEwGER/+JZAXA4xNN4XgA4DGI1ng0AuyNexlMAYDfEZjyFAN6OKIqnAsDbEMXxVAKYjqiKpwHANER1PI0AhiOa4ukAMAzRHE8ngG5EVzwDADQjuuMZBKAaMSSegQCKEcPiGQxgEzE0ngkAVhHD46cuIi4R8fl1rnv3NC0ickTkmX/cAeicgKu/i7a4AAAAAElFTkSuQmCC") no-repeat right 8px center;
background-size: 12px 6px;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none; }
.field__input-group {
position: relative;
display: table;
border-collapse: separate;
width: 100%; }
.field__input-group > .field__input,
.field__input-group > .field__select,
.field__input-group > .field__input-addon {
display: table-cell; }
.field__input-group .field__input:not(:first-child):not(:last-child),
.field__input-group .field__select:not(:first-child):not(:last-child) {
border-radius: 0; }
.field__input-group .field__input:first-child,
.field__input-group .field__select:first-child {
border-top-right-radius: 0;
border-bottom-right-radius: 0; }
.field__input-group .field__input:last-child,
.field__input-group .field__select:last-child {
border-top-left-radius: 0;
border-bottom-left-radius: 0; }
.field__input-addon {
border-width: 1px;
border-style: solid;
border-color: #d8dada;
border-radius: 3px;
background: #fff;
color: #0c0d12;
line-height: 1;
text-align: center;
padding: 3px 6px;
box-sizing: border-box;
width: 1%; }
.field__input-addon:hover {
cursor: pointer;
background: #f2f2f2; }
.field__input-addon:first-child {
border-right: 0;
border-top-right-radius: 0;
border-bottom-right-radius: 0; }
.field__input-addon:last-child {
border-left: 0;
border-top-left-radius: 0;
border-bottom-left-radius: 0; }
.field__input-addon--large {
font-size: 18px;
padding: 6px 9px; }
.field__input-addon--x-large {
font-size: 20px;
padding: 9px 12px; }
.field__error-message {
font-size: 12px;
font-family: "Helvetica", Arial, Serif;
color: #fb153d;
margin-top: 2px;
margin-bottom: 0;
display: none; }
.is-error .field__error-message {
display: block; }
.flag {
display: table;
width: 100%; }
.flag__head, .flag__body {
display: table-cell;
vertical-align: middle; }
.flag--top .flag__head,
.flag--top .flag__body {
vertical-align: top; }
.flag--bottom .flag__head,
.flag--bottom .flag__body {
vertical-align: bottom; }
.list {
list-style: none;
margin: 0;
padding: 0;
position: fixed;
top: 0;
width: inherit;
height: 100%;
overflow-y: auto;
background: #e5e6e7; }
.list .list__item {
border-width: 0 0 1px 0;
border-style: solid;
border-color: #b1b4b5; }
.list .list__nav {
display: block;
padding: 9px 12px;
color: #0c0d12;
font-size: 12px; }
.list .list__nav:hover {
cursor: pointer;
background: #d8dada; }
.list .list__section {
border-width: 0 0 1px 0;
border-style: solid;
border-color: #b1b4b5;
padding: 6px 12px;
color: #0c0d12;
font-size: 10.2px;
background: #cbcdce; }
.list--with-border {
border-width: 1px;
border-style: solid;
border-color: #d8dada;
border-radius: 3px; }
.list--with-border .list__item:last-child {
border: 0; }
.ipage {
position: fixed;
top: 0;
left: 100%;
background: #fff;
transition: all 0.25s ease-out; }
.ipage--right {
right: 100%;
left: initial; }
.ipage--right.is-open {
right: 0; }
.ipage--top {
top: initial;
bottom: 100%; }
.ipage--top.is-open {
bottom: 0; }
.ipage--bottom {
top: 100%; }
.ipage--bottom.is-open {
top: 0; }
.ipage.is-open {
left: 0; }
.modal {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(12, 13, 18, 0.7);
text-align: center;
z-index: 50; }
.modal__content {
display: inline-block;
width: 650px;
margin-top: 4em; }
.modal.is-hidden {
display: none; }
.paginator {
*zoom: 1;
display: block;
margin: 18px 0; }
.paginator::before, .paginator::after {
content: " ";
display: table; }
.paginator::after {
clear: both; }
.paginator__prev {
float: left; }
.paginator__next {
float: right; }
.post {
display: block;
background: #fff;
color: #0c0d12;
margin-bottom: 18px; }
.post__title {
display: block;
font-size: 40px;
line-height: 1.2;
font-weight: 800;
color: #0c0d12;
margin-bottom: 18px; }
.post__body {
display: block;
font-size: 21px;
line-height: 1.5;
font-weight: 300; }
.post__body h2 {
font-size: 32px;
line-height: 1.2;
font-weight: 700;
color: #0c0d12;
margin-top: 32px;
margin-bottom: 12px; }
.post__body h2:first-child {
margin-top: 0; }
.post__body p {
text-align: justify;
margin-bottom: 21px; }
.post__body a {
color: #569e3d; }
.post__body a:hover {
color: #569e3d; }
.post__body blockquote {
margin-left: 0;
border-left: 3px solid #0c0d12;
padding-left: 1em; }
.tab {
font-size: 14px;
font-family: "Helvetica", Arial, Serif;
display: block; }
.tab-nav {
*zoom: 1;
display: block;
margin: 0;
padding: 0; }
.tab-nav::before, .tab-nav::after {
content: " ";
display: table; }
.tab-nav::after {
clear: both; }
.tab-nav__menu {
border-width: 1px;
border-style: solid;
border-color: #d8dada;
border-radius: 3px 3px 0 0;
display: block;
list-style: none;
color: #979b9c;
background: #e5e6e7;
float: left;
margin: 0 0 -1px -1px;
padding: 9px 12px;
box-sizing: border-box; }
.tab-nav__menu:first-child {
margin: 0 0 -1px; }
.tab-nav__menu.is-active {
border-width: 1px;
border-style: solid;
border-color: #d8dada #d8dada #fff;
border-radius: 3px 3px 0 0;
color: #0c0d12;
background: #fff; }
.tab__panel {
border-width: 1px;
border-style: solid;
border-color: #d8dada;
border-radius: 3px;
display: none;
color: #0c0d12;
background: #fff;
padding: 18px; }
.tab__panel.is-active {
display: block; }
.u-mg--none {
margin: 0px; }
.u-mg--x-small {
margin: 3px; }
.u-mg--small {
margin: 6px; }
.u-mg--medium {
margin: 12px; }
.u-mg--large {
margin: 18px; }
.u-mg--x-large {
margin: 24px; }
.u-mg--xx-large {
margin: 30px; }
.u-mg-top--none {
margin-top: 0px; }
.u-mg-top--x-small {
margin-top: 3px; }
.u-mg-top--small {
margin-top: 6px; }
.u-mg-top--medium {
margin-top: 12px; }
.u-mg-top--large {
margin-top: 18px; }
.u-mg-top--x-large {
margin-top: 24px; }
.u-mg-top--xx-large {
margin-top: 30px; }
.u-mg-right--none {
margin-right: 0px; }
.u-mg-right--x-small {
margin-right: 3px; }
.u-mg-right--small {
margin-right: 6px; }
.u-mg-right--medium {
margin-right: 12px; }
.u-mg-right--large {
margin-right: 18px; }
.u-mg-right--x-large {
margin-right: 24px; }
.u-mg-right--xx-large {
margin-right: 30px; }
.u-mg-bottom--none {
margin-bottom: 0px; }
.u-mg-bottom--x-small {
margin-bottom: 3px; }
.u-mg-bottom--small {
margin-bottom: 6px; }
.u-mg-bottom--medium {
margin-bottom: 12px; }
.u-mg-bottom--large {
margin-bottom: 18px; }
.u-mg-bottom--x-large {
margin-bottom: 24px; }
.u-mg-bottom--xx-large {
margin-bottom: 30px; }
.u-mg-left--none {
margin-left: 0px; }
.u-mg-left--x-small {
margin-left: 3px; }
.u-mg-left--small {
margin-left: 6px; }
.u-mg-left--medium {
margin-left: 12px; }
.u-mg-left--large {
margin-left: 18px; }
.u-mg-left--x-large {
margin-left: 24px; }
.u-mg-left--xx-large {
margin-left: 30px; }
.u-pd--none {
padding: 0px; }
.u-pd--x-small {
padding: 3px; }
.u-pd--small {
padding: 6px; }
.u-pd--medium {
padding: 12px; }
.u-pd--large {
padding: 18px; }
.u-pd--x-large {
padding: 24px; }
.u-pd--xx-large {
padding: 30px; }
.u-pd-top--none {
padding-top: 0px; }
.u-pd-top--x-small {
padding-top: 3px; }
.u-pd-top--small {
padding-top: 6px; }
.u-pd-top--medium {
padding-top: 12px; }
.u-pd-top--large {
padding-top: 18px; }
.u-pd-top--x-large {
padding-top: 24px; }
.u-pd-top--xx-large {
padding-top: 30px; }
.u-pd-right--none {
padding-right: 0px; }
.u-pd-right--x-small {
padding-right: 3px; }
.u-pd-right--small {
padding-right: 6px; }
.u-pd-right--medium {
padding-right: 12px; }
.u-pd-right--large {
padding-right: 18px; }
.u-pd-right--x-large {
padding-right: 24px; }
.u-pd-right--xx-large {
padding-right: 30px; }
.u-pd-bottom--none {
padding-bottom: 0px; }
.u-pd-bottom--x-small {
padding-bottom: 3px; }
.u-pd-bottom--small {
padding-bottom: 6px; }
.u-pd-bottom--medium {
padding-bottom: 12px; }
.u-pd-bottom--large {
padding-bottom: 18px; }
.u-pd-bottom--x-large {
padding-bottom: 24px; }
.u-pd-bottom--xx-large {
padding-bottom: 30px; }
.u-pd-left--none {
padding-left: 0px; }
.u-pd-left--x-small {
padding-left: 3px; }
.u-pd-left--small {
padding-left: 6px; }
.u-pd-left--medium {
padding-left: 12px; }
.u-pd-left--large {
padding-left: 18px; }
.u-pd-left--x-large {
padding-left: 24px; }
.u-pd-left--xx-large {
padding-left: 30px; }
.u-text--small {
font-size: 12px;
line-height: 1.4; }
.u-text--medium {
font-size: 14px;
line-height: 1.4; }
.u-text--large {
font-size: 18px;
line-height: 1.2; }
.u-text--x-large {
font-size: 20px;
line-height: 1.2; }
.u-text--xx-large {
font-size: 22px;
line-height: 1.2; }
.u-text-post--medium {
font-size: 21px;
line-height: 1.5; }
.u-text-post--large {
font-size: 32px;
line-height: 1.2; }
.u-text-post--x-large {
font-size: 40px;
line-height: 1.2; }
.u-text-weight--light {
font-weight: 300; }
.u-text-weight--normal {
font-weight: 400; }
.u-text-weight--bold {
font-weight: 700; }
.u-text-weight--super-bold {
font-weight: 800; }
.u-text-op--0 {
opacity: 0; }
.u-text-op--1 {
opacity: 0.1; }
.u-text-op--2 {
opacity: 0.2; }
.u-text-op--3 {
opacity: 0.3; }
.u-text-op--4 {
opacity: 0.4; }
.u-text-op--5 {
opacity: 0.5; }
.u-text-op--6 {
opacity: 0.6; }
.u-text-op--7 {
opacity: 0.7; }
.u-text-op--8 {
opacity: 0.8; }
.u-text-op--9 {
opacity: 0.9; }
.u-text-op--10 {
opacity: 1; }
.u-text-align--center {
text-align: center; }
.u-text-align--left {
text-align: left; }
.u-text-align--right {
text-align: right; }
.u-text-align--justify {
text-align: justify; }
.u-text-align--initial {
text-align: initial; }
@media screen and (min-width: 768px) {
.u-h--292 {
height: 292px; } }
.u-flex-column {
display: -ms-flexbox;
display: flex;
-ms-flex-direction: column;
flex-direction: column;
-ms-flex-pack: center;
justify-content: center; }
.u-flex-1 {
-ms-flex: 1 1 auto;
flex: 1 1 auto; }
.u-flex-0 {
-ms-flex: 0 0 auto;
flex: 0 0 auto; }
.u-fg--gray {
color: #979b9c; }
.u-fg--blue {
color: #51a7e8; }
.u-fg--white {
color: #fff; }
.u-fg--black {
color: #0c0d12; }
.u-fg--red {
color: #d90429; }
.u-fg--green {
color: #569e3d; }
.u-fg--orange {
color: #c99600; }
.u-bg--gray {
background-color: #979b9c; }
.u-bg--blue {
background-color: #51a7e8; }
.u-bg--white {
background-color: #fff; }
.u-bg--black {
background-color: #0c0d12; }
.u-bg--red {
background-color: #d90429; }
.u-bg--green {
background-color: #569e3d; }
.u-bg--orange {
background-color: #c99600; }
.u-width--1-12 {
width: 8.33333%; }
.u-width--2-12 {
width: 16.66667%; }
.u-width--3-12 {
width: 25%; }
.u-width--4-12 {
width: 33.33333%; }
.u-width--5-12 {
width: 41.66667%; }
.u-width--6-12 {
width: 50%; }
.u-width--7-12 {
width: 58.33333%; }
.u-width--8-12 {
width: 66.66667%; }
.u-width--9-12 {
width: 75%; }
.u-width--10-12 {
width: 83.33333%; }
.u-width--11-12 {
width: 91.66667%; }
.u-width--12-12 {
width: 100%; }
.u-align-left {
text-align: left; }
.u-align-center {
text-align: center; }
.u-align-right {
text-align: right; }
.u-valign-top {
vertical-align: top; }
.u-valign-middle {
vertical-align: middle; }
.u-valign-bottom {
vertical-align: bottom; }