renderkit
Version:
Definitely the light way for start new front-end web projects.
2,672 lines (2,413 loc) • 85.7 kB
CSS
/*!
* RenderKit
* Version 0.9.6-beta
* github.com/matteobertoldo/renderkit
* Licensed under MIT Open Source
*/
@import url("https://fonts.googleapis.com/css?family=Work+Sans:400,700|Josefin+Sans:400,400i,700|Abril+Fatface");
html {
font-family: sans-serif;
font-size: 100%;
-webkit-text-size-adjust: 100%;
-webkit-tap-highlight-color: transparent;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
*, ::before, ::after {
-webkit-box-sizing: inherit;
box-sizing: inherit;
}
body {
font-family: "Work Sans", sans-serif;
font-weight: normal;
background-color: #ffffff;
color: #666666;
line-height: 1.15;
margin: 0;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
nav,
section,
summary {
display: block;
}
abbr,
blockquote,
dd,
dl,
dt,
fieldset,
figure,
form,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
legend,
li,
ol,
p,
pre,
ul {
margin: 0;
}
audio,
canvas,
progress,
video {
display: inline-block;
vertical-align: baseline;
}
audio:not([controls]) {
display: none;
height: 0;
}
progress {
vertical-align: baseline;
}
template,
[hidden] {
display: none;
}
a {
background-color: transparent;
color: #61afef;
text-decoration: underline;
}
[data-whatinput="mouse"] a:focus,
[data-whatinput="touch"] a:focus {
outline: 0;
}
abbr[title] {
border-bottom: none;
text-decoration: underline;
-webkit-text-decoration: underline dotted;
text-decoration: underline dotted;
}
b,
strong {
font-family: inherit;
font-weight: bolder;
}
dfn {
font-style: italic;
}
mark {
background-color: #fff000;
color: #000000;
}
q::before {
content: '\201C';
}
q::after {
content: '\201D';
}
small {
font-size: 80%;
}
sub,
sup {
position: relative;
font-size: 75%;
line-height: 0;
vertical-align: baseline;
}
sub {
bottom: -0.25em;
}
sup {
top: -0.5em;
}
img,
video {
max-width: 100%;
height: auto;
vertical-align: middle;
}
img,
iframe {
border: 0;
}
code,
kbd,
pre,
samp {
font-family: monospace, monospace;
font-size: 1em;
}
pre {
overflow: auto;
}
hr {
-webkit-box-sizing: content-box;
box-sizing: content-box;
height: 0;
overflow: visible;
}
svg {
display: inline-block;
vertical-align: middle;
position: relative;
top: -0.063em;
width: 100%;
height: 100%;
fill: currentColor;
}
svg:not(:root) {
overflow: hidden;
}
body,
button,
input,
select,
textarea {
font-synthesis: none;
text-rendering: optimizeLegibility;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
-webkit-font-feature-settings: 'liga', 'kern';
font-feature-settings: 'liga', 'kern';
direction: rtl;
}
button,
input,
select,
textarea {
font-family: inherit;
font-size: 100%;
color: inherit;
line-height: 1.15;
margin: 0;
}
[data-whatinput="mouse"] button:focus,
[data-whatinput="touch"] button:focus, [data-whatinput="mouse"]
input:focus,
[data-whatinput="touch"]
input:focus, [data-whatinput="mouse"]
select:focus,
[data-whatinput="touch"]
select:focus, [data-whatinput="mouse"]
textarea:focus,
[data-whatinput="touch"]
textarea:focus {
outline: 0;
}
button,
input {
overflow: visible;
}
select,
button {
text-transform: none;
cursor: pointer;
}
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;
}
fieldset {
border: 1px solid silver;
margin: 0 2px;
padding: 0.313em 0.625em 0.750em;
}
legend {
display: table;
max-width: 100%;
white-space: normal;
color: inherit;
padding: 0;
}
input[type="email"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"], input[type="url"], select, textarea {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
border: 1px solid lightgray;
border-radius: 0;
}
input[type="checkbox"], input[type="radio"] {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
position: absolute !important;
width: 1px;
height: 1px;
border: 0;
white-space: nowrap;
clip: rect(1px, 1px, 1px, 1px);
overflow: hidden;
margin: -1px;
padding: 0;
}
input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button {
height: auto;
}
input[type="search"] {
outline-offset: -2px;
}
input[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}
input::-webkit-file-upload-button {
-webkit-appearance: button;
font: inherit;
border: 1px solid lightgray;
background-color: white;
border-radius: 0;
}
input[type="reset"], input[type="submit"] {
white-space: normal;
}
select:-moz-focusring {
color: transparent;
text-shadow: 0 0 0 #666666;
}
select::-ms-expand {
display: none;
}
select::-ms-value {
color: currentColor;
}
textarea {
overflow: auto;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
@-ms-viewport {
width: device-width;
}
@media print {
*, ::after, ::before {
text-shadow: none !important;
-webkit-box-shadow: none !important;
box-shadow: none !important;
}
a, a:visited {
text-decoration: underline;
}
a[href^="javascript:"]:after,
a[href^="#"]:after {
content: '';
}
abbr[title]:after {
content: " (" attr(title) ")";
}
blockquote, pre, table {
page-break-inside: avoid;
}
thead {
display: table-header-group;
}
img, tr {
page-break-inside: avoid;
}
img {
max-width: 100%;
}
h2, h3, p {
orphans: 3;
widows: 3;
}
h2, h3 {
page-break-after: avoid;
}
.show-for-print {
display: block !important;
}
.hide-for-print {
display: none !important;
}
table.show-for-print {
display: table !important;
}
thead.show-for-print {
display: table-header-group !important;
}
tbody.show-for-print {
display: table-row-group !important;
}
tr.show-for-print {
display: table-row !important;
}
td.show-for-print {
display: table-cell !important;
}
th.show-for-print {
display: table-cell !important;
}
@page {
margin: 0.5cm;
}
}
h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4,
h5, .h5,
h6, .h6 {
font-family: inherit;
font-weight: bold;
text-transform: uppercase;
color: #666666;
}
h1,
.h1 {
font-size: 1.5rem;
line-height: 1.4;
letter-spacing: normal;
margin-top: 0;
margin-bottom: 16px;
}
h2,
.h2 {
font-size: 1.25rem;
line-height: 1.4;
letter-spacing: normal;
margin-top: 0;
margin-bottom: 16px;
}
h3,
.h3 {
font-size: 1.1875rem;
line-height: 1.4;
letter-spacing: normal;
margin-top: 0;
margin-bottom: 16px;
}
h4,
.h4 {
font-size: 1.125rem;
line-height: 1.4;
letter-spacing: normal;
margin-top: 0;
margin-bottom: 16px;
}
h5,
.h5 {
font-size: 1.0625rem;
line-height: 1.4;
letter-spacing: normal;
margin-top: 0;
margin-bottom: 16px;
}
h6,
.h6 {
font-size: 1rem;
line-height: 1.4;
letter-spacing: normal;
margin-top: 0;
margin-bottom: 16px;
}
@media print, only screen and (min-width: 641px) {
h1,
.h1 {
font-size: 3rem;
}
h2,
.h2 {
font-size: 2.5rem;
}
h3,
.h3 {
font-size: 1.9375rem;
}
h4,
.h4 {
font-size: 1.5625rem;
}
h5,
.h5 {
font-size: 1.25rem;
}
h6,
.h6 {
font-size: 1rem;
}
}
p {
font-family: "Josefin Sans", sans-serif;
font-weight: normal;
line-height: 1.4;
letter-spacing: normal;
text-transform: none;
color: #666666;
margin: 0;
}
.text-left {
text-align: left;
}
.text-right {
text-align: right;
}
.text-center {
text-align: center;
}
.text-justify {
text-align: justify;
}
@media print, only screen and (min-width: 641px) {
.medium-text-left {
text-align: left;
}
.medium-text-right {
text-align: right;
}
.medium-text-center {
text-align: center;
}
.medium-text-justify {
text-align: justify;
}
}
@media print, only screen and (min-width: 1025px) {
.large-text-left {
text-align: left;
}
.large-text-right {
text-align: right;
}
.large-text-center {
text-align: center;
}
.large-text-justify {
text-align: justify;
}
}
.text-uppercase {
text-transform: uppercase;
}
.text-lowercase {
text-transform: lowercase;
}
.text-capitalize {
text-transform: capitalize;
}
.text-ellipsis {
white-space: nowrap;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
overflow: hidden;
}
::-moz-selection {
background: #b3d4fc;
text-shadow: none;
}
::selection {
background: #b3d4fc;
text-shadow: none;
}
.invisible {
visibility: hidden !important;
}
.hide {
display: none !important;
}
.visuallyhidden, .show-for-sr,
.show-on-focus {
position: absolute !important;
width: 1px;
height: 1px;
border: 0;
white-space: nowrap;
clip: rect(1px, 1px, 1px, 1px);
overflow: hidden;
margin: -1px;
padding: 0;
}
.visuallyhidden-off, .show-on-focus:active, .show-on-focus:focus {
position: static !important;
width: auto;
height: auto;
border: initial;
white-space: inherit;
clip: none;
overflow: inherit;
margin: 0;
}
.no-select {
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.no-touch {
-webkit-touch-callout: none;
-ms-touch-action: none;
touch-action: none;
}
.no-text {
font: 0/0 a;
text-indent: 100%;
white-space: nowrap;
color: transparent;
overflow: hidden;
}
.no-bullet {
list-style-type: none;
margin: 0;
}
.no-overflow {
overflow: hidden;
}
.cursor-pointer {
cursor: pointer;
}
.cursor-default {
cursor: default;
}
.cursor-grab {
cursor: -webkit-grab;
cursor: grab;
}
.cursor-grabbing {
cursor: -webkit-grabbing;
cursor: grabbing;
}
@media only screen and (max-width: 640px) {
.hide-for-small-only {
display: none !important;
}
}
@media only screen and (min-width: 641px) {
.show-for-small-only {
display: none !important;
}
}
@media print, only screen and (min-width: 641px) {
.hide-for-medium {
display: none !important;
}
}
@media only screen and (max-width: 640px) {
.show-for-medium {
display: none !important;
}
}
@media only screen and (min-width: 641px) and (max-width: 1024px) {
.hide-for-medium-only {
display: none !important;
}
}
@media only screen and (max-width: 640px), only screen and (min-width: 1025px) {
.show-for-medium-only {
display: none !important;
}
}
@media print, only screen and (min-width: 1025px) {
.hide-for-large {
display: none !important;
}
}
@media only screen and (max-width: 1024px) {
.show-for-large {
display: none !important;
}
}
@media only screen and (min-width: 1025px) and (max-width: 1200px) {
.hide-for-large-only {
display: none !important;
}
}
@media only screen and (max-width: 1024px), only screen and (min-width: 1201px) {
.show-for-large-only {
display: none !important;
}
}
.show-for-landscape,
.hide-for-portrait {
display: block !important;
}
@media only screen and (orientation: landscape) {
.show-for-landscape,
.hide-for-portrait {
display: block !important;
}
}
@media only screen and (orientation: portrait) {
.show-for-landscape,
.hide-for-portrait {
display: none !important;
}
}
.hide-for-landscape,
.show-for-portrait {
display: none;
}
@media only screen and (orientation: landscape) {
.hide-for-landscape,
.show-for-portrait {
display: none !important;
}
}
@media only screen and (orientation: portrait) {
.hide-for-landscape,
.show-for-portrait {
display: block !important;
}
}
.float-left {
float: left;
}
.float-right {
float: right;
}
.float-center {
display: block;
margin-left: auto;
margin-right: auto;
}
.clearfix::before, .clearfix::after {
content: '';
display: table;
-webkit-flex-basis: 0;
-ms-flex-preferred-size: 0;
flex-basis: 0;
-webkit-order: 1;
-ms-flex-order: 1;
order: 1;
}
.clearfix::after {
clear: both;
}
.clear-both {
clear: both;
}
.grid-container {
padding-right: 10px;
padding-left: 10px;
max-width: 1200px;
margin: 0 auto;
}
@media print, only screen and (min-width: 641px) {
.grid-container {
padding-right: 15px;
padding-left: 15px;
}
}
.grid-container.fluid {
padding-right: 10px;
padding-left: 10px;
max-width: 100%;
margin: 0 auto;
}
@media print, only screen and (min-width: 641px) {
.grid-container.fluid {
padding-right: 15px;
padding-left: 15px;
}
}
.grid-container.full {
padding-right: 0;
padding-left: 0;
max-width: 100%;
margin: 0 auto;
}
.grid-x {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-flow: row wrap;
-ms-flex-flow: row wrap;
flex-flow: row wrap;
}
.cell {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
min-height: 0px;
min-width: 0px;
width: 100%;
}
.cell.auto {
-webkit-flex: 1 1 0px;
-ms-flex: 1 1 0px;
flex: 1 1 0px;
}
.cell.shrink {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
}
.grid-x > .auto {
width: auto;
margin-left: 10px;
margin-right: 10px;
}
.grid-x > .shrink {
width: auto;
margin-left: 10px;
margin-right: 10px;
}
.grid-x > .small-shrink, .grid-x > .small-full, .grid-x > .small-1, .grid-x > .small-2, .grid-x > .small-3, .grid-x > .small-4, .grid-x > .small-5, .grid-x > .small-6, .grid-x > .small-7, .grid-x > .small-8, .grid-x > .small-9, .grid-x > .small-10, .grid-x > .small-11, .grid-x > .small-12 {
-webkit-flex-basis: auto;
-ms-flex-preferred-size: auto;
flex-basis: auto;
}
@media print, only screen and (min-width: 641px) {
.grid-x > .medium-shrink, .grid-x > .medium-full, .grid-x > .medium-1, .grid-x > .medium-2, .grid-x > .medium-3, .grid-x > .medium-4, .grid-x > .medium-5, .grid-x > .medium-6, .grid-x > .medium-7, .grid-x > .medium-8, .grid-x > .medium-9, .grid-x > .medium-10, .grid-x > .medium-11, .grid-x > .medium-12 {
-webkit-flex-basis: auto;
-ms-flex-preferred-size: auto;
flex-basis: auto;
}
}
@media print, only screen and (min-width: 1025px) {
.grid-x > .large-shrink, .grid-x > .large-full, .grid-x > .large-1, .grid-x > .large-2, .grid-x > .large-3, .grid-x > .large-4, .grid-x > .large-5, .grid-x > .large-6, .grid-x > .large-7, .grid-x > .large-8, .grid-x > .large-9, .grid-x > .large-10, .grid-x > .large-11, .grid-x > .large-12 {
-webkit-flex-basis: auto;
-ms-flex-preferred-size: auto;
flex-basis: auto;
}
}
.grid-x > .small-1 {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
width: 8.33333%;
}
.grid-x > .small-2 {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
width: 16.66667%;
}
.grid-x > .small-3 {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
width: 25%;
}
.grid-x > .small-4 {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
width: 33.33333%;
}
.grid-x > .small-5 {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
width: 41.66667%;
}
.grid-x > .small-6 {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
width: 50%;
}
.grid-x > .small-7 {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
width: 58.33333%;
}
.grid-x > .small-8 {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
width: 66.66667%;
}
.grid-x > .small-9 {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
width: 75%;
}
.grid-x > .small-10 {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
width: 83.33333%;
}
.grid-x > .small-11 {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
width: 91.66667%;
}
.grid-x > .small-12 {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
width: 100%;
}
@media print, only screen and (min-width: 641px) {
.grid-x > .medium-auto {
-webkit-flex: 1 1 0px;
-ms-flex: 1 1 0px;
flex: 1 1 0px;
width: auto;
margin-left: 10px;
margin-right: 10px;
}
.grid-x > .medium-shrink {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
width: auto;
margin-left: 10px;
margin-right: 10px;
}
.grid-x > .medium-1 {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
width: 8.33333%;
}
.grid-x > .medium-2 {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
width: 16.66667%;
}
.grid-x > .medium-3 {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
width: 25%;
}
.grid-x > .medium-4 {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
width: 33.33333%;
}
.grid-x > .medium-5 {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
width: 41.66667%;
}
.grid-x > .medium-6 {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
width: 50%;
}
.grid-x > .medium-7 {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
width: 58.33333%;
}
.grid-x > .medium-8 {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
width: 66.66667%;
}
.grid-x > .medium-9 {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
width: 75%;
}
.grid-x > .medium-10 {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
width: 83.33333%;
}
.grid-x > .medium-11 {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
width: 91.66667%;
}
.grid-x > .medium-12 {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
width: 100%;
}
}
@media print, only screen and (min-width: 1025px) {
.grid-x > .large-auto {
-webkit-flex: 1 1 0px;
-ms-flex: 1 1 0px;
flex: 1 1 0px;
width: auto;
margin-left: 10px;
margin-right: 10px;
}
.grid-x > .large-shrink {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
width: auto;
margin-left: 10px;
margin-right: 10px;
}
.grid-x > .large-1 {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
width: 8.33333%;
}
.grid-x > .large-2 {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
width: 16.66667%;
}
.grid-x > .large-3 {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
width: 25%;
}
.grid-x > .large-4 {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
width: 33.33333%;
}
.grid-x > .large-5 {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
width: 41.66667%;
}
.grid-x > .large-6 {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
width: 50%;
}
.grid-x > .large-7 {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
width: 58.33333%;
}
.grid-x > .large-8 {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
width: 66.66667%;
}
.grid-x > .large-9 {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
width: 75%;
}
.grid-x > .large-10 {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
width: 83.33333%;
}
.grid-x > .large-11 {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
width: 91.66667%;
}
.grid-x > .large-12 {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
width: 100%;
}
}
.grid-margin-x:not(.grid-x) > .cell {
width: auto;
}
.grid-margin-y:not(.grid-y) > .cell {
height: auto;
}
.grid-margin-x {
margin-left: -10px;
margin-right: -10px;
}
@media print, only screen and (min-width: 641px) {
.grid-margin-x {
margin-left: -15px;
margin-right: -15px;
}
}
.grid-margin-x > .cell {
width: calc(100% - 20px);
margin-left: 10px;
margin-right: 10px;
}
@media print, only screen and (min-width: 641px) {
.grid-margin-x > .cell {
width: calc(100% - 30px);
margin-left: 15px;
margin-right: 15px;
}
}
.grid-margin-x > .auto {
width: auto;
margin-left: 10px;
margin-right: 10px;
}
.grid-margin-x > .shrink {
width: auto;
margin-left: 10px;
margin-right: 10px;
}
.grid-margin-x > .small-1 {
width: calc(8.33333% - 20px);
margin-left: 10px;
margin-right: 10px;
}
.grid-margin-x > .small-2 {
width: calc(16.66667% - 20px);
margin-left: 10px;
margin-right: 10px;
}
.grid-margin-x > .small-3 {
width: calc(25% - 20px);
margin-left: 10px;
margin-right: 10px;
}
.grid-margin-x > .small-4 {
width: calc(33.33333% - 20px);
margin-left: 10px;
margin-right: 10px;
}
.grid-margin-x > .small-5 {
width: calc(41.66667% - 20px);
margin-left: 10px;
margin-right: 10px;
}
.grid-margin-x > .small-6 {
width: calc(50% - 20px);
margin-left: 10px;
margin-right: 10px;
}
.grid-margin-x > .small-7 {
width: calc(58.33333% - 20px);
margin-left: 10px;
margin-right: 10px;
}
.grid-margin-x > .small-8 {
width: calc(66.66667% - 20px);
margin-left: 10px;
margin-right: 10px;
}
.grid-margin-x > .small-9 {
width: calc(75% - 20px);
margin-left: 10px;
margin-right: 10px;
}
.grid-margin-x > .small-10 {
width: calc(83.33333% - 20px);
margin-left: 10px;
margin-right: 10px;
}
.grid-margin-x > .small-11 {
width: calc(91.66667% - 20px);
margin-left: 10px;
margin-right: 10px;
}
.grid-margin-x > .small-12 {
width: calc(100% - 20px);
margin-left: 10px;
margin-right: 10px;
}
@media print, only screen and (min-width: 641px) {
.grid-margin-x > .auto {
width: auto;
margin-left: 15px;
margin-right: 15px;
}
.grid-margin-x > .shrink {
width: auto;
margin-left: 15px;
margin-right: 15px;
}
.grid-margin-x > .small-1 {
width: calc(8.33333% - 30px);
margin-left: 15px;
margin-right: 15px;
}
.grid-margin-x > .small-2 {
width: calc(16.66667% - 30px);
margin-left: 15px;
margin-right: 15px;
}
.grid-margin-x > .small-3 {
width: calc(25% - 30px);
margin-left: 15px;
margin-right: 15px;
}
.grid-margin-x > .small-4 {
width: calc(33.33333% - 30px);
margin-left: 15px;
margin-right: 15px;
}
.grid-margin-x > .small-5 {
width: calc(41.66667% - 30px);
margin-left: 15px;
margin-right: 15px;
}
.grid-margin-x > .small-6 {
width: calc(50% - 30px);
margin-left: 15px;
margin-right: 15px;
}
.grid-margin-x > .small-7 {
width: calc(58.33333% - 30px);
margin-left: 15px;
margin-right: 15px;
}
.grid-margin-x > .small-8 {
width: calc(66.66667% - 30px);
margin-left: 15px;
margin-right: 15px;
}
.grid-margin-x > .small-9 {
width: calc(75% - 30px);
margin-left: 15px;
margin-right: 15px;
}
.grid-margin-x > .small-10 {
width: calc(83.33333% - 30px);
margin-left: 15px;
margin-right: 15px;
}
.grid-margin-x > .small-11 {
width: calc(91.66667% - 30px);
margin-left: 15px;
margin-right: 15px;
}
.grid-margin-x > .small-12 {
width: calc(100% - 30px);
margin-left: 15px;
margin-right: 15px;
}
.grid-margin-x > .medium-auto {
width: auto;
margin-left: 15px;
margin-right: 15px;
}
.grid-margin-x > .medium-shrink {
width: auto;
margin-left: 15px;
margin-right: 15px;
}
.grid-margin-x > .medium-1 {
width: calc(8.33333% - 30px);
margin-left: 15px;
margin-right: 15px;
}
.grid-margin-x > .medium-2 {
width: calc(16.66667% - 30px);
margin-left: 15px;
margin-right: 15px;
}
.grid-margin-x > .medium-3 {
width: calc(25% - 30px);
margin-left: 15px;
margin-right: 15px;
}
.grid-margin-x > .medium-4 {
width: calc(33.33333% - 30px);
margin-left: 15px;
margin-right: 15px;
}
.grid-margin-x > .medium-5 {
width: calc(41.66667% - 30px);
margin-left: 15px;
margin-right: 15px;
}
.grid-margin-x > .medium-6 {
width: calc(50% - 30px);
margin-left: 15px;
margin-right: 15px;
}
.grid-margin-x > .medium-7 {
width: calc(58.33333% - 30px);
margin-left: 15px;
margin-right: 15px;
}
.grid-margin-x > .medium-8 {
width: calc(66.66667% - 30px);
margin-left: 15px;
margin-right: 15px;
}
.grid-margin-x > .medium-9 {
width: calc(75% - 30px);
margin-left: 15px;
margin-right: 15px;
}
.grid-margin-x > .medium-10 {
width: calc(83.33333% - 30px);
margin-left: 15px;
margin-right: 15px;
}
.grid-margin-x > .medium-11 {
width: calc(91.66667% - 30px);
margin-left: 15px;
margin-right: 15px;
}
.grid-margin-x > .medium-12 {
width: calc(100% - 30px);
margin-left: 15px;
margin-right: 15px;
}
}
@media print, only screen and (min-width: 1025px) {
.grid-margin-x > .large-auto {
width: auto;
margin-left: 15px;
margin-right: 15px;
}
.grid-margin-x > .large-shrink {
width: auto;
margin-left: 15px;
margin-right: 15px;
}
.grid-margin-x > .large-1 {
width: calc(8.33333% - 30px);
margin-left: 15px;
margin-right: 15px;
}
.grid-margin-x > .large-2 {
width: calc(16.66667% - 30px);
margin-left: 15px;
margin-right: 15px;
}
.grid-margin-x > .large-3 {
width: calc(25% - 30px);
margin-left: 15px;
margin-right: 15px;
}
.grid-margin-x > .large-4 {
width: calc(33.33333% - 30px);
margin-left: 15px;
margin-right: 15px;
}
.grid-margin-x > .large-5 {
width: calc(41.66667% - 30px);
margin-left: 15px;
margin-right: 15px;
}
.grid-margin-x > .large-6 {
width: calc(50% - 30px);
margin-left: 15px;
margin-right: 15px;
}
.grid-margin-x > .large-7 {
width: calc(58.33333% - 30px);
margin-left: 15px;
margin-right: 15px;
}
.grid-margin-x > .large-8 {
width: calc(66.66667% - 30px);
margin-left: 15px;
margin-right: 15px;
}
.grid-margin-x > .large-9 {
width: calc(75% - 30px);
margin-left: 15px;
margin-right: 15px;
}
.grid-margin-x > .large-10 {
width: calc(83.33333% - 30px);
margin-left: 15px;
margin-right: 15px;
}
.grid-margin-x > .large-11 {
width: calc(91.66667% - 30px);
margin-left: 15px;
margin-right: 15px;
}
.grid-margin-x > .large-12 {
width: calc(100% - 30px);
margin-left: 15px;
margin-right: 15px;
}
}
.grid-padding-x .grid-padding-x {
margin-right: -10px;
margin-left: -10px;
}
@media print, only screen and (min-width: 641px) {
.grid-padding-x .grid-padding-x {
margin-right: -15px;
margin-left: -15px;
}
}
.grid-container:not(.full) > .grid-padding-x {
margin-right: -10px;
margin-left: -10px;
}
@media print, only screen and (min-width: 641px) {
.grid-container:not(.full) > .grid-padding-x {
margin-right: -15px;
margin-left: -15px;
}
}
.grid-padding-x > .cell {
padding-right: 10px;
padding-left: 10px;
}
@media print, only screen and (min-width: 641px) {
.grid-padding-x > .cell {
padding-right: 15px;
padding-left: 15px;
}
}
.small-up-1 > .cell {
width: 100%;
}
.small-up-2 > .cell {
width: 50%;
}
.small-up-3 > .cell {
width: 33.33333%;
}
.small-up-4 > .cell {
width: 25%;
}
.small-up-5 > .cell {
width: 20%;
}
.small-up-6 > .cell {
width: 16.66667%;
}
.small-up-7 > .cell {
width: 14.28571%;
}
.small-up-8 > .cell {
width: 12.5%;
}
@media print, only screen and (min-width: 641px) {
.medium-up-1 > .cell {
width: 100%;
}
.medium-up-2 > .cell {
width: 50%;
}
.medium-up-3 > .cell {
width: 33.33333%;
}
.medium-up-4 > .cell {
width: 25%;
}
.medium-up-5 > .cell {
width: 20%;
}
.medium-up-6 > .cell {
width: 16.66667%;
}
.medium-up-7 > .cell {
width: 14.28571%;
}
.medium-up-8 > .cell {
width: 12.5%;
}
}
@media print, only screen and (min-width: 1025px) {
.large-up-1 > .cell {
width: 100%;
}
.large-up-2 > .cell {
width: 50%;
}
.large-up-3 > .cell {
width: 33.33333%;
}
.large-up-4 > .cell {
width: 25%;
}
.large-up-5 > .cell {
width: 20%;
}
.large-up-6 > .cell {
width: 16.66667%;
}
.large-up-7 > .cell {
width: 14.28571%;
}
.large-up-8 > .cell {
width: 12.5%;
}
}
.grid-margin-x.small-up-1 > .cell {
width: calc(100% - 20px);
margin-right: 10px;
margin-left: 10px;
}
.grid-margin-x.small-up-2 > .cell {
width: calc(50% - 20px);
margin-right: 10px;
margin-left: 10px;
}
.grid-margin-x.small-up-3 > .cell {
width: calc(33.33333% - 20px);
margin-right: 10px;
margin-left: 10px;
}
.grid-margin-x.small-up-4 > .cell {
width: calc(25% - 20px);
margin-right: 10px;
margin-left: 10px;
}
.grid-margin-x.small-up-5 > .cell {
width: calc(20% - 20px);
margin-right: 10px;
margin-left: 10px;
}
.grid-margin-x.small-up-6 > .cell {
width: calc(16.66667% - 20px);
margin-right: 10px;
margin-left: 10px;
}
.grid-margin-x.small-up-7 > .cell {
width: calc(14.28571% - 20px);
margin-right: 10px;
margin-left: 10px;
}
.grid-margin-x.small-up-8 > .cell {
width: calc(12.5% - 20px);
margin-right: 10px;
margin-left: 10px;
}
@media print, only screen and (min-width: 641px) {
.grid-margin-x.small-up-1 > .cell {
width: calc(100% - 30px);
margin-right: 15px;
margin-left: 15px;
}
.grid-margin-x.small-up-2 > .cell {
width: calc(50% - 30px);
margin-right: 15px;
margin-left: 15px;
}
.grid-margin-x.small-up-3 > .cell {
width: calc(33.33333% - 30px);
margin-right: 15px;
margin-left: 15px;
}
.grid-margin-x.small-up-4 > .cell {
width: calc(25% - 30px);
margin-right: 15px;
margin-left: 15px;
}
.grid-margin-x.small-up-5 > .cell {
width: calc(20% - 30px);
margin-right: 15px;
margin-left: 15px;
}
.grid-margin-x.small-up-6 > .cell {
width: calc(16.66667% - 30px);
margin-right: 15px;
margin-left: 15px;
}
.grid-margin-x.small-up-7 > .cell {
width: calc(14.28571% - 30px);
margin-right: 15px;
margin-left: 15px;
}
.grid-margin-x.small-up-8 > .cell {
width: calc(12.5% - 30px);
margin-right: 15px;
margin-left: 15px;
}
.grid-margin-x.medium-up-1 > .cell {
width: calc(100% - 30px);
margin-right: 15px;
margin-left: 15px;
}
.grid-margin-x.medium-up-2 > .cell {
width: calc(50% - 30px);
margin-right: 15px;
margin-left: 15px;
}
.grid-margin-x.medium-up-3 > .cell {
width: calc(33.33333% - 30px);
margin-right: 15px;
margin-left: 15px;
}
.grid-margin-x.medium-up-4 > .cell {
width: calc(25% - 30px);
margin-right: 15px;
margin-left: 15px;
}
.grid-margin-x.medium-up-5 > .cell {
width: calc(20% - 30px);
margin-right: 15px;
margin-left: 15px;
}
.grid-margin-x.medium-up-6 > .cell {
width: calc(16.66667% - 30px);
margin-right: 15px;
margin-left: 15px;
}
.grid-margin-x.medium-up-7 > .cell {
width: calc(14.28571% - 30px);
margin-right: 15px;
margin-left: 15px;
}
.grid-margin-x.medium-up-8 > .cell {
width: calc(12.5% - 30px);
margin-right: 15px;
margin-left: 15px;
}
}
@media print, only screen and (min-width: 1025px) {
.grid-margin-x.large-up-1 > .cell {
width: calc(100% - 30px);
margin-right: 15px;
margin-left: 15px;
}
.grid-margin-x.large-up-2 > .cell {
width: calc(50% - 30px);
margin-right: 15px;
margin-left: 15px;
}
.grid-margin-x.large-up-3 > .cell {
width: calc(33.33333% - 30px);
margin-right: 15px;
margin-left: 15px;
}
.grid-margin-x.large-up-4 > .cell {
width: calc(25% - 30px);
margin-right: 15px;
margin-left: 15px;
}
.grid-margin-x.large-up-5 > .cell {
width: calc(20% - 30px);
margin-right: 15px;
margin-left: 15px;
}
.grid-margin-x.large-up-6 > .cell {
width: calc(16.66667% - 30px);
margin-right: 15px;
margin-left: 15px;
}
.grid-margin-x.large-up-7 > .cell {
width: calc(14.28571% - 30px);
margin-right: 15px;
margin-left: 15px;
}
.grid-margin-x.large-up-8 > .cell {
width: calc(12.5% - 30px);
margin-right: 15px;
margin-left: 15px;
}
}
.small-margin-collapse {
margin-right: 0;
margin-left: 0;
}
.small-margin-collapse > .cell {
margin-right: 0;
margin-left: 0;
}
.small-margin-collapse > .small-1 {
width: 8.33333%;
}
.small-margin-collapse > .small-2 {
width: 16.66667%;
}
.small-margin-collapse > .small-3 {
width: 25%;
}
.small-margin-collapse > .small-4 {
width: 33.33333%;
}
.small-margin-collapse > .small-5 {
width: 41.66667%;
}
.small-margin-collapse > .small-6 {
width: 50%;
}
.small-margin-collapse > .small-7 {
width: 58.33333%;
}
.small-margin-collapse > .small-8 {
width: 66.66667%;
}
.small-margin-collapse > .small-9 {
width: 75%;
}
.small-margin-collapse > .small-10 {
width: 83.33333%;
}
.small-margin-collapse > .small-11 {
width: 91.66667%;
}
.small-margin-collapse > .small-12 {
width: 100%;
}
@media print, only screen and (min-width: 641px) {
.small-margin-collapse > .medium-1 {
width: 8.33333%;
}
.small-margin-collapse > .medium-2 {
width: 16.66667%;
}
.small-margin-collapse > .medium-3 {
width: 25%;
}
.small-margin-collapse > .medium-4 {
width: 33.33333%;
}
.small-margin-collapse > .medium-5 {
width: 41.66667%;
}
.small-margin-collapse > .medium-6 {
width: 50%;
}
.small-margin-collapse > .medium-7 {
width: 58.33333%;
}
.small-margin-collapse > .medium-8 {
width: 66.66667%;
}
.small-margin-collapse > .medium-9 {
width: 75%;
}
.small-margin-collapse > .medium-10 {
width: 83.33333%;
}
.small-margin-collapse > .medium-11 {
width: 91.66667%;
}
.small-margin-collapse > .medium-12 {
width: 100%;
}
}
@media print, only screen and (min-width: 1025px) {
.small-margin-collapse > .large-1 {
width: 8.33333%;
}
.small-margin-collapse > .large-2 {
width: 16.66667%;
}
.small-margin-collapse > .large-3 {
width: 25%;
}
.small-margin-collapse > .large-4 {
width: 33.33333%;
}
.small-margin-collapse > .large-5 {
width: 41.66667%;
}
.small-margin-collapse > .large-6 {
width: 50%;
}
.small-margin-collapse > .large-7 {
width: 58.33333%;
}
.small-margin-collapse > .large-8 {
width: 66.66667%;
}
.small-margin-collapse > .large-9 {
width: 75%;
}
.small-margin-collapse > .large-10 {
width: 83.33333%;
}
.small-margin-collapse > .large-11 {
width: 91.66667%;
}
.small-margin-collapse > .large-12 {
width: 100%;
}
}
.small-padding-collapse {
margin-right: 0;
margin-left: 0;
}
.small-padding-collapse > .cell {
padding-right: 0;
padding-left: 0;
}
@media print, only screen and (min-width: 641px) {
.medium-margin-collapse {
margin-right: 0;
margin-left: 0;
}
.medium-margin-collapse > .cell {
margin-right: 0;
margin-left: 0;
}
}
@media print, only screen and (min-width: 641px) {
.medium-margin-collapse > .small-1 {
width: 8.33333%;
}
.medium-margin-collapse > .small-2 {
width: 16.66667%;
}
.medium-margin-collapse > .small-3 {
width: 25%;
}
.medium-margin-collapse > .small-4 {
width: 33.33333%;
}
.medium-margin-collapse > .small-5 {
width: 41.66667%;
}
.medium-margin-collapse > .small-6 {
width: 50%;
}
.medium-margin-collapse > .small-7 {
width: 58.33333%;
}
.medium-margin-collapse > .small-8 {
width: 66.66667%;
}
.medium-margin-collapse > .small-9 {
width: 75%;
}
.medium-margin-collapse > .small-10 {
width: 83.33333%;
}
.medium-margin-collapse > .small-11 {
width: 91.66667%;
}
.medium-margin-collapse > .small-12 {
width: 100%;
}
}
@media print, only screen and (min-width: 641px) {
.medium-margin-collapse > .medium-1 {
width: 8.33333%;
}
.medium-margin-collapse > .medium-2 {
width: 16.66667%;
}
.medium-margin-collapse > .medium-3 {
width: 25%;
}
.medium-margin-collapse > .medium-4 {
width: 33.33333%;
}
.medium-margin-collapse > .medium-5 {
width: 41.66667%;
}
.medium-margin-collapse > .medium-6 {
width: 50%;
}
.medium-margin-collapse > .medium-7 {
width: 58.33333%;
}
.medium-margin-collapse > .medium-8 {
width: 66.66667%;
}
.medium-margin-collapse > .medium-9 {
width: 75%;
}
.medium-margin-collapse > .medium-10 {
width: 83.33333%;
}
.medium-margin-collapse > .medium-11 {
width: 91.66667%;
}
.medium-margin-collapse > .medium-12 {
width: 100%;
}
}
@media print, only screen and (min-width: 1025px) {
.medium-margin-collapse > .large-1 {
width: 8.33333%;
}
.medium-margin-collapse > .large-2 {
width: 16.66667%;
}
.medium-margin-collapse > .large-3 {
width: 25%;
}
.medium-margin-collapse > .large-4 {
width: 33.33333%;
}
.medium-margin-collapse > .large-5 {
width: 41.66667%;
}
.medium-margin-collapse > .large-6 {
width: 50%;
}
.medium-margin-collapse > .large-7 {
width: 58.33333%;
}
.medium-margin-collapse > .large-8 {
width: 66.66667%;
}
.medium-margin-collapse > .large-9 {
width: 75%;
}
.medium-margin-collapse > .large-10 {
width: 83.33333%;
}
.medium-margin-collapse > .large-11 {
width: 91.66667%;
}
.medium-margin-collapse > .large-12 {
width: 100%;
}
}
@media print, only screen and (min-width: 641px) {
.medium-padding-collapse {
margin-right: 0;
margin-left: 0;
}
.medium-padding-collapse > .cell {
padding-right: 0;
padding-left: 0;
}
}
@media print, only screen and (min-width: 1025px) {
.large-margin-collapse {
margin-right: 0;
margin-left: 0;
}
.large-margin-collapse > .cell {
margin-right: 0;
margin-left: 0;
}
}
@media print, only screen and (min-width: 1025px) {
.large-margin-collapse > .small-1 {
width: 8.33333%;
}
.large-margin-collapse > .small-2 {
width: 16.66667%;
}
.large-margin-collapse > .small-3 {
width: 25%;
}
.large-margin-collapse > .small-4 {
width: 33.33333%;
}
.large-margin-collapse > .small-5 {
width: 41.66667%;
}
.large-margin-collapse > .small-6 {
width: 50%;
}
.large-margin-collapse > .small-7 {
width: 58.33333%;
}
.large-margin-collapse > .small-8 {
width: 66.66667%;
}
.large-margin-collapse > .small-9 {
width: 75%;
}
.large-margin-collapse > .small-10 {
width: 83.33333%;
}
.large-margin-collapse > .small-11 {
width: 91.66667%;
}
.large-margin-collapse > .small-12 {
width: 100%;
}
}
@media print, only screen and (min-width: 1025px) {
.large-margin-collapse > .medium-1 {
width: 8.33333%;
}
.large-margin-collapse > .medium-2 {
width: 16.66667%;
}
.large-margin-collapse > .medium-3 {
width: 25%;
}
.large-margin-collapse > .medium-4 {
width: 33.33333%;
}
.large-margin-collapse > .medium-5 {
width: 41.66667%;
}
.large-margin-collapse > .medium-6 {
width: 50%;
}
.large-margin-collapse > .medium-7 {
width: 58.33333%;
}
.large-margin-collapse > .medium-8 {
width: 66.66667%;
}
.large-margin-collapse > .medium-9 {
width: 75%;
}
.large-margin-collapse > .medium-10 {
width: 83.33333%;
}
.large-margin-collapse > .medium-11 {
width: 91.66667%;
}
.large-margin-collapse > .medium-12 {
width: 100%;
}
}
@media print, only screen and (min-width: 1025px) {
.large-margin-collapse > .large-1 {
width: 8.33333%;
}
.large-margin-collapse > .large-2 {
width: 16.66667%;
}
.large-margin-collapse > .large-3 {
width: 25%;
}
.large-margin-collapse > .large-4 {
width: 33.33333%;
}
.large-margin-collapse > .large-5 {
width: 41.66667%;
}
.large-margin-collapse > .large-6 {
width: 50%;
}
.large-margin-collapse > .large-7 {
width: 58.33333%;
}
.large-margin-collapse > .large-8 {
width: 66.66667%;
}
.large-margin-collapse > .large-9 {
width: 75%;
}
.large-margin-collapse > .large-10 {
width: 83.33333%;
}
.large-margin-collapse > .large-11 {
width: 91.66667%;
}
.large-margin-collapse > .large-12 {
width: 100%;
}
}
@media print, only screen and (min-width: 1025px) {
.large-padding-collapse {
margin-right: 0;
margin-left: 0;
}
.large-padding-collapse > .cell {
padding-right: 0;
padding-left: 0;
}
}
.small-offset-0 {
margin-right: 0%;
}
.grid-margin-x > .small-offset-0 {
margin-right: calc(0% + 10px);
}
.small-offset-1 {
margin-right: 8.33333%;
}
.grid-margin-x > .small-offset-1 {
margin-right: calc(8.33333% + 10px);
}
.small-offset-2 {
margin-right: 16.66667%;
}
.grid-margin-x > .small-offset-2 {
margin-right: calc(16.66667% + 10px);
}
.small-offset-3 {
margin-right: 25%;
}
.grid-margin-x > .small-offset-3 {
margin-right: calc(25% + 10px);
}
.small-offset-4 {
margin-right: 33.33333%;
}
.grid-margin-x > .small-offset-4 {
margin-right: calc(33.33333% + 10px);
}
.small-offset-5 {
margin-right: 41.66667%;
}
.grid-margin-x > .small-offset-5 {
margin-right: calc(41.66667% + 10px);
}
.small-offset-6 {
margin-right: 50%;
}
.grid-margin-x > .small-offset-6 {
margin-right: calc(50% + 10px);
}
.small-offset-7 {
margin-right: 58.33333%;
}
.grid-margin-x > .small-offset-7 {
margin-right: calc(58.33333% + 10px);
}
.small-offset-8 {
margin-right: 66.66667%;
}
.grid-margin-x > .small-offset-8 {
margin-right: calc(66.66667% + 10px);
}
.small-offset-9 {
margin-right: 75%;
}
.grid-margin-x > .small-offset-9 {
margin-right: calc(75% + 10px);
}
.small-offset-10 {
margin-right: 83.33333%;
}
.grid-margin-x > .small-offset-10 {
margin-right: calc(83.33333% + 10px);
}
.small-offset-11 {
margin-right: 91.66667%;
}
.grid-margin-x > .small-offset-11 {
margin-right: calc(91.66667% + 10px);
}
@media print, only screen and (min-width: 641px) {
.medium-offset-0 {
margin-right: 0%;
}
.grid-margin-x > .medium-offset-0 {
margin-right: calc(0% + 15px);
}
.medium-offset-1 {
margin-right: 8.33333%;
}
.grid-margin-x > .medium-offset-1 {
margin-right: calc(8.33333% + 15px);
}
.medium-offset-2 {
margin-right: 16.66667%;
}
.grid-margin-x > .medium-offset-2 {
margin-right: calc(16.66667% + 15px);
}
.medium-offset-3 {
margin-right: 25%;
}
.grid-margin-x > .medium-offset-3 {
margin-right: calc(25% + 15px);
}
.medium-offset-4 {
margin-right: 33.33333%;
}
.grid-margin-x > .medium-offset-4 {
margin-right: calc(33.33333% + 15px);
}
.medium-offset-5 {
margin-right: 41.66667%;
}
.grid-margin-x > .medium-offset-5 {
margin-right: calc(41.66667% + 15px);
}
.medium-offset-6 {
margin-right: 50%;
}
.grid-margin-x > .medium-offset-6 {
margin-right: calc(50% + 15px);
}
.medium-offset-7 {
margin-right: 58.33333%;
}
.grid-margin-x > .medium-offset-7 {
margin-right: calc(58.33333% + 15px);
}
.medium-offset-8 {
margin-right: 66.66667%;
}
.grid-margin-x > .medium-offset-8 {
margin-right: calc(66.66667% + 15px);
}
.medium-offset-9 {
margin-right: 75%;
}
.grid-margin-x > .medium-offset-9 {
margin-right: calc(75% + 15px);
}
.medium-offset-10 {
margin-right: 83.33333%;
}
.grid-margin-x > .medium-offset-10 {
margin-right: calc(83.33333% + 15px);
}
.medium-offset-11 {
margin-right: 91.66667%;
}
.grid-margin-x > .medium-offset-11 {
margin-right: calc(91.66667% + 15px);
}
}
@media print, only screen and (min-width: 1025px) {
.large-offset-0 {
margin-right: 0%;
}
.grid-margin-x > .large-offset-0 {
margin-right: calc(0% + 15px);
}
.large-offset-1 {
margin-right: 8.33333%;
}
.grid-margin-x > .large-offset-1 {
margin-right: calc(8.33333% + 15px);
}
.large-offset-2 {
margin-right: 16.66667%;
}
.grid-margin-x > .large-offset-2 {
margin-right: calc(16.66667% + 15px);
}
.large-offset-3 {
margin-right: 25%;
}
.grid-margin-x > .large-offset-3 {
margin-right: calc(25% + 15px);
}
.large-offset-4 {
margin-right: 33.33333%;
}
.grid-margin-x > .large-offset-4 {
margin-right: calc(33.33333% + 15px);
}
.large-offset-5 {
margin-right: 41.66667%;
}
.grid-margin-x > .large-offset-5 {
margin-right: calc(41.66667% + 15px);
}
.large-offset-6 {
margin-right: 50%;
}
.grid-margin-x > .large-offset-6 {
margin-right: calc(50% + 15px);
}
.large-offset-7 {
margin-right: 58.33333%;
}
.grid-margin-x > .large-offset-7 {
margin-right: calc(58.33333% + 15px);
}
.large-offset-8 {
margin-right: 66.66667%;
}
.grid-margin-x > .large-offset-8 {
margin-right: calc(66.66667% + 15px);
}
.large-offset-9 {
margin-right: 75%;
}
.grid-margin-x > .large-offset-9 {
margin-right: calc(75% + 15px);
}
.large-offset-10 {
margin-right: 83.33333%;
}
.grid-margin-x > .large-offset-10 {
margin-right: calc(83.33333% + 15px);
}
.large-offset-11 {
margin-right: 91.66667%;
}
.grid-margin-x > .large-offset-11 {
margin-right: calc(91.66667% + 15px);
}
}
.grid-y {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-flow: column nowrap;
-ms-flex-flow: column nowrap;
flex-flow: column nowrap;
}
.grid-y > .cell {
width: auto;
max-width: none;
}
.grid-y > .auto {
height: auto;
margin-top: 15px;
margin-bottom: 15px;
}
.grid-y > .shrink {
height: auto;
margin-top: 15px;
margin-bottom: 15px;
}
.grid-y > .small-shrink, .grid-y > .small-full, .grid-y > .small-1, .grid-y > .small-2, .grid-y > .small-3, .grid-y > .small-4, .grid-y > .small-5, .grid-y > .small-6, .grid-y > .small-7, .grid-y > .small-8, .grid-y > .small-9, .grid-y > .small-10, .grid-y > .small-11, .grid-y > .small-12 {
-webkit-flex-basis: auto;
-ms-flex-preferred-size: auto;
flex-basis: auto;
}
@media print, only screen and (min-width: 641px) {
.grid-y > .medium-shrink, .grid-y > .medium-full, .grid-y > .medium-1, .grid-y > .medium-2, .grid-y > .medium-3, .grid-y > .medium-4, .grid-y > .medium-5, .grid-y > .medium-6, .grid-y > .medium-7, .grid-y > .medium-8, .grid-y > .medium-9, .grid-y > .medium-10, .grid-y > .medium-11, .grid-y > .medium-12 {
-webkit-flex-basis: auto;
-ms-flex-preferred-size: auto;
flex-basis: auto;
}
}
@media print, only screen and (min-width: 1025px) {
.grid-y > .large-shrink, .grid-y > .large-full, .grid-y > .large-1, .grid-y > .large-2, .grid-y > .large-3, .grid-y > .large-4, .grid-y > .large-5, .grid-y > .large-6, .grid-y > .large-7, .grid-y > .large-8, .grid-y > .large-9, .grid-y > .large-10, .grid-y > .large-11, .grid-y > .large-12 {
-webkit-flex-basis: auto;
-ms-flex-preferred-size: auto;
flex-basis: auto;
}
}
.grid-y > .small-1 {
height: 8.33333%;
}
.grid-y > .small-2 {
height: 16.66667%;
}
.grid-y > .small-3 {
height: 25%;
}
.grid-y > .small-4 {
height: 33.33333%;
}
.grid-y > .small-5 {
height: 41.66667%;
}
.grid-y > .small-6 {
height: 50%;
}
.grid-y > .small-7 {
height: 58.33333%;
}
.grid-y > .small-8 {
height: 66.66667%;
}
.grid-y > .small-9 {
height: 75%;
}
.grid-y > .small-10 {
height: 83.33333%;
}
.grid-y > .small-11 {
height: 91.66667%;
}
.grid-y > .small-12 {
height: 100%;
}
@media print, only screen and (min-width: 641px) {
.grid-y > .medium-auto {
-webkit-flex: 1 1 0px;
-ms-flex: 1 1 0px;
flex: 1 1 0px;
height: auto;
margin-top: 15px;
margin-bottom: 15px;
}
.grid-y > .medium-shrink {
height: auto;
margin-top: 15px;
margin-bottom: 15px;
}
.grid-y > .medium-1 {
height: 8.33333%;
}
.grid-y > .medium-2 {
height: 16.66667%;
}
.grid-y > .medium-3 {
height: 25%;
}
.grid-y > .medium-4 {
height: 33.33333%;
}
.grid-y > .medium-5 {
height: 41.66667%;
}
.grid-y > .medium-6 {
height: 50%;
}
.grid-y > .medium-7 {
height: 58.33333%;
}
.grid-y > .medium-8 {
height: 66.66667%;
}
.grid-y > .medium-9 {
height: 75%;
}
.grid-y > .medium-10 {
height: 83.33333%;
}
.grid-y > .medium-11 {
height: 91.66667%;
}
.grid-y > .medium-12 {
height: 100%;
}
}
@media print, only screen and (min-width: 1025px) {
.grid-y > .large-auto {
-webkit-flex: 1 1 0px;
-ms-flex: 1 1 0px;
flex: 1 1 0px;
height: auto;
margin-top: 15px;
margin-bottom: 15px;
}
.grid-y > .large-shrink {
height: auto;
margin-top: 15px;
margin-bottom: 15px;
}
.grid-y > .large-1 {
height: 8.33333%;
}
.grid-y > .large-2 {
height: 16.66667%;
}
.grid-y > .large-3 {
height: 25%;
}
.grid-y > .large-4 {
height: 33.33333%;
}
.grid-y > .large-5 {
height: 41.66667%;
}
.grid-y > .large-6 {
height: 50%;
}
.grid-y > .large-7 {
height: 58.33333%;
}
.grid-y > .large-8 {
height: 66.66667%;
}
.grid-y > .large-9 {
height: 75%;
}
.grid-y > .large-10 {
height: 83.33333%;
}
.grid-y > .large-11 {
height: 91.66667%;
}
.grid-y > .large-12 {
height: 100%;
}
}
.grid-padding-y .grid-padding-y {
margin-top: -10px;
margin-bottom: -10px;
}
@media print, only screen and (min-width: 6