/* =================================================================== * Keep It Simple Base Stylesheet * Ver. 3.0.0 * 12-14-2019 * ------------------------------------------------------------------ * * TOC: * # imports * # normalize * # basic/base setup styles * ## media * ## typography resets * ## links * ## inputs * # Grid v2.1.3 * ## medium screen devices * ## tablets * ## mobile devices * ## small mobile devices <= 400px * # block grids * ## block grids - medium screen devices * ## block grids - tablets * ## block grids - mobile devices * ## block grids - small mobile devices <= 400px * # MISC * * =================================================================== */ /* =================================================================== * # imports * * ------------------------------------------------------------------- */ @import url("https://fonts.googleapis.com/css?family=Merriweather:300,300i,400,400i,700,700i|Open+Sans:400,400i,600,600i,700,700i&display=swap"); /* ========================================================================== * # normalize * normalize.css v8.0.1 | MIT License | * github.com/necolas/normalize.css * * -------------------------------------------------------------------------- */ /* ------------------------------------------------------------------- * ## document * ------------------------------------------------------------------- */ /* 1. Correct the line height in all browsers. * 2. Prevent adjustments of font size after orientation changes in iOS.*/ html { line-height: 1.15; /* 1 */ -webkit-text-size-adjust: 100%; /* 2 */ } /* ------------------------------------------------------------------- * ## sections * ------------------------------------------------------------------- */ /* Remove the margin in all browsers. */ body { margin: 0; } /* Render the `main` element consistently in IE. */ main { display: block; } /* Correct the font size and margin on `h1` elements within `section` and * `article` contexts in Chrome, Firefox, and Safari. */ h1 { font-size: 2em; margin: 0.67em 0; } /* ------------------------------------------------------------------- * ## grouping * ------------------------------------------------------------------- */ /* 1. Add the correct box sizing in Firefox. * 2. Show the overflow in Edge and IE. */ hr { -webkit-box-sizing: content-box; box-sizing: content-box; /* 1 */ height: 0; /* 1 */ overflow: visible; /* 2 */ } /* 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ pre { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ } /* ------------------------------------------------------------------- * ## text-level semantics * ------------------------------------------------------------------- */ /* Remove the gray background on active links in IE 10. */ a { background-color: transparent; } /* 1. Remove the bottom border in Chrome 57- * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. */ abbr[title] { border-bottom: none; /* 1 */ text-decoration: underline; /* 2 */ -webkit-text-decoration: underline dotted; text-decoration: underline dotted; /* 2 */ } /* Add the correct font weight in Chrome, Edge, and Safari. */ b, strong { font-weight: bolder; } /* 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ code, kbd, samp { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ } /* Add the correct font size in all browsers. */ small { font-size: 80%; } /* Prevent `sub` and `sup` elements from affecting the line height in * all browsers. */ sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; } /* ------------------------------------------------------------------- * ## embedded content * ------------------------------------------------------------------- */ /* Remove the border on images inside links in IE 10. */ img { border-style: none; } /* ------------------------------------------------------------------- * ## forms * ------------------------------------------------------------------- */ /* 1. Change the font styles in all browsers. * 2. Remove the margin in Firefox and Safari. */ button, input, optgroup, select, textarea { font-family: inherit; /* 1 */ font-size: 100%; /* 1 */ line-height: 1.15; /* 1 */ margin: 0; /* 2 */ } /* Show the overflow in IE. * 1. Show the overflow in Edge. */ button, input { /* 1 */ overflow: visible; } /* Remove the inheritance of text transform in Edge, Firefox, and IE. * 1. Remove the inheritance of text transform in Firefox. */ button, select { /* 1 */ text-transform: none; } /* Correct the inability to style clickable types in iOS and Safari. */ button, [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button; } /* Remove the inner border and padding in Firefox. */ button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner { border-style: none; padding: 0; } /* Restore the focus styles unset by the previous rule. */ button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring { outline: 1px dotted ButtonText; } /* Correct the padding in Firefox. */ fieldset { padding: 0.35em 0.75em 0.625em; } /* 1. Correct the text wrapping in Edge and IE. * 2. Correct the color inheritance from `fieldset` elements in IE. * 3. Remove the padding so developers are not caught out when they zero out * `fieldset` elements in all browsers. */ legend { -webkit-box-sizing: border-box; box-sizing: border-box; /* 1 */ color: inherit; /* 2 */ display: table; /* 1 */ max-width: 100%; /* 1 */ padding: 0; /* 3 */ white-space: normal; /* 1 */ } /* Add the correct vertical alignment in Chrome, Firefox, and Opera. */ progress { vertical-align: baseline; } /* Remove the default vertical scrollbar in IE 10+. */ textarea { overflow: auto; } /* 1. Add the correct box sizing in IE 10. * 2. Remove the padding in IE 10. */ [type="checkbox"], [type="radio"] { -webkit-box-sizing: border-box; box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ } /* Correct the cursor style of increment and decrement buttons in Chrome. */ [type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; } /* 1. Correct the odd appearance in Chrome and Safari. * 2. Correct the outline style in Safari. */ [type="search"] { -webkit-appearance: textfield; /* 1 */ outline-offset: -2px; /* 2 */ } /* Remove the inner padding in Chrome and Safari on macOS. */ [type="search"]::-webkit-search-decoration { -webkit-appearance: none; } /* 1. Correct the inability to style clickable types in iOS and Safari. * 2. Change font properties to `inherit` in Safari. */ ::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ } /* ------------------------------------------------------------------- * ## interactive * ------------------------------------------------------------------- */ /* Add the correct display in Edge, IE 10+, and Firefox. */ details { display: block; } /* Add the correct display in all browsers. */ summary { display: list-item; } /* ------------------------------------------------------------------- * ## misc * ------------------------------------------------------------------- */ /* Add the correct display in IE 10+. */ template { display: none; } /* Add the correct display in IE 10. */ [hidden] { display: none; } /* =================================================================== * # basic/base setup styles * * ------------------------------------------------------------------- */ html { font-size: 62.5%; -webkit-box-sizing: border-box; box-sizing: border-box; } *, *::before, *::after { -webkit-box-sizing: inherit; box-sizing: inherit; } body { font-weight: normal; line-height: 1; word-wrap: break-word; -moz-font-smoothing: grayscale; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; -webkit-overflow-scrolling: touch; -webkit-text-size-adjust: none; } /* ------------------------------------------------------------------- * ## media * ------------------------------------------------------------------- */ svg, img, video embed, iframe, object { max-width: 100%; height: auto; } /* ------------------------------------------------------------------- * ## typography resets * ------------------------------------------------------------------- */ div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, p, blockquote, th, td { margin: 0; padding: 0; } p { font-size: inherit; text-rendering: optimizeLegibility; } em, i { font-style: italic; line-height: inherit; } strong, b { font-weight: bold; line-height: inherit; } small { font-size: 60%; line-height: inherit; } ol, ul { list-style: none; } li { display: block; } /* ------------------------------------------------------------------- * ## links * ------------------------------------------------------------------- */ a { text-decoration: none; line-height: inherit; } a img { border: none; } /* ------------------------------------------------------------------- * ## inputs * ------------------------------------------------------------------- */ fieldset { margin: 0; padding: 0; } input[type="email"], input[type="number"], input[type="search"], input[type="text"], input[type="tel"], input[type="url"], input[type="password"], textarea { -webkit-appearance: none; -moz-appearance: none; appearance: none; } /* =================================================================== * # Grid v2.1.3 * * ----------------------------------------------------------------- * - Grid breakpoints are based on MAXIMUM WIDTH media queries, * meaning they apply to that one breakpoint and ALL THOSE BELOW IT. * - Grid columns without a specified width will automatically layout * as equal width columns. * ------------------------------------------------------------------- */ /* rows * ------------------------------------- */ .row { width: 92%; max-width: 1040px; margin: 0 auto; display: -ms-flexbox; display: -webkit-box; display: flex; -ms-flex-flow: row wrap; -webkit-box-orient: horizontal; -webkit-box-direction: normal; flex-flow: row wrap; } .row .row { width: auto; max-width: none; margin-left: -20px; margin-right: -20px; } /* columns * -------------------------------------- */ .column { -ms-flex: 1 1 0%; -webkit-box-flex: 1; flex: 1 1 0%; padding: 0 20px; } .collapse>.column, .column.collapse { padding: 0; } /* flex row containers utility classes * ----------------------------------------- */ .row.row-wrap { -ms-flex-wrap: wrap; flex-wrap: wrap; } .row.row-nowrap { -ms-flex-wrap: none; flex-wrap: nowrap; } .row.row-y-top { -ms-flex-align: start; -webkit-box-align: start; align-items: flex-start; } .row.row-y-bottom { -ms-flex-align: end; -webkit-box-align: end; align-items: flex-end; } .row.row-y-center { -ms-flex-align: center; -webkit-box-align: center; align-items: center; } .row.row-stretch { -ms-flex-align: stretch; -webkit-box-align: stretch; align-items: stretch; } .row.row-baseline { -ms-flex-align: baseline; -webkit-box-align: baseline; align-items: baseline; } .row.row-x-left { -ms-flex-pack: start; -webkit-box-pack: start; justify-content: flex-start; } .row.row-x-right { -ms-flex-pack: end; -webkit-box-pack: end; justify-content: flex-end; } .row.row-x-center { -ms-flex-pack: center; -webkit-box-pack: center; justify-content: center; } /* flex item utility alignment classes * ----------------------------------------- */ .align-center { margin: auto; -webkit-align-self: center; -ms-flex-item-align: center; -ms-grid-row-align: center; align-self: center; } .align-left { margin-right: auto; -webkit-align-self: center; -ms-flex-item-align: center; -ms-grid-row-align: center; align-self: center; } .align-right { margin-left: auto; -webkit-align-self: center; -ms-flex-item-align: center; -ms-grid-row-align: center; align-self: center; } .align-x-center { margin-right: auto; margin-left: auto; } .align-x-left { margin-right: auto; } .align-x-right { margin-left: auto; } .align-y-center { -webkit-align-self: center; -ms-flex-item-align: center; -ms-grid-row-align: center; align-self: center; } .align-y-top { -webkit-align-self: flex-start; -ms-flex-item-align: start; align-self: flex-start; } .align-y-bottom { -webkit-align-self: flex-end; -ms-flex-item-align: end; align-self: flex-end; } /* large screen column widths * -------------------------------------- */ .large-1 { -ms-flex: 0 0 8.33333%; -webkit-box-flex: 0; flex: 0 0 8.33333%; max-width: 8.33333%; } .large-2 { -ms-flex: 0 0 16.66667%; -webkit-box-flex: 0; flex: 0 0 16.66667%; max-width: 16.66667%; } .large-3 { -ms-flex: 0 0 25%; -webkit-box-flex: 0; flex: 0 0 25%; max-width: 25%; } .large-4 { -ms-flex: 0 0 33.33333%; -webkit-box-flex: 0; flex: 0 0 33.33333%; max-width: 33.33333%; } .large-5 { -ms-flex: 0 0 41.66667%; -webkit-box-flex: 0; flex: 0 0 41.66667%; max-width: 41.66667%; } .large-6, .large-half { -ms-flex: 0 0 50%; -webkit-box-flex: 0; flex: 0 0 50%; max-width: 50%; } .large-7 { -ms-flex: 0 0 58.33333%; -webkit-box-flex: 0; flex: 0 0 58.33333%; max-width: 58.33333%; } .large-8 { -ms-flex: 0 0 66.66667%; -webkit-box-flex: 0; flex: 0 0 66.66667%; max-width: 66.66667%; } .large-9 { -ms-flex: 0 0 75%; -webkit-box-flex: 0; flex: 0 0 75%; max-width: 75%; } .large-10 { -ms-flex: 0 0 83.33333%; -webkit-box-flex: 0; flex: 0 0 83.33333%; max-width: 83.33333%; } .large-11 { -ms-flex: 0 0 91.66667%; -webkit-box-flex: 0; flex: 0 0 91.66667%; max-width: 91.66667%; } .large-12, .large-full { -ms-flex: 0 0 100%; -webkit-box-flex: 0; flex: 0 0 100%; max-width: 100%; } /* ------------------------------------------------------------------- * ## medium screen devices * ------------------------------------------------------------------- */ @media screen and (max-width:1200px) { .row .row { margin-left: -16px; margin-right: -16px; } .column { padding: 0 16px; } .medium-1 { -ms-flex: 0 0 8.33333%; -webkit-box-flex: 0; flex: 0 0 8.33333%; max-width: 8.33333%; } .medium-2 { -ms-flex: 0 0 16.66667%; -webkit-box-flex: 0; flex: 0 0 16.66667%; max-width: 16.66667%; } .medium-3 { -ms-flex: 0 0 25%; -webkit-box-flex: 0; flex: 0 0 25%; max-width: 25%; } .medium-4 { -ms-flex: 0 0 33.33333%; -webkit-box-flex: 0; flex: 0 0 33.33333%; max-width: 33.33333%; } .medium-5 { -ms-flex: 0 0 41.66667%; -webkit-box-flex: 0; flex: 0 0 41.66667%; max-width: 41.66667%; } .medium-6, .medium-half { -ms-flex: 0 0 50%; -webkit-box-flex: 0; flex: 0 0 50%; max-width: 50%; } .medium-7 { -ms-flex: 0 0 58.33333%; -webkit-box-flex: 0; flex: 0 0 58.33333%; max-width: 58.33333%; } .medium-8 { -ms-flex: 0 0 66.66667%; -webkit-box-flex: 0; flex: 0 0 66.66667%; max-width: 66.66667%; } .medium-9 { -ms-flex: 0 0 75%; -webkit-box-flex: 0; flex: 0 0 75%; max-width: 75%; } .medium-10 { -ms-flex: 0 0 83.33333%; -webkit-box-flex: 0; flex: 0 0 83.33333%; max-width: 83.33333%; } .medium-11 { -ms-flex: 0 0 91.66667%; -webkit-box-flex: 0; flex: 0 0 91.66667%; max-width: 91.66667%; } .medium-12, .medium-full { -ms-flex: 0 0 100%; -webkit-box-flex: 0; flex: 0 0 100%; max-width: 100%; } } /* ------------------------------------------------------------------- * ## tablets * ------------------------------------------------------------------- */ @media screen and (max-width:800px) { .tab-1 { -ms-flex: 0 0 8.33333%; -webkit-box-flex: 0; flex: 0 0 8.33333%; max-width: 8.33333%; } .tab-2 { -ms-flex: 0 0 16.66667%; -webkit-box-flex: 0; flex: 0 0 16.66667%; max-width: 16.66667%; } .tab-3 { -ms-flex: 0 0 25%; -webkit-box-flex: 0; flex: 0 0 25%; max-width: 25%; } .tab-4 { -ms-flex: 0 0 33.33333%; -webkit-box-flex: 0; flex: 0 0 33.33333%; max-width: 33.33333%; } .tab-5 { -ms-flex: 0 0 41.66667%; -webkit-box-flex: 0; flex: 0 0 41.66667%; max-width: 41.66667%; } .tab-6, .tab-half { -ms-flex: 0 0 50%; -webkit-box-flex: 0; flex: 0 0 50%; max-width: 50%; } .tab-7 { -ms-flex: 0 0 58.33333%; -webkit-box-flex: 0; flex: 0 0 58.33333%; max-width: 58.33333%; } .tab-8 { -ms-flex: 0 0 66.66667%; -webkit-box-flex: 0; flex: 0 0 66.66667%; max-width: 66.66667%; } .tab-9 { -ms-flex: 0 0 75%; -webkit-box-flex: 0; flex: 0 0 75%; max-width: 75%; } .tab-10 { -ms-flex: 0 0 83.33333%; -webkit-box-flex: 0; flex: 0 0 83.33333%; max-width: 83.33333%; } .tab-11 { -ms-flex: 0 0 91.66667%; -webkit-box-flex: 0; flex: 0 0 91.66667%; max-width: 91.66667%; } .tab-12, .tab-full { -ms-flex: 0 0 100%; -webkit-box-flex: 0; flex: 0 0 100%; max-width: 100%; } .hide-on-tablet { display: none; } } /* ------------------------------------------------------------------- * ## mobile devices * ------------------------------------------------------------------- */ @media screen and (max-width:600px) { .row { width: 100%; padding-left: 24px; padding-right: 24px; } .row .row { margin-left: -10px; margin-right: -10px; padding-left: 0; padding-right: 0; } .column { padding: 0 10px; } .mob-1 { -ms-flex: 0 0 8.33333%; -webkit-box-flex: 0; flex: 0 0 8.33333%; max-width: 8.33333%; } .mob-2 { -ms-flex: 0 0 16.66667%; -webkit-box-flex: 0; flex: 0 0 16.66667%; max-width: 16.66667%; } .mob-3 { -ms-flex: 0 0 25%; -webkit-box-flex: 0; flex: 0 0 25%; max-width: 25%; } .mob-4 { -ms-flex: 0 0 33.33333%; -webkit-box-flex: 0; flex: 0 0 33.33333%; max-width: 33.33333%; } .mob-5 { -ms-flex: 0 0 41.66667%; -webkit-box-flex: 0; flex: 0 0 41.66667%; max-width: 41.66667%; } .mob-6, .mob-half { -ms-flex: 0 0 50%; -webkit-box-flex: 0; flex: 0 0 50%; max-width: 50%; } .mob-7 { -ms-flex: 0 0 58.33333%; -webkit-box-flex: 0; flex: 0 0 58.33333%; max-width: 58.33333%; } .mob-8 { -ms-flex: 0 0 66.66667%; -webkit-box-flex: 0; flex: 0 0 66.66667%; max-width: 66.66667%; } .mob-9 { -ms-flex: 0 0 75%; -webkit-box-flex: 0; flex: 0 0 75%; max-width: 75%; } .mob-10 { -ms-flex: 0 0 83.33333%; -webkit-box-flex: 0; flex: 0 0 83.33333%; max-width: 83.33333%; } .mob-11 { -ms-flex: 0 0 91.66667%; -webkit-box-flex: 0; flex: 0 0 91.66667%; max-width: 91.66667%; } .mob-12, .mob-full { -ms-flex: 0 0 100%; -webkit-box-flex: 0; flex: 0 0 100%; max-width: 100%; } .hide-on-mobile { display: none; } } /* ------------------------------------------------------------------- * ## small mobile devices <= 400px * ------------------------------------------------------------------- */ @media screen and (max-width:400px) { .row { padding-left: 6vw; padding-right: 6vw; } .row .row { margin-left: 0; margin-right: 0; } .column { -ms-flex: 0 0 100%; -webkit-box-flex: 0; flex: 0 0 100%; max-width: 100%; width: 100%; margin-left: 0; margin-right: 0; padding: 0; } } /* =================================================================== * # block grids * * ------------------------------------------------------------------- * Equally-sized columns define at parent/row level. * ------------------------------------------------------------------- */ .block-large-1-8>.column { -ms-flex: 0 0 12.5%; -webkit-box-flex: 0; flex: 0 0 12.5%; max-width: 12.5%; } .block-large-1-6>.column { -ms-flex: 0 0 16.66667%; -webkit-box-flex: 0; flex: 0 0 16.66667%; max-width: 16.66667%; } .block-large-1-5>.column { -ms-flex: 0 0 20%; -webkit-box-flex: 0; flex: 0 0 20%; max-width: 20%; } .block-large-1-4>.column { -ms-flex: 0 0 25%; -webkit-box-flex: 0; flex: 0 0 25%; max-width: 25%; } .block-large-1-3>.column { -ms-flex: 0 0 33.33333%; -webkit-box-flex: 0; flex: 0 0 33.33333%; max-width: 33.33333%; } .block-large-1-2>.column { -ms-flex: 0 0 50%; -webkit-box-flex: 0; flex: 0 0 50%; max-width: 50%; } .block-large-full>.column { -ms-flex: 0 0 100%; -webkit-box-flex: 0; flex: 0 0 100%; max-width: 100%; } /* ------------------------------------------------------------------- * ## block grids - medium screen devices * ------------------------------------------------------------------- */ @media screen and (max-width:1200px) { .block-medium-1-8>.column { -ms-flex: 0 0 12.5%; -webkit-box-flex: 0; flex: 0 0 12.5%; max-width: 12.5%; } .block-medium-1-6>.column { -ms-flex: 0 0 16.66667%; -webkit-box-flex: 0; flex: 0 0 16.66667%; max-width: 16.66667%; } .block-medium-1-5>.column { -ms-flex: 0 0 20%; -webkit-box-flex: 0; flex: 0 0 20%; max-width: 20%; } .block-medium-1-4>.column { -ms-flex: 0 0 25%; -webkit-box-flex: 0; flex: 0 0 25%; max-width: 25%; } .block-medium-1-3>.column { -ms-flex: 0 0 33.33333%; -webkit-box-flex: 0; flex: 0 0 33.33333%; max-width: 33.33333%; } .block-medium-1-2>.column { -ms-flex: 0 0 50%; -webkit-box-flex: 0; flex: 0 0 50%; max-width: 50%; } .block-medium-full>.column { -ms-flex: 0 0 100%; -webkit-box-flex: 0; flex: 0 0 100%; max-width: 100%; } } /* ------------------------------------------------------------------- * ## block grids - tablets * ------------------------------------------------------------------- */ @media screen and (max-width:800px) { .block-tab-1-8>.column { -ms-flex: 0 0 12.5%; -webkit-box-flex: 0; flex: 0 0 12.5%; max-width: 12.5%; } .block-tab-1-6>.column { -ms-flex: 0 0 16.66667%; -webkit-box-flex: 0; flex: 0 0 16.66667%; max-width: 16.66667%; } .block-tab-1-5>.column { -ms-flex: 0 0 20%; -webkit-box-flex: 0; flex: 0 0 20%; max-width: 20%; } .block-tab-1-4>.column { -ms-flex: 0 0 25%; -webkit-box-flex: 0; flex: 0 0 25%; max-width: 25%; } .block-tab-1-3>.column { -ms-flex: 0 0 33.33333%; -webkit-box-flex: 0; flex: 0 0 33.33333%; max-width: 33.33333%; } .block-tab-1-2>.column { -ms-flex: 0 0 50%; -webkit-box-flex: 0; flex: 0 0 50%; max-width: 50%; } .block-tab-full>.column { -ms-flex: 0 0 100%; -webkit-box-flex: 0; flex: 0 0 100%; max-width: 100%; } } /* ------------------------------------------------------------------- * ## block grids - mobile devices * ------------------------------------------------------------------- */ @media screen and (max-width:600px) { .block-mob-1-8>.column { -ms-flex: 0 0 12.5%; -webkit-box-flex: 0; flex: 0 0 12.5%; max-width: 12.5%; } .block-mob-1-6>.column { -ms-flex: 0 0 16.66667%; -webkit-box-flex: 0; flex: 0 0 16.66667%; max-width: 16.66667%; } .block-mob-1-5>.column { -ms-flex: 0 0 20%; -webkit-box-flex: 0; flex: 0 0 20%; max-width: 20%; } .block-mob-1-4>.column { -ms-flex: 0 0 25%; -webkit-box-flex: 0; flex: 0 0 25%; max-width: 25%; } .block-mob-1-3>.column { -ms-flex: 0 0 33.33333%; -webkit-box-flex: 0; flex: 0 0 33.33333%; max-width: 33.33333%; } .block-mob-1-2>.column { -ms-flex: 0 0 50%; -webkit-box-flex: 0; flex: 0 0 50%; max-width: 50%; } .block-mob-full>.column { -ms-flex: 0 0 100%; -webkit-box-flex: 0; flex: 0 0 100%; max-width: 100%; } } /* ------------------------------------------------------------------- * ## block grids - small mobile devices <= 400px * ------------------------------------------------------------------- */ @media screen and (max-width:400px) { .stack>.column { -ms-flex: 0 0 100%; -webkit-box-flex: 0; flex: 0 0 100%; max-width: 100%; width: 100%; margin-left: 0; margin-right: 0; padding: 0; } } /* =================================================================== * # MISC * * ------------------------------------------------------------------- */ .h-group:after { content: ""; display: table; clear: both; } /* misc helper classes * -------------------------------------- */ .is-hidden { display: none; } .is-invisible { visibility: hidden; } .h-antialiased { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .h-overflow-hidden { overflow: hidden; } .h-remove-top { margin-top: 0; } .h-remove-bottom { margin-bottom: 0; } .h-add-half-bottom { margin-bottom: 1.6rem !important; } .h-add-bottom { margin-bottom: 3.2rem !important; } .h-no-border { border: none; } .h-full-width { width: 100%; } .h-text-center { text-align: center; } .h-text-left { text-align: left; } .h-text-right { text-align: right; } .h-pull-left { float: left; } .h-pull-right { float: right; }