/* base.css v0.9
========================================================================== */
/**
* 1. Set default font family to sans-serif.
* 2. Prevent iOS text size adjust after orientation change, without disabling
* user zoom.
*/
html {
font-family: sans-serif; /* 1 */
-ms-text-size-adjust: 100%; /* 2 */
-webkit-text-size-adjust: 100%; /* 2 */
}
/**
* Remove default margin.
*/
body {
margin: 0;
}
/* HTML5 display definitions
========================================================================== */
/**
* Correct `block` display not defined for any HTML5 element in IE 8/9.
* Correct `block` display not defined for `details` or `summary` in IE 10/11 and Firefox.
* Correct `block` display not defined for `main` in IE 11.
*/
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
display: block;
}
/**
* 1. Correct `inline-block` display not defined in IE 8/9.
* 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
*/
audio,
canvas,
progress,
video {
display: inline-block; /* 1 */
vertical-align: baseline; /* 2 */
}
/**
* Prevent modern browsers from displaying `audio` without controls.
* Remove excess height in iOS 5 devices.
*/
audio:not([controls]) {
display: none;
height: 0;
}
/**
* Address `[hidden]` styling not present in IE 8/9/10.
* Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22.
*/
[hidden],
template {
display: none;
}
/* Links
========================================================================== */
/**
* Remove the gray background color from active links in IE 10.
*/
a {
background: transparent;
}
/**
* Improve readability when focused and also mouse hovered in all browsers.
*/
a:active,
a:hover {
outline: 0;
}
/* Text-level semantics
========================================================================== */
/**
* Address styling not present in IE 8/9/10/11, Safari, and Chrome.
*/
abbr[title] {
border-bottom: 1px dotted;
}
/**
* Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
*/
b,
strong {
font-weight: bold;
}
/**
* Address styling not present in Safari and Chrome.
*/
dfn {
font-style: italic;
}
/**
* Address variable `h1` font-size and margin within `section` and `article`
* contexts in Firefox 4+, Safari, and Chrome.
*/
h1 {
font-size: 2em;
margin: 0.67em 0;
}
h2.h1restyle {
font-size: 2em; /*margin:0.67em 0;*/
}
/**
* Address styling not present in IE 8/9.
*/
mark {
background: #ff0;
color: #000;
}
/**
* Address inconsistent and variable font size in all browsers.
*/
small {
font-size: 80%;
}
/**
* Prevent `sub` and `sup` affecting `line-height` in all browsers.
*/
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sup {
top: -0.5em;
}
sub {
bottom: -0.25em;
}
/* Embedded content
========================================================================== */
/**
* Remove border when inside `a` element in IE 8/9/10.
*/
img {
max-width: 100%;
border: 0;
}
/**
* Correct overflow not hidden in IE 9/10/11.
*/
svg:not(:root) {
overflow: hidden;
}
/* Grouping content
========================================================================== */
/**
* Address margin not present in IE 8/9 and Safari.
*/
figure {
margin: 1em 40px;
}
/**
* Address differences between Firefox and other browsers.
*/
hr {
-moz-box-sizing: content-box;
box-sizing: content-box;
height: 0;
}
/**
* Contain overflow in all browsers.
*/
pre {
overflow: auto;
}
/**
* Address odd `em`-unit font size rendering in all browsers.
*/
code,
kbd,
pre,
samp {
font-family: monospace, monospace;
font-size: 1em;
}
/* Forms
========================================================================== */
/**
* Known limitation:by default, Chrome and Safari on OS X allow very limited
* styling of `select`, unless a `border` property is set.
*/
/**
* 1. Correct color not being inherited.
* Known issue:affects color of disabled elements.
* 2. Correct font properties not being inherited.
* 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
*/
button,
input,
optgroup,
select,
textarea {
color: inherit; /* 1 */
font: inherit; /* 2 */
margin: 0; /* 3 */
}
/**
* Address `overflow` set to `hidden` in IE 8/9/10/11.
*/
button {
overflow: visible;
}
/**
* Address inconsistent `text-transform` inheritance for `button` and `select`.
* All other form control elements do not inherit `text-transform` values.
* Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
* Correct `select` style inheritance in Firefox.
*/
button,
select {
text-transform: none;
}
/**
* 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
* and `video` controls.
* 2. Correct inability to style clickable `input` types in iOS.
* 3. Improve usability and consistency of cursor style between image-type
* `input` and others.
*/
button,
html input[type="button"], /* 1 */
input[type="reset"],
input[type="submit"] {
-webkit-appearance: button; /* 2 */
cursor: pointer; /* 3 */
}
/* Range input styles for slider
========================================================================== */
input[type=range] {
/*removes default webkit styles*/
-webkit-appearance: none;
/*fix for FF unable to apply focus style bug */
border: 1px solid #f2f2f2;
background: #f2f2f2;
padding: 0;
}
input[type=range]::-webkit-slider-runnable-track {
height: 2px;
background: #cacaca;
border: none;
border-radius: 2px;
margin: 24px 0 20px 0;
}
input[type=range]::-webkit-slider-thumb {
-webkit-appearance: none;
border: none;
height: 28px;
width: 28px;
border-radius: 50%;
background: #0079c1;
margin-top: -14px;
}
input[type=range]:focus {
outline: none;
}
input[type=range]:focus::-webkit-slider-runnable-track {
background: #ccc;
}
input[type=range]::-moz-range-track {
height: 5px;
background: #cacaca;
border: none;
border-radius: 2px;
}
input[type=range]::-moz-range-thumb {
border: none;
height: 28px;
width: 28px;
border-radius: 50%;
background: #0079c1;
}
/*hide the outline behind the border*/
input[type=range]:-moz-focusring {
outline: 2px solid #f2f2f2;
outline-offset: -1px;
}
input[type=range]::-ms-track {
height: 2px;
/*remove bg colour from the track, we'll use ms-fill-lower and ms-fill-upper instead */
background: transparent;
/*leave room for the larger thumb to overflow with a transparent border */
border-color: transparent;
border-width: 20px 0;
/*remove default tick marks*/
color: transparent;
}
input[type=range]::-ms-fill-lower {
background: #777;
border-radius: 2px;
}
input[type=range]::-ms-fill-upper {
background: #ddd;
border-radius: 2px;
}
input[type=range]::-ms-thumb {
border: none;
height: 28px;
width: 28px;
border-radius: 50%;
background: #0079c1;
}
input[type=range]:focus::-ms-fill-lower {
background: #888;
}
input[type=range]:focus::-ms-fill-upper {
background: #cacaca;
}
/**
* Re-set default cursor for disabled elements.
*/
button[disabled],
html input[disabled] {
cursor: default;
}
/**
* Remove inner padding and border in Firefox 4+.
*/
button::-moz-focus-inner,
input::-moz-focus-inner {
border: 0;
padding: 0;
}
/**
* Address Firefox 4+ setting `line-height` on `input` using `!important` in
* the UA stylesheet.
*/
input {
line-height: normal;
}
/**
* It's recommended that you don't attempt to style these elements.
* Firefox's implementation doesn't respect box-sizing, padding, or width.
*
* 1. Address box sizing set to `content-box` in IE 8/9/10.
* 2. Remove excess padding in IE 8/9/10.
*/
input[type="checkbox"],
input[type="radio"] {
box-sizing: border-box; /* 1 */
padding: 0; /* 2 */
}
/**
* Fix the cursor style for Chrome's increment/decrement buttons. For certain
* `font-size` values of the `input`, it causes the cursor style of the
* decrement button to change from `default` to `text`.
*/
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
height: auto;
}
/**
* 1. Address `appearance` set to `searchfield` in Safari and Chrome.
* 2. Address `box-sizing` set to `border-box` in Safari and Chrome
* (include `-moz` to future-proof).
*/
input[type="search"] {
-webkit-appearance: textfield; /* 1 */
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box; /* 2 */
box-sizing: content-box;
}
/**
* Remove inner padding and search cancel button in Safari and Chrome on OS X.
* Safari (but not Chrome) clips the cancel button when the search input has
* padding (and `textfield` appearance).
*/
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}
/**
* Define consistent border, margin, and padding.
*/
fieldset {
border: 1px solid #c0c0c0;
margin: 0 2px;
padding: 0.35em 0.625em 0.75em;
}
/**
* 1. Correct `color` not being inherited in IE 8/9/10/11.
* 2. Remove padding so people aren't caught out if they zero out fieldsets.
*/
legend {
border: 0; /* 1 */
padding: 0; /* 2 */
}
/**
* Remove default vertical scrollbar in IE 8/9/10/11.
*/
textarea {
overflow: auto;
}
/**
* Don't inherit the `font-weight` (applied by a rule above).
* NOTE:the default cannot safely be changed in Chrome and Safari on OS X.
*/
optgroup {
font-weight: bold;
}
/* Tables
========================================================================== */
/**
* Remove most spacing between table cells.
*/
table {
border-collapse: collapse;
border-spacing: 0;
}
td,
th {
padding: 0;
}
/* Fonts
========================================================================== */
@font-face {
font-family: "dax";
src: url("/fonts/dax.eot");
src: url("/fonts/dax.eot?#iefix") format("embedded-opentype"), url("/fonts/dax.woff") format("woff"), url("/fonts/dax.ttf") format("truetype"), url("/fonts/dax.svg#daxregular") format("svg");
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: "dax-bold";
src: url("/fonts/dax-bold.eot");
src: url("/fonts/dax-bold.eot?#iefix") format("embedded-opentype"), url("/fonts/dax-bold.woff") format("woff"), url("/fonts/dax-bold.ttf") format("truetype"), url("/fonts/dax-bold.svg#daxbold") format("svg");
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: "dax-italic";
src: url("/fonts/dax-italic.eot");
src: url("/fonts/dax-italic.eot?#iefix") format("embedded-opentype"), url("/fonts/dax-italic.woff") format("woff"), url("/fonts/dax-italic.ttf") format("truetype"), url("/fonts/dax-italic.svg#daxitalic") format("svg");
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: "dax-bold-italic";
src: url("/fonts/dax-bold-italic.eot");
src: url("/fonts/dax-bold-italic.eot?#iefix") format("embedded-opentype"), url("/fonts/dax-bold-italic.woff") format("woff"), url("/fonts/dax-bold-italic.ttf") format("truetype"), url("/fonts/dax-bold-italic.svg#daxbold_italic") format("svg");
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: "dax-light";
src: url("/fonts/dax-light.eot");
src: url("/fonts/dax-light.eot?#iefix") format("embedded-opentype"), url("/fonts/dax-light.woff") format("woff"), url("/fonts/dax-light.ttf") format("truetype"), url("/fonts/dax-light.svg#dax_lightregular") format("svg");
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: "dax-light-italic";
src: url("/fonts/dax-light-italic.eot");
src: url("/fonts/dax-light-italic.eot?#iefix") format("embedded-opentype"), url("/fonts/dax-light-italic.woff") format("woff"), url("/fonts/dax-light-italic.ttf") format("truetype"), url("/fonts/dax-light-italic.svg#dax_lightitalic") format("svg");
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: "dax-medium";
src: url("/fonts/dax-medium.eot");
src: url("/fonts/dax-medium.eot?#iefix") format("embedded-opentype"), url("/fonts/dax-medium.woff") format("woff"), url("/fonts/dax-medium.ttf") format("truetype"), url("/fonts/dax-medium.svg#daxmedium") format("svg");
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: "dax-medium-italic";
src: url("/fonts/dax-medium-italic.eot");
src: url("/fonts/dax-medium-italic.eot?#iefix") format("embedded-opentype"), url("/fonts/dax-medium-italic.woff") format("woff"), url("/fonts/dax-medium-italic.ttf") format("truetype"), url("/fonts/dax-medium-italic.svg#daxmedium_italic") format("svg");
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'heebo-light';
font-style: normal;
font-weight: 300;
src: local('Heebo Light'), local('Heebo-Light'), url(https://fonts.gstatic.com/s/heebo/v2/PBgOuZgb7GIoq5WdJf9cYPesZW2xOQ-xsNqO47m55DA.woff2) format('woff2'), url(/fonts/heebo-300.woff) format('woff');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}
@font-face {
font-family: 'heebo';
font-style: normal;
font-weight: 400;
src: local('Heebo'), local('Heebo-Regular'), url(https://fonts.gstatic.com/s/heebo/v2/Q66imbW5v9YuQMRLd0RXOA.woff2) format('woff2'), url(/fonts/heebo-400.woff) format('woff');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}
@font-face {
font-family: 'heebo-medium';
font-style: normal;
font-weight: 500;
src: local('Heebo Medium'), local('Heebo-Medium'), url(https://fonts.gstatic.com/s/heebo/v2/vd_gpifGyUkVAMtANh8LkvesZW2xOQ-xsNqO47m55DA.woff2) format('woff2'), url(/fonts/heebo-500.woff) format('woff');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}
@font-face {
font-family: 'heebo-bold';
font-style: normal;
font-weight: 700;
src: local('Heebo Bold'), local('Heebo-Bold'), url(https://fonts.gstatic.com/s/heebo/v2/ci1Z5c9lWkHY3RNZSMtWUfesZW2xOQ-xsNqO47m55DA.woff2) format('woff2'), url(/fonts/heebo-700.woff) format('woff');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}
/* Tag defaults
========================================================================== */
/**
* html
*/
html {
background-color: #0079c1;
}
/**
* body
*/
body {
color: #414141;
font-size: 15px;
font-family: "heebo", Arial, Sans-Serif;
}
/**
* main
*/
main {
max-width: 1200px;
min-width: 320px;
margin: 0 auto;
padding: 0 0 45px;
}
@media (max-width:767px) {
main {
padding: 0 0 30px;
}
}
/**
* page
*/
#page {
width: 100%;
background-color: #ffffff;
}
/**
* popup
*/
#popup {
width: 100%;
background-color: #ffffff;
}
#popup main {
padding: 30px 0;
}
/**
* section
*/
section {
padding: 0 45px;
}
@media (max-width:767px) {
section {
padding: 0 30px;
}
}
section.flush {
padding: 0;
}
section.flush.top {
padding-top: 0;
}
section.flush.right {
padding-right: 0;
}
section.flush.bottom {
padding-bottom: 0;
}
section.flush.left {
padding-left: 0;
}
section section {
padding: 0;
}
/**
* horizontal rule
*/
hr {
height: 1px;
margin: 45px 0;
border: 0;
background-color: #cacaca;
}
hr.no-line {
height: 45px;
margin: 0;
background-color: transparent;
border: 0;
}
hr.flush {
margin: 0;
}
hr.flush.top {
margin: 0 0 45px;
}
hr.flush.bottom {
margin: 45px 0 0;
}
hr.flush.top.bottom {
margin: 0;
}
@media (max-width:767px) {
hr {
margin: 30px;
}
hr.flush {
margin: 0;
}
hr.flush.top {
margin: 0 0 30px;
}
hr.flush.bottom {
margin: 30px 0 0;
}
hr.flush.top.bottom {
margin: 0;
}
hr.no-line {
height: 30px;
}
}
/**
* headers
*/
h1,
h2,
h3,
h4,
h5,
h6 {
margin: -.15em 0;
line-height: 1.3em;
font-weight: normal;
}
h1 {
font-family: "dax-light";
font-size: 2.533em;
}
h2 {
font-family: "dax-light";
font-size: 1.733em;
}
h2.h1restyle {
font-family: "dax-light";
font-size: 2.533em;
}
h3 {
font-family: "dax-medium";
font-size: 1.333em;
}
h4 {
font-family: "dax-bold";
font-size: 1.133em;
}
h5 {
font-family: "dax-bold";
font-size: 1em;
}
h6 {
font-family: "dax";
font-size: 1em;
}
h1 sup,
h1 sub,
h2 sup,
h2 sub,
h3 sup,
h3 sub,
h4 sup,
h4 sub,
h5 sup,
h5 sub,
h6 sup,
h6 sub {
font-family: "dax-light";
}
/**
* links
*/
a {
color: #0079c1;
line-height: 1.3em;
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
a:focus {
outline: 1px dotted #0079c1;
text-decoration: underline;
}
a:active {
text-decoration: underline;
}
a.active {
text-decoration: none;
}
a.disabled {
color: inherit;
cursor: default;
}
a.disabled:hover,
a.disabled:focus,
a.disabled:active {
text-decoration: none;
}
a.disabled:focus {
outline: 1px dotted #414141;
}
@media (min-width:768px) {
a[href^="tel"] {
color: inherit;
cursor: default;
}
a[href^="tel"]:hover,
a[href^="tel"]:focus,
a[href^="tel"]:active {
text-decoration: none;
}
a[href^="tel"]:focus {
outline: 1px dotted #414141;
}
}
/**
* paragraph
*/
p {
margin: -.15em 0;
line-height: 1.3em;
}
@media (max-width:767px) {
p {
font-size: 1.066em;
}
}
/**
* strong
*/
strong {
display: block;
margin: -.15em 0;
line-height: 1.3em;
font-family: "dax-bold";
font-size: 1.133em;
font-weight: normal;
}
/**
* em
*/
em {
display: block;
margin: -.15em 0;
line-height: 1.3em;
font-family: "dax";
font-size: .866em;
font-style: normal;
}
/**
* lists
*/
ol {
list-style: decimal;
}
ul {
list-style: disc;
}
li {
list-style: inherit;
}
ul,
ol {
margin: -.15em 0;
padding: 0 0 0 3em;
}
ul > li,
ol > li {
line-height: 1.3em;
}
ul.double-spaced > li,
ol.double-spaced > li {
margin: .9em 0 0;
}
ul.double-spaced > li:first-child,
ol.double-spaced > li:first-child {
margin: 0;
}
ul.flush,
ol.flush {
padding: 0;
list-style: none;
}
ul.row {
padding: 0;
list-style: none;
text-align: center;
}
ul.row > li {
display: inline-block;
margin: 0 0 0 30px;
}
ul.row > li:first-child {
margin: 0;
}
@media (max-width:767px) {
ul,
ol {
padding: 0 0 0 1.3em;
}
ul.flush,
ol.flush {
padding: 0;
}
ul.row {
padding: 0;
text-align: left;
}
ul.row.centered,
ul.row.centered-mobile {
text-align: center;
}
ul.row > li {
display: block;
margin: .9em 0 0;
}
ul.row:first-child {
margin: 0;
}
}
/**
* superscript, subscript
*/
sub,
sup {
font-size: .7em;
line-height: 1em;
white-space: nowrap;
}
/**
* bold
*/
b {
font-family: "dax-bold";
font-weight: normal;
}
/**
* italic
*/
i {
font-family: "dax";
font-style: normal;
}
/**
* u
*/
u {
text-decoration: underline;
}
/**
* s
*/
s {
text-decoration: line-through;
}
/**
* abbr
*/
abbr {
border-bottom: 1px dotted #cacaca;
}
sub abbr,
sup abbr {
border-bottom: 0;
}
/**
* mark
*/
mark {
background-color: #f2f2f2;
}
/**
* q
*/
q:before {
content: "“";
}
q:after {
content: "â€";
}
html[lang="fr"] q:before {
content: "«";
}
html[lang="fr"] q:after {
content: "»";
}
/**
* small
*/
big {
font-size: 1.133em;
}
/**
* small
*/
small {
font-size: .866em;
}
/**
* var
*/
var {
font-style: normal;
}
/**
* table
*/
table {
width: 100%;
}
table thead th {
padding: 0 5px 5px;
border-bottom: 1px solid #414141;
line-height: 1.3em;
font-weight: normal;
text-align: left;
}
table tbody th,
table tbody td {
padding: 5px;
border-bottom: 1px solid #cacaca;
line-height: 1.3em;
font-weight: normal;
text-align: left;
}
table tfoot td {
padding: 5px 5px 0;
font-size: .866em;
text-align: left;
}
@media (max-width:767px) {
table thead th {
padding: 0 7px 7px;
}
table tbody th,
table tbody td {
padding: 7px;
}
table tfoot td {
padding: 7px 7px 0;
}
}
table.centered thead th {
text-align: center;
}
table.NOpadding tbody th,
table.NOpadding tbody td {
padding: 0 0px 0px;
border-bottom: 0px solid #414141;
}
table.centered tbody th,
table.centered tbody td {
text-align: center;
}
table.centered thead th:first-child,
table.centered tbody th:first-child,
table.centered tbody td:first-child {
text-align: left;
}
/**'
.fill table tbody th,
.fill table tbody td:nth-child(odd) { background-color:#ffffff; }
.fill table tbody td:nth-child(even) { background-color:#f2f2f2; }
* input elements
*/
label {
display: block;
margin: -.15em 0;
line-height: 1.3em;
font-family: "dax-medium";
}
label input[type="text"],
label input[type="number"],
label input[type="email"],
label input[type="tel"],
label input[type="date"],
label input[type="password"],
label textarea,
label .select {
margin: 5px 0 0;
}
input[type="text"],
input[type="number"],
input[type="email"],
input[type="tel"],
input[type="date"],
input[type="password"],
textarea {
width: 100%;
padding: 7px 8px;
box-sizing: border-box;
border: 1px solid #cacaca;
border-radius: 3px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
background-color: #ffffff;
line-height: 1.2em;
}
input[type="text"]:focus,
input[type="date"]:focus,
input[type="password"]:focus,
textarea:focus {
border-color: #0079c1;
outline: 0;
}
input[type="text"]::-webkit-input-placeholder,
input[type="text"]:-moz-placeholder,
input[type="text"]::-moz-placeholder,
input[type="text"]:-ms-input-placeholder,
input[type="date"]::-webkit-input-placeholder,
input[type="date"]:-moz-placeholder,
input[type="date"]::-moz-placeholder,
input[type="date"]:-ms-input-placeholder,
input[type="password"]::-webkit-input-placeholder,
input[type="password"]:-moz-placeholder,
input[type="password"]::-moz-placeholder,
input[type="password"]:-ms-input-placeholder,
textarea::-webkit-input-placeholder,
textarea:-moz-placeholder,
textarea::-moz-placeholder,
textarea:-ms-input-placeholder {
color: #cacaca;
}
input[type="text"]:disabled,
input[type="date"]:disabled,
input[type="password"]:disabled,
textarea:disabled {
background-color: #f2f2f2;
color: #cacaca;
}
textarea {
resize: none;
}
/**
* select
*/
select {
width: 100%;
padding: 8px;
box-sizing: border-box;
border: 1px solid #cacaca;
border-radius: 3px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
background-color: #ffffff;
}
select:focus {
border-color: #0079c1;
outline: 0;
}
select:disabled {
background-color: #f2f2f2;
color: #cacaca;
}
.select {
display: inline-block;
position: relative;
width: 100%;
vertical-align: middle;
}
@supports (pointer-events:none) and ((-webkit-appearance:none) or
(-moz-appearance:none) or
(appearance:none)) {
.select:before {
position: absolute;
width: 2em;
top: 1px;
right: 1px;
bottom: 1px;
border-radius: 0 3px 3px 0;
-webkit-border-radius: 0 3px 3px 0;
-moz-border-radius: 0 3px 3px 0;
background-color: #ffffff;
pointer-events: none;
content: "";
}
.select:after {
position: absolute;
top: 50%;
right: .6em;
height: 1em;
margin: -.5em 0 0;
line-height: 1em;
font-family: "bmo-icon";
font-size: 1em;
content: "\e60d";
pointer-events: none;
}
.select.disabled:before {
background-color: #f2f2f2;
}
.select.disabled:after {
color: #cacaca;
}
}
/**
* checkbox
*/
input[type="checkbox"] {
position: absolute;
left: -999em;
}
input[type="checkbox"] + label {
display: inline-block;
position: relative;
padding: 0 0 0 26px;
cursor: pointer;
}
input[type="checkbox"] + label:before {
display: inline-block;
position: absolute;
top: 50%;
left: 0;
box-sizing: border-box;
width: 20px;
height: 20px;
margin: -10px 0 0;
border: 1px solid #cacaca;
border-radius: 2px;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
background-color: #ffffff;
line-height: 20px;
font-family: "bmo-icon";
font-size: 14px;
font-weight: bold;
text-align: center;
content: "";
}
input[type="checkbox"]:checked + label:before {
content: "\e60c";
}
input[type="checkbox"]:focus + label:before {
border-color: #0079c1;
}
input[type="checkbox"]:disabled + label {
cursor: default;
}
input[type="checkbox"]:disabled + label:before {
background-color: #f2f2f2;
color: #cacaca;
}
/**
* radio
*/
input[type="radio"] {
position: absolute;
left: -999em;
}
input[type="radio"] + label {
display: inline-block;
position: relative;
padding: 0 0 0 24px;
cursor: pointer;
}
input[type="radio"] + label:before {
display: inline-block;
position: absolute;
top: 50%;
left: 0;
box-sizing: border-box;
width: 20px;
height: 20px;
margin: -10px 0 0;
border: 1px solid #cacaca;
border-radius: 10px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
background-color: #ffffff;
content: "";
}
input[type="radio"] + label:after {
display: none;
position: absolute;
top: 50%;
left: 4px;
box-sizing: border-box;
width: 12px;
height: 12px;
margin: -6px 0 0;
border-radius: 10px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
background-color: #414141;
content: "";
}
input[type="radio"]:checked + label:after {
display: inline-block;
}
input[type="radio"]:focus + label:before {
border-color: #0079c1;
}
input[type="radio"]:disabled + label {
cursor: default;
}
input[type="radio"]:disabled + label:before {
background-color: #f2f2f2;
}
input[type="radio"]:disabled + label:after {
background-color: #cacaca;
}
/**
* font-weight fixes
*/
h1 b {
font-family: "dax-medium";
}
h1 i {
font-family: "dax-light";
}
h1 b i,
h1 i b {
font-family: "dax-medium";
}
h2 b {
font-family: "dax-medium";
}
h2 i {
font-family: "dax-light";
}
h2 b i,
h2 i b {
font-family: "dax-medium";
}
h3 b {
font-family: "dax-bold";
}
h3 i {
font-family: "dax-medium";
}
h3 i b,
h3 b i {
font-family: "dax-bold";
}
h4 i {
font-family: "dax-bold";
}
h5 i {
font-family: "dax-bold";
}
b i,
strong i {
font-family: "dax-bold";
}
i b,
em b {
font-family: "dax-bold";
}
label b {
font-family: "dax-bold";
}
label i {
font-family: "dax-medium";
}
label i b,
label b i {
font-family: "dax-bold";
}
/* Global classes
========================================================================== */
/**
* clear
*/
.clear:after {
display: table;
content: "";
clear: both;
}
/**
* block
*/
.block {
display: block;
}
/**
* Device hides
*/
@media (min-width:768px) {
.desktop-hide {
display: none !important;
}
}
@media (max-width:1080px) {
.tablet-hide {
display: none !important;
}
}
@media (max-width:767px) {
.mobile-hide {
display: none !important;
}
}
.screen-reader-only {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
outline: 0 !important;
border: 0;
overflow: hidden;
clip: rect(0,0,0,0);
}
/**
* break
*/
.break {
display: block;
height: 1.3em;
}
.break.half {
height: .65em;
}
/**
* stroke
*/
.stroke {
border: 2px solid #cacaca;
-webkit-border-radius: 11px;
-moz-border-radius: 11px;
border-radius: 11px;
margin: 0;
}
a.stroke {
display: block;
color: #414141;
}
a.stroke:hover, a.stroke:focus {
color: #414141;
outline: 0;
border-color: #0079c1;
text-decoration: none;
}
a.stroke:active, a.stroke.active {
border-color: #0079c1;
background-color: #0079c1;
color: #ffffff;
text-decoration: none;
}
a.stroke.active:focus {
outline: 1px dotted #0079c1;
}
@media (min-width:768px) {
a.stroke[href^="tel"]:hover,
a.stroke[href^="tel"]:active {
border-color: #cacaca;
}
a.stroke[href^="tel"]:focus {
border-color: #cacaca;
outline: 1px dotted #414141;
}
}
/**
* fill
*/
.fill {
background-color: #f2f2f2;
}
.fill.stroke {
border-color: #f2f2f2;
}
.fill.dark {
background-color: #3c3c3c;
color: #ffffff;
}
.fill.dark.stroke {
border-color: #3c3c3c;
}
.fill.dark a {
color: #ffffff;
}
.fill.dark a:focus {
outline-color: #ffffff;
}
.fill mark {
background-color: #3c3c3c;
color: #ffffff;
}
.fill.dark mark {
background-color: #f2f2f2;
color: #414141;
}
.unfill {
background-color: #ffffff;
}
.unfill.stroke {
border-color: #ffffff;
}
.fill.dark .unfill a {
color: #0079c1;
text-decoration: none;
}
.fill.dark .unfill a:focus {
outline-color: #0079c1;
}
.fill .unfill mark {
background-color: #f2f2f2;
}
.fill.dark .unfill mark {
background-color: #f2f2f2;
}
@media (min-width:768px) {
.fill.dark a[href^="tel"] {
text-decoration: none;
}
}
/**
* copy
*/
.copy {
padding: 30px;
text-align: left;
}
.copy.stroke {
padding: 28px;
}
@media (max-width:767px) {
.copy {
padding: 15px;
}
.copy.stroke {
padding: 13px;
}
}
.copy.flush.top {
padding-top: 0;
}
.copy.flush.right {
padding-right: 0;
}
.copy.flush.bottom {
padding-bottom: 0;
}
.copy.flush.left {
padding-left: 0;
}
/**
* centered
*/
.centered {
text-align: center;
}
@media (max-width:767px) {
.centered-mobile {
text-align: center;
}
}
@media all and (min-width: 768px) {
.centered-desktop {
text-align: center;
}
}
/**
* pointer
*/
.pointer {
position: relative;
margin: 0 0 38px;
}
.pointer:before {
display: block;
position: absolute;
bottom: -40px;
left: 50%;
width: 0;
margin: 0 -40px;
border-style: solid;
border-width: 40px 40px 0;
border-color: #cacaca transparent;
content: "";
}
.pointer:after {
display: block;
position: absolute;
bottom: -37px;
left: 50%;
width: 0;
margin: 0 -40px;
border-style: solid;
border-width: 40px 40px 0;
border-color: #ffffff transparent;
content: "";
}
.pointer.fill:before {
border-color: #f2f2f2 transparent;
}
.pointer.fill:after {
display: none;
}
.pointer.fill.dark:before {
border-color: #3c3c3c transparent;
}
.pointer.reverse {
margin: 38px 0 0;
}
.pointer.reverse:before {
top: -40px;
bottom: auto;
border-width: 0 40px 40px;
}
.pointer.reverse:after {
top: -37px;
bottom: auto;
border-width: 0 40px 40px;
}
@media (max-width:767px) {
.pointer {
margin: 0 0 23px;
}
.pointer:before {
bottom: -25px;
margin: 0 -25px;
border-width: 25px 25px 0;
}
.pointer:after {
bottom: -22px;
margin: 0 -25px;
border-width: 25px 25px 0;
}
.pointer.reverse {
margin: 23px 0 0;
}
.pointer.reverse:before {
top: -25px;
bottom: auto;
border-width: 0 25px 25px;
}
.pointer.reverse:after {
top: -22px;
bottom: auto;
border-width: 0 25px 25px;
}
}
a.pointer.stroke:hover:before, a.pointer.stroke:focus:before {
border-color: #0079c1 transparent;
}
a.pointer.stroke:active:before, a.pointer.stroke.active:before {
border-color: #0079c1 transparent;
}
a.pointer.stroke:active:after, a.pointer.stroke.active:after {
display: none;
}
/**
* circle
*/
.circle {
position: relative;
margin: 38px 0 0;
}
.circle:before {
display: block;
position: absolute;
top: -40px;
left: 50%;
width: 80px;
height: 40px;
margin: 0 -40px;
background-color: #cacaca;
border-radius: 40px 40px 0 0;
-webkit-border-radius: 40px 40px 0 0;
-moz-border-radius: 40px 40px 0 0;
content: "";
}
.circle:after {
display: block;
position: absolute;
top: -38px;
left: 50%;
width: 76px;
height: 39px;
margin: 0 -38px;
background-color: #ffffff;
border-radius: 38px 38px 0 0;
-webkit-border-radius: 38px 38px 0 0;
-moz-border-radius: 38px 38px 0 0;
content: "";
}
.circle.fill:before {
display: block;
position: absolute;
top: -40px;
left: 50%;
width: 80px;
height: 40px;
margin: 0 -40px;
background-color: #f2f2f2;
border-radius: 40px 40px 0 0;
-webkit-border-radius: 40px 40px 0 0;
-moz-border-radius: 40px 40px 0 0;
content: "";
}
.circle.fill:after {
display: none;
}
.circle.fill.dark:before {
background-color: #3c3c3c;
}
.circle.reverse {
margin: 0 0 38px;
}
.circle.reverse:before {
top: auto;
bottom: -40px;
border-radius: 0 0 40px 40px;
-webkit-border-radius: 0 0 40px 40px;
-moz-border-radius: 0 0 40px 40px;
}
.circle.reverse:after {
top: auto;
bottom: -38px;
border-radius: 0 0 40px 40px;
-webkit-border-radius: 0 0 40px 40px;
-moz-border-radius: 0 0 40px 40px;
}
@media (max-width:767px) {
.circle {
margin: 23px 0 0;
}
.circle:before {
top: -25px;
width: 50px;
height: 25px;
margin: 0 -25px;
border-radius: 25px 25px 0 0;
-webkit-border-radius: 25px 25px 0 0;
-moz-border-radius: 25px 25px 0 0;
}
.circle:after {
top: -23px;
width: 46px;
height: 24px;
margin: 0 -23px;
border-radius: 23px 23px 0 0;
-webkit-border-radius: 23px 23px 0 0;
-moz-border-radius: 23px 23px 0 0;
}
.circle.reverse {
margin: 0 0 25px;
}
.circle.reverse:before {
top: auto;
bottom: -25px;
border-radius: 0 0 25px 25px;
-webkit-border-radius: 0 0 25px 25px;
-moz-border-radius: 0 0 25px 25px;
}
.circle.reverse:after {
top: auto;
bottom: -23px;
border-radius: 0 0 25px 25px;
-webkit-border-radius: 0 0 25px 25px;
-moz-border-radius: 0 0 25px 25px;
}
}
a.circle.stroke:hover:before, a.circle.stroke:focus:before {
background-color: #0079c1;
}
a.circle.stroke:active:before, a.circle.stroke.active:before {
background-color: #0079c1;
}
a.circle.stroke:active:after, a.circle.stroke.active:after {
display: none;
}
/**
* pointer, circle combination
*/
.pointer.circle {
margin: 38px 0;
}
.pointer.circle.fill:before {
border-width: 0;
}
.pointer.circle.fill:after {
display: block;
position: absolute;
top: auto;
bottom: -40px;
left: 50%;
width: 0;
height: 0;
margin: 0 -40px;
border-style: solid;
border-width: 40px 40px 0;
border-color: #f2f2f2 transparent;
background-color: transparent;
border-radius: 0;
-webkit-border-radius: 0;
-moz-border-radius: 0;
content: "";
}
.pointer.circle.fill.dark:after {
border-color: #3c3c3c transparent;
}
.pointer.circle.reverse:after {
top: -40px;
bottom: auto;
border-width: 0 40px 40px;
}
@media (max-width:767px) {
.pointer.circle {
margin: 23px 0;
}
.pointer.circle.fill:after {
bottom: -25px;
margin: 0 -25px;
border-width: 25px 25px 0;
}
.pointer.circle.reverse:after {
top: -25px;
bottom: auto;
border-width: 0 25px 25px;
}
}
/**
* loader
*/
.loader {
min-width: 80px;
min-height: 80px;
background-image: url(/fonts/images/loaders/desktop.gif);
background-position: center center;
background-repeat: no-repeat;
}
.loader.fill,
.fill .loader {
background-image: url(/fonts/images/loaders/desktop-fill.gif);
}
.loader.fill.dark,
.fill.dark .loader {
background-image: url(/fonts/images/loaders/desktop-fill-dark.gif);
}
@media (max-width:767px) {
.loader {
min-width: 50px;
min-height: 50px;
background-image: url(/fonts/images/loaders/mobile.gif);
}
.loader.fill,
.fill .loader {
background-image: url(/fonts/images/loaders/mobile-fill.gif);
}
.loader.fill.dark,
.fill.dark .loader {
background-image: url(/fonts/images/loaders/mobile-fill-dark.gif);
}
}
/* Columns
========================================================================== */
.columns {
display: -webkit-flex;
display: flex;
-webkit-align-items: stretch;
align-items: stretch;
-webkit-align-content: stretch;
align-content: stretch;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
}
.columns.no-flex {
display: block;
}
.columns:after {
display: table;
content: "";
clear: both;
}
.columns + .columns {
margin: 15px 0 0;
}
.columns > * {
display: block;
float: left;
position: relative;
box-sizing: border-box;
margin: 0 0 0 1%;
}
/**
* column "quantity" helpers
*/
.columns.two > * {
width: 49.5%;
}
.columns.three > * {
width: 32.666%;
}
.columns.four > * {
width: 24.25%;
}
.columns.five > * {
width: 19.2%;
}
.columns.six > * {
width: 15.83%;
}
.columns.seven > * {
width: 13.428%;
}
.columns.eight > * {
width: 11.625%;
}
.columns.aside > *:first-child {
width: 59.6%;
}
.columns.aside > *:last-child {
width: 39.4%;
}
.columns.aside.reverse > *:first-child {
width: 39.4%;
}
.columns.aside.reverse > *:last-child {
width: 59.6%;
}
.columns.aside.small > *:first-child {
width: 71.142%;
}
.columns.aside.small > *:last-child {
width: 27.858%;
}
.columns.aside.small.reverse > *:first-child {
width: 27.858%;
}
.columns.aside.small.reverse > *:last-child {
width: 71.142%;
}
@media (max-width:767px) {
.columns + .columns:not(.nowrap) {
margin: 15px 0 0;
}
.columns:not(.nowrap) > * {
margin: 15px 0 0;
}
.columns.two:not(.nowrap) > *,
.columns.three:not(.nowrap) > *,
.columns.four:not(.nowrap) > *,
.columns.five:not(.nowrap) > *,
.columns.six:not(.nowrap) > *,
.columns.seven:not(.nowrap) > *,
.columns.eight:not(.nowrap) > *,
.columns.aside:not(.nowrap) > *:first-child,
.columns.aside:not(.nowrap) > *:last-child,
.columns.aside.reverse:not(.nowrap) > *:first-child,
.columns.aside.reverse:not(.nowrap) > *:last-child,
.columns.aside.small:not(.nowrap) > *:first-child,
.columns.aside.small:not(.nowrap) > *:last-child,
.columns.aside.small.reverse:not(.nowrap) > *:first-child,
.columns.aside.small.reverse:not(.nowrap) > *:last-child {
width: 100%;
}
}
/**
* column "split" helper
*/
.columns.split.two > * {
width: 100%;
}
.columns.split.two > *:last-child {
margin: 15px 0 0;
}
.columns.split.three > * {
width: 49.5%;
}
.columns.split.three > *:last-child {
margin: 15px 0 0 25.25%;
}
.columns.split.four > * {
width: 49.5%;
}
.columns.split.four > *:first-child + * + * {
margin: 15px 0 0;
}
.columns.split.four > *:last-child {
margin: 15px 0 0 1%;
}
.columns.split.five > * {
width: 32.666%;
}
.columns.split.five > *:first-child + * + * + * {
margin: 15px 0 0 16.833%;
}
.columns.split.five > *:last-child {
margin: 15px 0 0 1%;
}
.columns.split.six > * {
width: 32.666%;
}
.columns.split.six > *:first-child + * + * + * {
margin: 15px 0 0;
}
.columns.split.six > *:first-child + * + * + * + *,
.columns.split.six > *:last-child {
margin: 15px 0 0 1%;
}
.columns.split.seven > * {
width: 24.25%;
}
.columns.split.seven > *:first-child + * + * + * + * {
margin: 15px 0 0 12.25%;
}
.columns.split.seven > *:first-child + * + * + * + * + *,
.columns.split.seven > *:last-child {
margin: 15px 0 0 1%;
}
.columns.split.eight > * {
width: 24.25%;
}
.columns.split.eight > *:first-child + * + * + * + * {
margin: 15px 0 0;
}
.columns.split.eight > *:first-child + * + * + * + * + *,
.columns.split.eight > *:first-child + * + * + * + * + * + *,
.columns.split.eight > *:last-child {
margin: 15px 0 0 1%;
}
.columns.split.aside > *,
.columns.split.aside.reverse > * {
width: 100%;
}
.columns.split.aside > *:last-child,
.columns.split.aside.reverse > *:last-child {
margin: 15px 0 0;
}
.columns.split.aside.small > *,
.columns.split.aside.small.reverse > * {
width: 100%;
}
.columns.split.aside.small > *:last-child,
.columns.split.aside.small.reverse > *:last-child {
margin: 15px 0 0;
}
@media (max-width:767px) {
.columns.split.three:not(.nowrap) > *,
.columns.split.four:not(.nowrap) > *,
.columns.split.five:not(.nowrap) > *,
.columns.split.six:not(.nowrap) > *,
.columns.split.seven:not(.nowrap) > *,
.columns.split.eight:not(.nowrap) > * {
width: 100%;
}
.columns.split + .columns.split,
.columns.split:not(.nowrap) > *,
.columns.split.two:not(.nowrap) > *:last-child,
.columns.split.three:not(.nowrap) > *:last-child,
.columns.split.four:not(.nowrap) > *:first-child + * + *,
.columns.split.four:not(.nowrap) > *:last-child,
.columns.split.five:not(.nowrap) > *:first-child + * + * + *,
.columns.split.five:not(.nowrap) > *:last-child,
.columns.split.six:not(.nowrap) > *:first-child + * + * + *,
.columns.split.six:not(.nowrap) > *:first-child + * + * + * + *,
.columns.split.six:not(.nowrap) > *:last-child,
.columns.split.seven:not(.nowrap) > *:first-child + * + * + * + *,
.columns.split.seven:not(.nowrap) > *:first-child + * + * + * + * + *,
.columns.split.seven:not(.nowrap) > *:last-child,
.columns.split.eight:not(.nowrap) > *:first-child + * + * + * + *,
.columns.split.eight:not(.nowrap) > *:first-child + * + * + * + * + *,
.columns.split.eight:not(.nowrap) > *:first-child + * + * + * + * + * + *,
.columns.split.eight:not(.nowrap) > *:last-child,
.columns.split.aside:not(.nowrap) > *:last-child,
.columns.split.aside.reverse:not(.nowrap) > *:last-child {
margin: 15px 0 0;
}
.columns.split.aside.small:not(.nowrap) > *:last-child,
.columns.split.aside.small.reverse:not(.nowrap) > *:last-child {
margin: 15px 0 0;
}
.columns.split:not(.nowrap) > *:first-child {
margin: 0;
}
}
/**
* column combinations
*/
.columns.one.two > *:first-child {
margin: 0 0 0 25.25%;
}
.columns.one.three > *:first-child {
margin: 0 0 0 33.666%;
}
.columns.one.four > *:first-child {
margin: 0 0 0 37.875%;
}
.columns.one.five > *:first-child {
margin: 0 0 0 40.4%;
}
.columns.one.six > *:first-child {
margin: 0 0 0 42.085%;
}
.columns.one.seven > *:first-child {
margin: 0 0 0 43.286%;
}
.columns.one.eight > *:first-child {
margin: 0 0 0 44.187%;
}
.columns.two.three > *:first-child {
margin: 0 0 0 16.833%;
}
.columns.two.four > *:first-child {
margin: 0 0 0 25.25%;
}
.columns.two.five > *:first-child {
margin: 0 0 0 30.3%;
}
.columns.two.six > *:first-child {
margin: 0 0 0 33.666%;
}
.columns.two.seven > *:first-child {
margin: 0 0 0 36.071%;
}
.columns.two.eight > *:first-child {
margin: 0 0 0 37.875%;
}
.columns.three.four > *:first-child {
margin: 0 0 0 12.625%;
}
.columns.three.five > *:first-child {
margin: 0 0 0 20.2%;
}
.columns.three.six > *:first-child {
margin: 0 0 0 25.25%;
}
.columns.three.seven > *:first-child {
margin: 0 0 0 28.857%;
}
.columns.three.eight > *:first-child {
margin: 0 0 0 31.562%;
}
.columns.four.five > *:first-child {
margin: 0 0 0 10.1%;
}
.columns.four.six > *:first-child {
margin: 0 0 0 16.833%;
}
.columns.four.seven > *:first-child {
margin: 0 0 0 21.642%;
}
.columns.four.eight > *:first-child {
margin: 0 0 0 25.25%;
}
.columns.five.six > *:first-child {
margin: 0 0 0 8.416%;
}
.columns.five.seven > *:first-child {
margin: 0 0 0 14.428%;
}
.columns.five.eight > *:first-child {
margin: 0 0 0 18.937%;
}
.columns.six.seven > *:first-child {
margin: 0 0 0 7.214%;
}
.columns.six.eight > *:first-child {
margin: 0 0 0 12.625%;
}
.columns.seven.eight > *:first-child {
margin: 0 0 0 6.312%;
}
/**
* reset column margins
*/
.columns > *:first-child {
margin: 0;
}
@media (max-width:767px) {
.columns.one.two:not(.nowrap) > *:first-child,
.columns.one.three:not(.nowrap) > *:first-child,
.columns.one.four:not(.nowrap) > *:first-child,
.columns.one.five:not(.nowrap) > *:first-child,
.columns.one.six:not(.nowrap) > *:first-child,
.columns.one.seven:not(.nowrap) > *:first-child,
.columns.one.eight:not(.nowrap) > *:first-child,
.columns.two.three:not(.nowrap) > *:first-child,
.columns.two.four:not(.nowrap) > *:first-child,
.columns.two.five:not(.nowrap) > *:first-child,
.columns.two.six:not(.nowrap) > *:first-child,
.columns.two.seven:not(.nowrap) > *:first-child,
.columns.two.eight:not(.nowrap) > *:first-child,
.columns.three.four:not(.nowrap) > *:first-child,
.columns.three.five:not(.nowrap) > *:first-child,
.columns.three.six:not(.nowrap) > *:first-child,
.columns.three.seven:not(.nowrap) > *:first-child,
.columns.three.eight:not(.nowrap) > *:first-child,
.columns.four.five:not(.nowrap) > *:first-child,
.columns.four.six:not(.nowrap) > *:first-child,
.columns.four.seven:not(.nowrap) > *:first-child,
.columns.four.eight:not(.nowrap) > *:first-child,
.columns.five.six:not(.nowrap) > *:first-child,
.columns.five.seven:not(.nowrap) > *:first-child,
.columns.five.eight:not(.nowrap) > *:first-child,
.columns.six.seven:not(.nowrap) > *:first-child,
.columns.six.eight:not(.nowrap) > *:first-child,
.columns.seven.eight:not(.nowrap) > *:first-child {
margin: 0;
}
}
/**
* column "lines" helper
*/
.columns.lines > * {
border-left: 1px solid #cacaca;
}
.columns.lines > *:first-child {
border-left: none;
}
.columns.lines > * {
margin: 0;
}
.columns.lines.two > * {
width: 50%;
}
.columns.lines.three > * {
width: 33.33%;
}
.columns.lines.four > * {
width: 25%;
}
.columns.lines.five > * {
width: 20%;
}
.columns.lines.six > * {
width: 16.666%;
}
.columns.lines.seven > * {
width: 14.285%;
}
.columns.lines.eight > * {
width: 12.5%;
}
.columns.lines.aside > *:first-child {
width: 60%;
}
.columns.lines.aside > *:last-child {
width: 40%;
}
.columns.lines.aside.reverse > *:first-child {
width: 40%;
}
.columns.lines.aside.reverse > *:last-child {
width: 60%;
}
.columns.lines.aside.small > *:first-child {
width: 71.429%;
}
.columns.lines.aside.small > *:last-child {
width: 28.571%;
}
.columns.lines.aside.small.reverse > *:first-child {
width: 28.571%;
}
.columns.lines.aside.small.reverse > *:last-child {
width: 71.429%;
}
.columns.lines.two.three > *:first-child {
margin: 0 0 0 16.666%;
}
.columns.lines.two.four > *:first-child {
margin: 0 0 0 25%;
}
.columns.lines.two.five > *:first-child {
margin: 0 0 0 30%;
}
.columns.lines.two.six > *:first-child {
margin: 0 0 0 33.333%;
}
.columns.lines.two.seven > *:first-child {
margin: 0 0 0 35.714%;
}
.columns.lines.two.eight > *:first-child {
margin: 0 0 0 37.5%;
}
.columns.lines.three.four > *:first-child {
margin: 0 0 0 12.5%;
}
.columns.lines.three.five > *:first-child {
margin: 0 0 0 20%;
}
.columns.lines.three.six > *:first-child {
margin: 0 0 0 25%;
}
.columns.lines.three.seven > *:first-child {
margin: 0 0 0 28.571%;
}
.columns.lines.three.eight > *:first-child {
margin: 0 0 0 31.25%;
}
.columns.lines.four.five > *:first-child {
margin: 0 0 0 10%;
}
.columns.lines.four.six > *:first-child {
margin: 0 0 0 16.666%;
}
.columns.lines.four.seven > *:first-child {
margin: 0 0 0 21.428%;
}
.columns.lines.four.eight > *:first-child {
margin: 0 0 0 25%;
}
.columns.lines.five.six > *:first-child {
margin: 0 0 0 8.416%;
}
.columns.lines.five.seven > *:first-child {
margin: 0 0 0 14.428%;
}
.columns.lines.five.eight > *:first-child {
margin: 0 0 0 18.937%;
}
.columns.lines.six.seven > *:first-child {
margin: 0 0 0 7.214%;
}
.columns.lines.six.eight > *:first-child {
margin: 0 0 0 12.625%;
}
.columns.lines.seven.eight > *:first-child {
margin: 0 0 0 6.312%;
}
@media (max-width:767px) {
.columns.lines:not(.nowrap) > * {
border-top: 1px solid #cacaca;
border-left: none;
}
.columns.lines:not(.nowrap) > *:first-child {
border-top: none;
}
.columns.lines:not(.nowrap) > *.copy {
padding: 30px 15px;
}
.columns.lines:not(.nowrap) > *.copy:first-child {
padding: 0 15px 30px;
}
.columns.lines:not(.nowrap) + .columns.lines {
margin: 30px 0 0;
border-top: 1px solid #cacaca;
}
.columns.lines:not(.nowrap) + .columns.lines > *.copy:first-child {
padding: 30px 15px 30px;
}
.columns.lines.two:not(.nowrap) > *,
.columns.lines.three:not(.nowrap) > *,
.columns.lines.four:not(.nowrap) > *,
.columns.lines.five:not(.nowrap) > *,
.columns.lines.six:not(.nowrap) > *,
.columns.lines.seven:not(.nowrap) > *,
.columns.lines.eight:not(.nowrap) > *,
.columns.lines.aside:not(.nowrap) > *:first-child,
.columns.lines.aside:not(.nowrap) > *:last-child,
.columns.lines.aside.reverse:not(.nowrap) > *:first-child,
.columns.lines.aside.reverse:not(.nowrap) > *:last-child {
width: 100%;
}
.columns.lines.aside.small:not(.nowrap) > *:first-child,
.columns.lines.aside.small:not(.nowrap) > *:last-child,
.columns.lines.aside.small.reverse:not(.nowrap) > *:first-child,
.columns.lines.aside.small.reverse:not(.nowrap) > *:last-child {
width: 100%;
}
.columns.lines.two:not(.nowrap) > *:last-child,
.columns.lines.three:not(.nowrap) > *:last-child,
.columns.lines.four:not(.nowrap) > *:last-child,
.columns.lines.five:not(.nowrap) > *:last-child,
.columns.lines.six:not(.nowrap) > *:last-child,
.columns.lines.seven:not(.nowrap) > *:last-child,
.columns.lines.eight:not(.nowrap) > *:last-child,
.columns.lines.aside:not(.nowrap) > *:last-child,
.columns.lines.aside.reverse:not(.nowrap) > *:last-child {
padding: 30px 15px 0;
}
.columns.lines.aside.small:not(.nowrap) > *:last-child,
.columns.lines.aside.small.reverse:not(.nowrap) > *:last-child {
padding: 30px 15px 0;
}
.columns.lines.two.three:not(.nowrap) > *:first-child,
.columns.lines.two.four:not(.nowrap) > *:first-child,
.columns.lines.two.five:not(.nowrap) > *:first-child,
.columns.lines.two.six:not(.nowrap) > *:first-child,
.columns.lines.two.seven:not(.nowrap) > *:first-child,
.columns.lines.two.eight:not(.nowrap) > *:first-child,
.columns.lines.three.four:not(.nowrap) > *:first-child,
.columns.lines.three.five:not(.nowrap) > *:first-child,
.columns.lines.three.six:not(.nowrap) > *:first-child,
.columns.lines.three.seven:not(.nowrap) > *:first-child,
.columns.lines.three.eight:not(.nowrap) > *:first-child,
.columns.lines.four.five:not(.nowrap) > *:first-child,
.columns.lines.four.six:not(.nowrap) > *:first-child,
.columns.lines.four.seven:not(.nowrap) > *:first-child,
.columns.lines.four.eight:not(.nowrap) > *:first-child,
.columns.lines.five.six:not(.nowrap) > *:first-child,
.columns.lines.five.seven:not(.nowrap) > *:first-child,
.columns.lines.five.eight:not(.nowrap) > *:first-child,
.columns.lines.six.seven:not(.nowrap) > *:first-child,
.columns.lines.six.eight:not(.nowrap) > *:first-child,
.columns.lines.seven.eight:not(.nowrap) > *:first-child {
margin: 0;
}
}
/**
* column "join" helper, "stroke" and link fixed
*/
.columns.join > * {
margin: 0;
}
.columns.join.two > * {
width: 50%;
}
.columns.join.three > * {
width: 33.333%;
}
.columns.join.four > * {
width: 25%;
}
.columns.join.five > * {
width: 20%;
}
.columns.join.six > * {
width: 16.666%;
}
.columns.join.seven > * {
width: 14.285%;
}
.columns.join.eight > * {
width: 12.5%;
}
.columns.join.aside > *:first-child {
width: 60%;
}
.columns.join.aside > *:last-child {
width: 40%;
}
.columns.join.aside.reverse > *:first-child {
width: 40%;
}
.columns.join.aside.reverse > *:last-child {
width: 60%;
}
.columns.join.aside.small > *:first-child {
width: 71.429%;
}
.columns.join.aside.small > *:last-child {
width: 28.571%;
}
.columns.join.aside.small.reverse > *:first-child {
width: 28.571%;
}
.columns.join.aside.small.reverse > *:last-child {
width: 71.429%;
}
.columns.join > *.stroke {
border-width: 2px 1px 2px 1px;
border-radius: 0;
-webkit-border-radius: 0;
-moz-border-radius: 0;
}
.columns.join > *.stroke:first-child {
border-width: 2px 1px 2px 2px;
border-radius: 10px 0 0 10px;
-webkit-border-radius: 10px 0 0 10px;
-moz-border-radius: 10px 0 0 10px;
}
.columns.join.two > *:last-child,
.columns.join.three > *:last-child,
.columns.join.four > *:last-child,
.columns.join.five > *:last-child,
.columns.join.six > *:last-child,
.columns.join.seven > *:last-child,
.columns.join.eight > *:last-child,
.columns.join.aside > *:last-child,
.columns.join.aside.reverse > *:last-child {
border-width: 2px 2px 2px 1px;
border-radius: 0 10px 10px 0;
-webkit-border-radius: 0 10px 10px 0;
-moz-border-radius: 0 10px 10px 0;
}
.columns.join.aside.small > *:last-child,
.columns.join.aside.small.reverse > *:last-child {
border-width: 2px 2px 2px 1px;
border-radius: 0 10px 10px 0;
-webkit-border-radius: 0 10px 10px 0;
-moz-border-radius: 0 10px 10px 0;
}
.columns.join > a.stroke:hover:before,
.columns.join > a.stroke:focus:before,
.columns.join > a.stroke:active:before,
.columns.join > a.stroke.active:before {
position: absolute;
top: -2px;
left: -2px;
bottom: -2px;
width: 2px;
background-color: #0079c1;
content: "";
z-index: 1;
}
.columns.join > a.stroke:hover:first-child:before,
.columns.join > a.stroke:focus:first-child:before,
.columns.join > a.stroke:active:first-child:before,
.columns.join > a.stroke.active:first-child:before {
display: none;
}
.columns.join > a.stroke:hover:after,
.columns.join > a.stroke:focus:after,
.columns.join > a.stroke:active:after,
.columns.join > a.stroke.active:after {
position: absolute;
top: -2px;
right: -2px;
bottom: -2px;
width: 2px;
background-color: #0079c1;
content: "";
z-index: 1;
}
.columns.join.two > a.stroke:last-child:hover:after,
.columns.join.three > a.stroke:last-child:hover:after,
.columns.join.four > a.stroke:last-child:hover:after,
.columns.join.five > a.stroke:last-child:hover:after,
.columns.join.six > a.stroke:last-child:hover:after,
.columns.join.seven > a.stroke:last-child:hover:after,
.columns.join.eight > a.stroke:last-child:hover:after,
.columns.join.aside > a.stroke:last-child:hover:after,
.columns.join.aside.reverse > a.stroke:last-child:hover:after,
.columns.join.aside.small > a.stroke:last-child:hover:after,
.columns.join.aside.small.reverse > a.stroke:last-child:hover:after,
.columns.join.two > a.stroke:last-child:focus:after,
.columns.join.three > a.stroke:last-child:focus:after,
.columns.join.four > a.stroke:last-child:focus:after,
.columns.join.five > a.stroke:last-child:focus:after,
.columns.join.six > a.stroke:last-child:focus:after,
.columns.join.seven > a.stroke:last-child:focus:after,
.columns.join.eight > a.stroke:last-child:focus:after,
.columns.join.aside > a.stroke:last-child:focus:after,
.columns.join.aside.reverse > a.stroke:last-child:focus:after,
.columns.join.aside.small > a.stroke:last-child:focus:after,
.columns.join.aside.small.reverse > a.stroke:last-child:focus:after,
.columns.join.two > a.stroke:last-child:active:after,
.columns.join.three > a.stroke:last-child:active:after,
.columns.join.four > a.stroke:last-child:active:after,
.columns.join.five > a.stroke:last-child:active:after,
.columns.join.six > a.stroke:last-child:active:after,
.columns.join.seven > a.stroke:last-child:active:after,
.columns.join.eight > a.stroke:last-child:active:after,
.columns.join.aside > a.stroke:last-child:active:after,
.columns.join.aside.reverse > a.stroke:last-child:active:after,
.columns.join.aside.small > a.stroke:last-child:active:after,
.columns.join.aside.small.reverse > a.stroke:last-child:active:after,
.columns.join.two > a.stroke:last-child.active:after,
.columns.join.three > a.stroke:last-child.active:after,
.columns.join.four > a.stroke:last-child.active:after,
.columns.join.five > a.stroke:last-child.active:after,
.columns.join.six > a.stroke:last-child.active:after,
.columns.join.seven > a.stroke.active:after,
.columns.join.eight > a.stroke:last-child.active:after,
.columns.join.aside > a.stroke:last-child.active:after,
.columns.join.aside.reverse > a.stroke:last-child.active:after,
.columns.join.aside.small > a.stroke:last-child.active:after,
.columns.join.aside.small.reverse > a.stroke:last-child.active:after {
display: none;
}
.columns.join.two.three > *:first-child {
margin: 0 0 0 16.666%;
}
.columns.join.two.four > *:first-child {
margin: 0 0 0 25%;
}
.columns.join.two.five > *:first-child {
margin: 0 0 0 30%;
}
.columns.join.two.six > *:first-child {
margin: 0 0 0 33.333%;
}
.columns.join.two.seven > *:first-child {
margin: 0 0 0 35.715%;
}
.columns.join.two.eight > *:first-child {
margin: 0 0 0 37.5%;
}
.columns.join.three.four > *:first-child {
margin: 0 0 0 12.5%;
}
.columns.join.three.five > *:first-child {
margin: 0 0 0 20%;
}
.columns.join.three.six > *:first-child {
margin: 0 0 0 25%;
}
.columns.join.three.seven > *:first-child {
margin: 0 0 0 28.572%;
}
.columns.join.three.eight > *:first-child {
margin: 0 0 0 31.25%;
}
.columns.join.four.five > *:first-child {
margin: 0 0 0 10%;
}
.columns.join.four.six > *:first-child {
margin: 0 0 0 16.668%;
}
.columns.join.four.seven > *:first-child {
margin: 0 0 0 21.43%;
}
.columns.join.four.eight > *:first-child {
margin: 0 0 0 25%;
}
.columns.join.five.six > *:first-child {
margin: 0 0 0 8.335%;
}
.columns.join.five.seven > *:first-child {
margin: 0 0 0 14.287%;
}
.columns.join.five.eight > *:first-child {
margin: 0 0 0 18.75%;
}
.columns.join.six.seven > *:first-child {
margin: 0 0 0 7.145%;
}
.columns.join.six.eight > *:first-child {
margin: 0 0 0 12.5%;
}
.columns.join.seven.eight > *:first-child {
margin: 0 0 0 6.25%;
}
@media (max-width:767px) {
.columns.join.two.three > *,
.columns.join.two.four > *,
.columns.join.two.five > *,
.columns.join.two.six > *,
.columns.join.two.seven > *,
.columns.join.two.eight > * {
width: 50%;
}
.columns.join.three.four > *,
.columns.join.three.five > *,
.columns.join.three.six > *,
.columns.join.three.seven > *,
.columns.join.three.eight > * {
width: 33.33%;
}
.columns.join.four.five > *,
.columns.join.four.six > *,
.columns.join.four.seven > *,
.columns.join.four.eight > * {
width: 25%;
}
.columns.join.five.six > *,
.columns.join.five.seven > *,
.columns.join.five.eight > * {
width: 20%;
}
.columns.join.six.seven > *,
.columns.join.six.eight > * {
width: 16.666%;
}
.columns.join.seven.eight > * {
width: 14.285%;
}
.columns.join.two.three > *:first-child,
.columns.join.two.four > *:first-child,
.columns.join.two.five > *:first-child,
.columns.join.two.six > *:first-child,
.columns.join.two.seven > *:first-child,
.columns.join.two.eight > *:first-child,
.columns.join.three.four > *:first-child,
.columns.join.three.five > *:first-child,
.columns.join.three.six > *:first-child,
.columns.join.three.seven > *:first-child,
.columns.join.three.eight > *:first-child,
.columns.join.four.five > *:first-child,
.columns.join.four.six > *:first-child,
.columns.join.four.seven > *:first-child,
.columns.join.four.eight > *:first-child,
.columns.join.five.six > *:first-child,
.columns.join.five.seven > *:first-child,
.columns.join.five.eight > *:first-child,
.columns.join.six.seven > *:first-child,
.columns.join.six.eight > *:first-child,
.columns.join.seven.eight > *:first-child {
margin: 0;
}
}
/* Icons
========================================================================== */
@font-face {
font-family: 'bmo-icon';
src: url(/fonts/bmo-icon.eot) format('embedded-opentype');
src: url(/fonts/bmo-icon.eot) format('embedded-opentype'), url(/fonts/bmo-icon.woff2) format('woff2'), url(/fonts/bmo-icon.woff) format('woff'), url(/fonts/bmo-icon.ttf) format('truetype');
font-weight: normal;
font-style: normal;
}
/**
* icon
*/
.icon {
display: inline-block;
width: 24px;
height: 24px;
line-height: 24px;
}
.icon:before {
color: #cacaca;
line-height: 24px;
font-family: "bmo-icon";
font-size: 23px;
font-weight: normal;
font-style: normal;
font-variant: normal;
text-align: center;
text-transform: none;
speak: none;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
overflow: hidden;
}
.icon.stroke {
padding: 8px;
border-width: 2px;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
}
.icon.fill {
background-color: #cacaca;
}
.icon.fill:before {
color: #ffffff;
}
.icon.fill.stroke {
border-color: #cacaca;
}
.icon.fill.dark {
background-color: #3c3c3c;
}
.icon.fill.dark.stroke {
border-color: #3c3c3c;
}
.icon.active {
background-color: #0079c1;
}
.icon.active:before {
color: #ffffff;
}
.icon.active.stroke {
border-color: #0079c1;
}
.icon.large {
width: 40px;
height: 40px;
line-height: 40px;
}
.icon.large:before {
line-height: 40px;
font-size: 39px;
}
.icon.large.stroke {
padding: 18px;
border-radius: 40px;
-webkit-border-radius: 40px;
-moz-border-radius: 40px;
}
@media (max-width:767px) {
.icon.large {
width: 24px;
height: 24px;
line-height: 24px;
}
.icon.large:before {
line-height: 24px;
font-size: 23px;
}
.icon.large.stroke {
padding: 9px;
border-width: 1px;
border-radius: 50%;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
}
}
a .icon:before {
color: #0079c1;
}
a:hover .icon.stroke,
a:focus .icon.stroke {
border-color: #0079c1;
}
a:active .icon.stroke,
a.active .icon.stroke {
border-color: #0079c1;
background-color: #0079c1;
}
a:active .icon.stroke:before,
a.active .icon.stroke:before {
color: #ffffff;
}
@media (min-width:768px) {
a[href^="tel"] .icon:before {
color: #cacaca;
}
a[href^="tel"]:hover .icon.stroke,
a[href^="tel"]:focus .icon.stroke {
border-color: #cacaca;
}
a[href^="tel"]:active .icon.stroke {
background-color: transparent;
}
a[href^="tel"]:active .icon.stroke:before {
color: #cacaca;
}
a[href^="tel"] .icon.active:before {
color: #ffffff;
}
a[href^="tel"]:hover .icon.active {
border-color: #0079c1;
}
a[href^="tel"]:active .icon.active {
background-color: #0079c1;
}
a[href^="tel"]:active .icon.active:before {
color: #ffffff;
}
}
/**
* icon helper classes
*/
/**
* Set the icon color to the primary blue if it has the class of primary
*/
.icon.primary:before {
color: #0079c1;
}
/**
* Icon component where icon is blue and text with right next to it.
* Simple but didnt exist before
*/
.icon-block {
position: relative;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
}
.icon-block--start {
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
}
.icon-block--top {
-webkit-align-items: flex-start;
-ms-flex-align: start;
-ms-grid-row-align: flex-start;
align-items: flex-start;
}
.icon-block--inline {
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
}
/* Only underline the text in anchors */
.icon-block--link,
.icon-block--link:hover,
.icon-block--cta,
.icon-block--cta:hover {
text-decoration: none;
}
.icon-block--link:hover > .icon-block__text,
.icon-block--cta:hover .icon-block__title {
text-decoration: underline;
}
.icon-block > .icon.large {
width: 40px;
height: 40px;
}
/**
* Some icons go right up to the edge of their 'width' and some dont.
* If your icon is really close up to the text even after a space use the 'tight' class.
*/
.icon-block > .icon.tight {
margin-right: .75em;
}
.icon-block > .icon.large,
.icon-block > .icon.large:before {
font-size: 39px;
line-height: 40px;
}
.icon-block > .icon-text {
text-align: left;
}
/**
* Our icons set a weird line height and throw off the rest of the text,
* this is a fix to align the text with the icon.
*/
.icon-block > .icon-text:not(.dont-fix-line) {
position: relative;
top: 2px;
}
/* start - added sept 26 2016 */
.icon.twentypc:before {
content: "\e90a";
font-size: 48px;
line-height: 42px;
}
@media (max-width:767px) {
.icon.twentypc:before {
font-size: 28px;
line-height: 26px;
}
}
.cta img {
width: 100%;
}
.cta .cta-desc {
position: absolute;
bottom: 0;
left: 0;
right: 0;
}
.cta .cta-desc.rollover {
position: absolute;
bottom: 0;
left: 0;
right: 0;
top: 65%;
}
.cta .cta-title {
display: block;
color: #fff;
font-family: 'dax-light';
font-size: 1.4em;
line-height: 1.3em;
letter-spacing: 2px;
opacity: 1;
padding: 0px 0;
}
.cta .cta-desc .icon {
position: absolute;
left: 50%;
margin: 0 -25px;
top: -30px;
color: #ffffff;
}
.cta-hover .cta-desc.rollover .icon {
position: absolute;
left: 50%;
margin: 0 -25px;
top: -30px;
color: #ffffff;
}
.bg-opacity {
background: #3c3c3c;
background: rgba(60, 60, 60, .8);
transition: 0.5s background ease;
}
.link .flush {
color: #414141;
line-height: 22px;
text-decoration: none;
}
.cta .cta-desc {
padding: 16px;
bottom: 4px
}
.cta .cta-desc:hover,
.tabs-selector a:hover .cta .cta-desc {
background-color: rgba(0, 121, 193, 0.5);
transition: 0.5s background ease;
}
.tabs-selector a.active .cta .cta-desc {
background-color: #0079c1;
}
.accordion-content div .copy {
padding: 10px;
}
.copy.flush.top {
width: 34.666%;
}
.accordion-content div div ul {
padding-left: 1em;
}
.accordion-content div div ul li ul {
margin-top: 10px;
}
.accordion-content div div ul li {
margin-bottom: 10px;
}
.cta .cta-title {
font-size: 1.2em;
}
.function.primary {
display: none;
}
.our-services {
margin-top: -4px;
}
#tab-group-2,
#tab-group-1 {
margin-bottom: 20px;
margin-top: 40px;
}
@media (max-width:767px) {
.box + .box {
margin: 0;
}
.box:first-child > *:first-child > *:first-child,
.box:first-child > *:first-child > *:first-child > *:first-child {
margin: 0;
}
.box.three:not(.nowrap) > * {
width: 100%;
}
.box.four:not(.nowrap) > * {
width: 50%;
margin: 0;
}
.cta-hover .cta-desc.rollover {
top: 78%;
}
.cta-hover .cta-title {
padding: 0;
}
.three .cta .cta-desc.rollover {
top: 50%;
}
.cta .cta-desc {
padding: 16px;
bottom: 0px
}
.cta .cta-desc.rollover {
top: 50%;
}
.cta {
max-height: 241px;
overflow: hidden;
}
.copy.flush.top {
width: 100%;
float: left;
padding-left: 0;
margin-top: 10px
}
.tabs.tabs-accordion .tabs-selector {
display: block;
}
.cta.block img {
height: auto;
min-height: 150px
}
.stroke.copy.fill {
padding: 0 25px;
}
}
/* added Feb 21 2017 */
.icon.mobile-money-icon:before {
content: "\e90f";
}
.icon.hockey-jersey-icon:before {
content: "\e90e";
}
.icon.basketball-jersey-icon:before {
content: "\e90d";
}
/* added Dec 20 2016 */
.icon.retirement:before {
content: "\e90c";
}
.icon.secure-email-icon:before {
content: "\e90a";
}
.icon.percent:before {
content: "\e90b";
}
/* start - added june 13 2016 */
.icon.usd-savings:before {
content: "\e909";
}
.icon.ActivateCreditCard:before {
content: "\e908";
}
/* start - added april 13 2016 */
.icon.demo:before {
content: "\e906";
}
.icon.videoPlay:before {
content: "\e907";
}
/* start - added feb 11 2016 */
.icon.x3:before {
content: "\e905";
}
/* start - added jan 19 2016 */
.icon.planshare:before {
content: "\e903";
}
.icon.transfer:before {
content: "\e904";
}
.icon.gear:before {
content: "\e901";
}
.icon.touchscreen:before {
content: "\e902";
}
.icon.truck:before {
content: "\e900";
}
.icon.biz-loan:before {
content: "\e801";
}
.icon.cheque:before {
content: "\e802";
}
.icon.cheque-discount:before {
content: "\e803";
}
.icon.cheque-rewards:before {
content: "\e804";
}
.icon.concierge:before {
content: "\e805";
}
.icon.creditcard-savings:before {
content: "\e806";
}
.icon.gov-loan:before {
content: "\e807";
}
.icon.home-loc:before {
content: "\e808";
}
.icon.id-protection:before {
content: "\e809";
}
.icon.merchant-loan:before {
content: "\e800";
}
.icon.merchant-loc:before {
content: "\e80f";
}
.icon.overdraft-loc:before {
content: "\e810";
}
.icon.schedule-cheque:before {
content: "\e811";
}
.icon.fiftyfive:before {
content: "\e80a";
}
.icon.time-long:before {
content: "\e6d2";
}
.icon.time-medium:before {
content: "\e6d3";
}
.icon.time-short:before {
content: "\e6d4";
}
.icon.wheelchair:before {
content: "\e6d5";
}
.icon.personal-loc:before {
content: "\e6cf";
}
.icon.ra-rrsploan:before {
content: "\e6d0";
}
.icon.rrsp-readiline:before {
content: "\e6d1";
}
.icon.agri-readiline-loc:before {
content: "\e6bd";
}
.icon.commercial-loans-insurance:before {
content: "\e6be";
}
.icon.commercial-mortgage:before {
content: "\e6bf";
}
.icon.compare-loan-option:before {
content: "\e6c0";
}
.icon.compare-value:before {
content: "\e6c1";
}
.icon.farm-equip-readiline:before {
content: "\e6c2";
}
.icon.farm-mortgage:before {
content: "\e6c3";
}
.icon.fixedrate-termloan:before {
content: "\e6c4";
}
.icon.great-value:before {
content: "\e6c5";
}
.icon.ilp:before {
content: "\e6c6";
}
.icon.operating-loc:before {
content: "\e6c7";
}
.icon.priceless-possibilities:before {
content: "\e6c8";
}
.icon.sky-is-the-limit:before {
content: "\e6c9";
}
.icon.sbusi-instalment-loan:before {
content: "\e6ca";
}
.icon.sbusi-loc:before {
content: "\e6cb";
}
.icon.us-loc-fromhb:before {
content: "\e6cc";
}
.icon.variablerate-tloan:before {
content: "\e6cd";
}
.icon.what-v-caniafford:before {
content: "\e6ce";
}
.icon.interac-debit:before {
content: "\e6bc";
}
.icon.agrinvest-account:before {
content: "\e6a9";
}
.icon.business-current-account:before {
content: "\e6aa";
}
.icon.business-premium:before {
content: "\e6ab";
}
.icon.car-rental:before {
content: "\e6ac";
}
.icon.car-trips:before {
content: "\e6ad";
}
.icon.community-account:before {
content: "\e6ae";
}
.icon.compare:before {
content: "\e6af";
}
.icon.cross-border-shopping:before {
content: "\e6b0";
}
.icon.female-advisor:before {
content: "\e6b1";
}
.icon.find-plan:before {
content: "\e6b2";
}
.icon.giftcard:before {
content: "\e6b3";
}
.icon.help-choose:before {
content: "\e6b4";
}
.icon.merchandise:before {
content: "\e6b5";
}
.icon.mobile-billpay:before {
content: "\e6b6";
}
.icon.not-collecting:before {
content: "\e6b7";
}
.icon.shopping-cart-am:before {
content: "\e6b8";
}
.icon.small-business-plan:before {
content: "\e6b9";
}
.icon.still-cannot-find:before {
content: "\e6ba";
}
.icon.value-assist-plan:before {
content: "\e6bb";
}
.icon.double-chevron-down:before {
content: "\e6a4";
}
.icon.double-chevron-left:before {
content: "\e6a5";
}
.icon.double-chevron-right:before {
content: "\e6a6";
}
.icon.double-chevron-up:before {
content: "\e6a7";
}
.icon.x-to-close:before {
content: "\e6a8";
}
.icon.warning-tax:before {
content: "\e6a3";
}
.icon.file-table:before {
content: "\e69b";
}
.icon.info-i:before {
content: "\e69d";
}
.icon.magnifying-glass-dollar:before {
content: "\e69e";
}
.icon.speech-bubble-graph:before {
content: "\e69f";
}
.icon.tools:before {
content: "\e6a0";
}
.icon.warning-info:before {
content: "\e6a1";
}
.icon.warning-money:before {
content: "\e6a2";
}
.icon.googleplus:before {
content: "\e69a";
}
.icon.googleplus-filled:before {
content: "\e69c";
}
.icon.compare-credit-cards:before {
content: "\e695";
}
.icon.credit-cards-funnel:before {
content: "\e696";
}
.icon.trophy-calculator:before {
content: "\e697";
}
.icon.share-filled:before {
content: "\e698";
}
.icon.share:before {
content: "\e699";
}
.icon.calculator-affordability:before {
content: "\e693";
}
.icon.calculator-mortgage:before {
content: "\e694";
}
.icon.credit-card-chip:before {
content: "\e692";
}
.icon.first-time-homebuyer:before {
content: "\e691";
}
.icon.airplane:before {
content: "\e600";
}
.icon.alert:before {
content: "\e601";
}
.icon.auto-checking:before {
content: "\e602";
}
.icon.auto-envelope:before {
content: "\e603";
}
.icon.baby:before {
content: "\e604";
}
.icon.banking:before {
content: "\e605";
}
.icon.book:before {
content: "\e606";
}
.icon.building:before {
content: "\e607";
}
.icon.building-executive:before {
content: "\e608";
}
.icon.calculator:before {
content: "\e609";
}
.icon.calendar-check:before {
content: "\e60a";
}
.icon.checkings:before {
content: "\e60b";
}
.icon.checkmark:before {
content: "\e60c";
}
.icon.chevron-down:before {
content: "\e60d";
}
.icon.chevron-left:before {
content: "\e60e";
}
.icon.chevron-right:before {
content: "\e60f";
}
.icon.chevron-up:before {
content: "\e610";
}
.icon.circle-cycle:before {
content: "\e611";
}
.icon.clock:before {
content: "\e612";
}
.icon.credit-card:before {
content: "\e613";
}
.icon.credit-card-motion:before {
content: "\e614";
}
.icon.credit-card-reader:before {
content: "\e615";
}
.icon.crown:before {
content: "\e616";
}
.icon.cycle:before {
content: "\e617";
}
.icon.dollar-bills:before {
content: "\e618";
}
.icon.dollar-cycle:before {
content: "\e619";
}
.icon.dollar-cycle-single:before {
content: "\e61a";
}
.icon.dollar-down:before {
content: "\e61b";
}
.icon.download:before {
content: "\e61c";
}
.icon.envelope:before {
content: "\e61d";
}
.icon.envelope-at:before {
content: "\e61e";
}
.icon.facebook:before {
content: "\e61f";
}
.icon.facebook-filled:before {
content: "\e620";
}
.icon.fax:before {
content: "\e621";
}
.icon.foreign-currency:before {
content: "\e622";
}
.icon.game-controller:before {
content: "\e623";
}
.icon.globe:before {
content: "\e624";
}
.icon.globe-hand:before {
content: "\e625";
}
.icon.graduation-hat:before {
content: "\e626";
}
.icon.graph:before {
content: "\e627";
}
.icon.group:before {
content: "\e628";
}
.icon.group-tie:before {
content: "\e629";
}
.icon.growth-trend:before {
content: "\e62a";
}
.icon.handshake:before {
content: "\e62b";
}
.icon.hockey-stick:before {
content: "\e62c";
}
.icon.house:before {
content: "\e62d";
}
.icon.individual:before {
content: "\e62e";
}
.icon.individual-hair:before {
content: "\e62f";
}
.icon.individual-joint:before {
content: "\e630";
}
.icon.international:before {
content: "\e631";
}
.icon.international-hand:before {
content: "\e632";
}
.icon.internet-document:before {
content: "\e633";
}
.icon.laptop:before {
content: "\e634";
}
.icon.laptop-clock:before {
content: "\e635";
}
.icon.laptop-money:before {
content: "\e636";
}
.icon.laptop-trend:before {
content: "\e637";
}
.icon.leaf:before {
content: "\e638";
}
.icon.lending-money:before {
content: "\e639";
}
.icon.light-bulb:before {
content: "\e63a";
}
.icon.linkedin:before {
content: "\e63b";
}
.icon.linkedin-filled:before {
content: "\e63c";
}
.icon.list-checkmark:before {
content: "\e63d";
}
.icon.lock:before {
content: "\e63e";
}
.icon.long-list:before {
content: "\e63f";
}
.icon.magnifying-glass:before {
content: "\e640";
}
.icon.mail:before {
content: "\e641";
}
.icon.minus:before {
content: "\e642";
}
.icon.mobile-phone:before {
content: "\e643";
}
.icon.money:before {
content: "\e644";
}
.icon.monitor-dollar:before {
content: "\e645";
}
.icon.multiple-cards:before {
content: "\e646";
}
.icon.no-fees:before {
content: "\e647";
}
.icon.number-1:before {
content: "\e649";
}
.icon.number-2:before {
content: "\e64a";
}
.icon.number-3:before {
content: "\e64b";
}
.icon.number-4:before {
content: "\e64c";
}
.icon.number-5:before {
content: "\e64d";
}
.icon.number-6:before {
content: "\e64e";
}
.icon.number-7:before {
content: "\e64f";
}
.icon.number-8:before {
content: "\e650";
}
.icon.number-9:before {
content: "\e651";
}
.icon.number-10:before {
content: "\e652";
}
.icon.number-11:before {
content: "\e653";
}
.icon.number-12:before {
content: "\e654";
}
.icon.number-13:before {
content: "\e655";
}
.icon.number-14:before {
content: "\e656";
}
.icon.number-15:before {
content: "\e657";
}
.icon.number-16:before {
content: "\e658";
}
.icon.number-17:before {
content: "\e659";
}
.icon.number-18:before {
content: "\e65a";
}
.icon.number-19:before {
content: "\e65b";
}
.icon.number-20:before {
content: "\e65c";
}
.icon.old-building:before {
content: "\e65d";
}
.icon.one:before {
content: "\e65e";
}
.icon.painting:before {
content: "\e65f";
}
.icon.percent:before {
content: "\e660";
}
.icon.percentage-growth:before {
content: "\e661";
}
.icon.personal-wallet:before {
content: "\e662";
}
.icon.phone:before {
content: "\e663";
}
.icon.pie-graph:before {
content: "\e664";
}
.icon.pin-drop:before {
content: "\e665";
}
.icon.plan:before {
content: "\e666";
}
.icon.plus:before {
content: "\e667";
}
.icon.printer:before {
content: "\e668";
}
.icon.profile:before {
content: "\e669";
}
.icon.profile-tie:before {
content: "\e66a";
}
.icon.rss:before {
content: "\e66b";
}
.icon.rss-filled:before {
content: "\e66c";
}
.icon.safe-vault:before {
content: "\e66d";
}
.icon.scroll-caret:before {
content: "\e66e";
}
.icon.seniors:before {
content: "\e66f";
}
.icon.shield:before {
content: "\e670";
}
.icon.shield-car:before {
content: "\e671";
}
.icon.shield-check:before {
content: "\e672";
}
.icon.shield-money:before {
content: "\e673";
}
.icon.shirt-tie:before {
content: "\e674";
}
.icon.shopping-card-lock:before {
content: "\e675";
}
.icon.speech-bubble:before {
content: "\e676";
}
.icon.stats:before {
content: "\e677";
}
.icon.stethoscope:before {
content: "\e678";
}
.icon.store-front:before {
content: "\e679";
}
.icon.stroller:before {
content: "\e67a";
}
.icon.suitcase:before {
content: "\e67b";
}
.icon.suitcase-cycle:before {
content: "\e67c";
}
.icon.tablet-cast:before {
content: "\e67d";
}
.icon.tablet-dollar:before {
content: "\e67e";
}
.icon.tablet-play:before {
content: "\e67f";
}
.icon.tablet-stats:before {
content: "\e680";
}
.icon.tablet-trend:before {
content: "\e681";
}
.icon.thumbs-up:before {
content: "\e682";
}
.icon.times-two:before {
content: "\e683";
}
.icon.trend-magnifying-glass:before {
content: "\e684";
}
.icon.trophy:before {
content: "\e685";
}
.icon.twenty-five-percent:before {
content: "\e686";
}
.icon.twitter:before {
content: "\e688";
}
.icon.twitter-filled:before {
content: "\e689";
}
.icon.two-directions:before {
content: "\e68a";
}
.icon.wallet:before {
content: "\e68b";
}
.icon.youtube:before {
content: "\e68c";
}
.icon.youtube-filled:before {
content: "\e68d";
}
.icon.youtube-play:before {
content: "\e68e";
}
.icon.zero-dollars:before {
content: "\e68f";
}
html[lang="fr"] .icon.no-fees:before {
content: "\e648";
}
html[lang="fr"] .icon.twenty-five-percent:before {
content: "\e687";
}
html[lang="fr"] .icon.zero-dollars:before {
content: "\e690";
}
/* Links
========================================================================== */
.link {
display: inline-block;
position: relative;
padding: 0 30px 0 0;
line-height: 24px;
font-family: "dax-medium";
font-size: 1.1em;
text-align: left;
}
.link:before {
display: block;
position: absolute;
top: 50%;
right: 0;
width: 24px;
height: 24px;
margin: -12px 0 0;
border-radius: 12px;
background-color: #0079c1;
line-height: 24px;
color: #ffffff;
font-family: "bmo-icon";
font-size: 8px;
text-align: center;
content: "\e60f";
speak: none;
}
.link.reverse {
padding: 0 0 0 30px;
}
.link.reverse:before {
right: auto;
left: 0;
}
.link.disabled:before {
display: none;
}
@media (max-width:767px) {
.link {
padding: 0 28px 0 0;
}
.link:before {
width: 21px;
height: 22px;
margin: -11px 0 0;
padding: 0 0 0 1px;
border-radius: 11px;
line-height: 22px;
}
}
.link.block {
padding: 0 0 34px 0;
font-size: 1em;
line-height: 1.3em;
color: #414141;
text-align: center;
}
.link.block:before {
top: auto;
right: auto;
bottom: 0;
left: 50%;
margin: 0 0 0 -12px;
}
.link.block:hover,
.link.block:focus {
text-decoration: none;
}
.link.block.copy {
padding: 30px 30px 64px;
}
.link.block.copy:before {
bottom: 30px;
}
.link.block.copy.stroke {
padding: 28px 28px 62px;
}
.link.block.copy.stroke:before {
bottom: 28px;
}
.link:active,
.link.active {
background-color: inherit;
color: inherit;
}
@media (max-width:767px) {
.link {
text-align: left;
}
.link.block {
padding: 0 0 32px 0;
}
.link.block.copy {
padding: 15px 15px 47px;
}
.link.block.copy:before {
bottom: 15px;
}
.link.block.copy.stroke {
padding: 13px 13px 45px;
}
.link.block.copy.stroke:before {
bottom: 13px;
}
.columns.lines:not(.nowrap) > *.link.block.copy {
padding: 30px 15px 62px;
}
.columns.lines:not(.nowrap) > *.link.block.copy:before {
bottom: 30px;
}
.columns.lines:not(.nowrap) > *.link.block.copy:first-child {
padding: 0 15px 62px;
}
.columns.lines:not(.nowrap) > *.link.block.copy:last-child {
padding: 30px 15px 42px;
}
.columns.lines:not(.nowrap) > *.link.block.copy:last-child:before {
bottom: 0;
}
}
@media (min-width:768px) {
.link[href^="tel"]:before {
display: none;
}
.link.block[href^="tel"]:before {
display: block;
}
}
.link.icon {
display: table-cell;
width: auto;
height: 44px;
padding: 0 0 0 56px;
text-align: left;
vertical-align: middle;
}
.link.icon:before {
display: none;
}
.link.icon .icon {
display: block;
position: absolute;
top: 0;
left: 0;
}
@media (max-width:767px) {
.link.icon {
text-align: left;
}
}
/* chevron
========================================================================== */
.chevron {
display: inline-block;
position: relative;
padding: 0 21px 1px 0;
line-height: 1em;
font-family: "dax-medium";
}
.chevron:before {
display: block;
position: absolute;
top: 50%;
right: 0;
width: 16px;
height: 16px;
margin: -8px 0 0;
line-height: 16px;
color: #0079c1;
font-family: "bmo-icon";
font-size: 14px;
text-align: center;
speak: none;
}
.chevron:hover,
.chevron:focus,
.chevron.active {
padding: 0 21px 0px 0;
border-bottom: 1px solid #0079c1;
text-decoration: none;
}
.chevron.disabled:before {
color: #414141;
}
.chevron.disabled:hover,
.chevron.disabled:focus,
.chevron.disabled.active {
padding: 0 21px 1px 0;
border-bottom: 0;
}
.chevron.reverse {
padding: 0 0 0 21px;
}
.chevron.reverse:before {
right: auto;
left: 0;
}
.chevron.down:before {
content: "\e60d";
}
.chevron.left:before {
content: "\e60e";
}
.chevron.right:before {
content: "\e60f";
}
.chevron.up:before {
content: "\e610";
}
.chevron.scroll:before {
content: "\e66e";
}
@media (min-width:768px) {
.chevron[href^="tel"]:before {
color: #414141;
}
.chevron[href^="tel"]:hover,
.chevron[href^="tel"]:focus,
.chevron[href^="tel"].active {
padding: 0 21px 1px 0;
border-bottom: 0;
}
}
/* Buttons
========================================================================== */
button,
a.button,
span.button {
display: inline-block;
box-sizing: border-box;
height: 50px;
padding: 0 30px;
border: 2px solid #0079c1;
border-radius: 25px;
-webkit-border-radius: 25px;
-moz-border-radius: 25px;
background-color: transparent;
color: #0079c1;
font-family: "dax";
font-size: 15px;
line-height: 46px;
text-align: center;
vertical-align: middle;
overflow: hidden;
}
button:hover,
a.button:hover {
border-color: #1a4d78;
color: #1a4d78;
text-decoration: none;
}
button:focus,
a.button:focus,
button:active,
a.button:active {
border-color: #1a4d78;
color: #1a4d78;
text-decoration: none;
outline: 0;
}
button.disabled,
a.button.disabled {
border-color: #99c9e6;
color: #99c9e6;
cursor: default;
}
button.primary,
a.button.primary,
span.button.primary {
background-color: #0079c1;
color: #ffffff;
}
button.primary:hover,
a.button.primary:hover {
border-color: #1a4d78;
background-color: #1a4d78;
color: #ffffff;
text-decoration: none;
}
button.primary:focus,
a.button.primary:focus,
button.primary:active,
a.button.primary:active {
border-color: #1a4d78;
background-color: #1a4d78;
color: #ffffff;
text-decoration: none;
outline: 0;
}
button.primary.disabled,
a.button.primary.disabled {
border-color: #99c9e6;
background-color: #99c9e6;
color: #efefef;
}
button.attention,
a.button.attention,
span.button.attention {
border-color: #ed1b24;
background-color: #ed1b24;
color: #ffffff;
}
button.attention:hover,
a.button.attention:hover {
border-color: #9b262c;
background-color: #9b262c;
color: #ffffff;
text-decoration: none;
}
button.attention:focus,
a.button.attention:focus,
button.attention:active,
a.button.attention:active {
border-color: #9b262c;
background-color: #9b262c;
color: #ffffff;
text-decoration: none;
outline: 0;
}
button.attention.disabled,
a.button.attention.disabled {
border-color: #f8a3a7;
background-color: #f8a3a7;
color: #efefef;
}
button.small,
a.button.small,
span.button.small {
height: 34px;
line-height: 34px;
}
button.wrap,
a.button.wrap,
span.button.wrap {
padding: 4px 30px;
line-height: 19px;
}
button + button,
button + a.button,
button + span.button,
a.button + button,
a.button + a.button,
a.button + span.button,
span.button + button,
span.button + a.button,
span.button + span.button {
margin: 0 0 0 1%;
}
@media (max-width:767px) {
button,
a.button,
span.button,
button.small,
a.button.small,
span.button.small {
width: 100%;
height: 50px;
line-height: 46px;
}
button + button,
button + a.button,
button + span.button,
a.button + button,
a.button + a.button,
a.button + span.button,
span.button + button,
span.button + a.button,
span.button + span.button {
margin: 15px 0 0;
}
p button,
p a.button,
p span.button {
margin: 15px 0 0;
}
}
button.flush,
a.button.flush,
span.button.flush {
width: 100%;
}
/* Function
========================================================================== */
.function {
display: inline-block;
width: 20px;
height: 20px;
padding: 10px;
border: 2px solid #0079c1;
border-radius: 22px;
-webkit-border-radius: 22px;
-moz-border-radius: 22px;
line-height: 20px;
text-align: center;
}
.function:focus {
outline: 0;
}
.function:hover,
.function:focus,
.function:active,
a:hover .function,
a:focus .function,
a:active .function {
border-color: #1a4d78;
}
.function .icon {
width: 20px;
height: 20px;
line-height: 20px;
}
.function .icon:before {
color: #0079c1;
line-height: 20px;
font-size: 19px;
}
.function:hover .icon:before,
.function:focus .icon:before,
.function:active .icon:before,
a:hover .function .icon:before,
a:focus .function .icon:before,
a:active .function .icon:before {
color: #1a4d78;
}
.function.disabled,
a.disabled .function {
border-color: #99c9e6;
}
.function.disabled:focus {
outline: 1px dotted #414141;
}
.function.disabled .icon:before,
a.disabled .function .icon:before {
color: #99c9e6;
}
.function.primary {
background-color: #0079c1;
}
.function.primary .icon:before {
color: #ffffff;
}
.function.primary:hover,
.function.primary:focus,
.function.primary:active,
a:hover .function.primary,
a:focus .function.primary,
a:active .function.primary {
background-color: #1a4d78;
}
a:hover .function.primary .icon:before,
a:focus .function.primary .icon:before,
a:active .function.primary .icon:before {
color: #ffffff;
}
.function.primary.disabled,
a.disabled .function.primary {
border-color: #99c9e6;
background-color: #99c9e6;
}
.function.primary.disabled .icon:before,
a.disabled .function.primary .icon:before {
color: #efefef;
}
.function.attention {
border-color: #ed1b24;
background-color: #ed1b24;
}
.function.attention .icon:before {
color: #ffffff;
}
.function.attention:hover,
.function.attention:focus,
.function.attention:active,
a:hover .function.attention,
a:focus .function.attention,
a:active .function.attention {
border-color: #9b262c;
background-color: #9b262c;
}
a:hover .function.attention .icon:before,
a:focus .function.attention .icon:before,
a:active .function.attention .icon:before {
color: #ffffff;
}
.function.attention.disabled,
a.disabled .function.attention {
border-color: #f8a3a7;
background-color: #f8a3a7;
}
.function.attention.disabled .icon:before,
a.disabled .function.attention .icon:before {
color: #efefef;
}
.function.inactive {
border-color: #cacaca;
background-color: #cacaca;
}
.function.inactive .icon:before {
color: #414141;
}
.function.small {
width: 16px;
height: 16px;
padding: 7px;
}
.function.small .icon {
width: 16px;
height: 16px;
line-height: 16px;
}
.function.small .icon:before {
line-height: 16px;
font-size: 15px;
}
/* ======== IE upgrade warning ======== */
#ieWarn {
background: #ebebeb;
padding: 17px 17px 17px 40px;
}
#ieWarn p {
margin: 0;
font-size: 15px;
}
#ieWarn #ieWarning {
float: left;
padding-left: 63px;
background: url(/img/ieWarnAlert.png) top left no-repeat;
margin-top: 12px;
}
#ieWarn #ieRecos {
width: 350px;
padding-left: 20px;
margin-left: 25px;
border-left: 1px solid #cacaca;
float: right;
}
#ieWarn #ieRecos ul {
margin: 0;
padding: 0;
}
#ieWarn #ieRecos ul li {
float: left;
list-style: none;
font-size: 15px;
padding: 1px 0 2px 33px;
margin: 0;
background-image: url(/img/ieWarnBGs.png);
background-repeat: no-repeat;
}
#ieWarn ul li#downloadCR {
margin-bottom: 13px;
}
#ieWarn ul li#downloadIE {
background-position: 0 -22px;
margin-bottom: 13px;
margin-left: 23px;
}
#ieWarn ul li#downloadFF {
background-position: 0 -44px;
}
#ieWarn.clearfix:after {
clear: both;
}
#ieWarn.clearfix:before,
#ieWarn.clearfix:after {
content: " ";
display: table;
}
#ieWarn.clearfix:after {
clear: both;
}
/* ======== end ======== */
/* Force emona font for text-numeric */
.text-numeric {
font-family: "emona", serif !important;
}
/** STYLEGUIDE STYLES **/
/* Reset the box sizing for the new grid,
this CANNOT be set globally for everything under style-guide
because it breaks the icons and some other stuff
*/
.style-guide .column,
.style-guide .row,
.style-guide [class*="small-"],
.style-guide [class*="medium-"],
.style-guide [class*="large-"] {
box-sizing: border-box;
}
.style-guide .row {
/* max-width: 62.5rem; */
/* Because our base font size is 15, this must be changed to 80 rem */
max-width: 80rem;
margin-left: auto;
margin-right: auto;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-flow: row wrap;
-ms-flex-flow: row wrap;
flex-flow: row wrap;
}
.style-guide .row .row {
max-width: none;
}
.style-guide .row.expanded {
max-width: none;
}
.style-guide .row.collapse > .column,
.style-guide .row.collapse > .columns {
padding-left: 0;
padding-right: 0;
}
.style-guide .column,
.style-guide .columns {
-webkit-flex: 1 1 0px;
-ms-flex: 1 1 0px;
flex: 1 1 0px;
padding-left: 0.9375rem;
padding-right: 0.9375rem;
min-width: initial;
}
.style-guide .column.row.row,
.style-guide .row.row.columns {
float: none;
display: block;
}
.style-guide .row .column.row.row,
.style-guide .row .row.row.columns {
padding-left: 0;
padding-right: 0;
margin-left: 0;
margin-right: 0;
}
.style-guide .small-1 {
-webkit-flex: 0 0 8.33333%;
-ms-flex: 0 0 8.33333%;
flex: 0 0 8.33333%;
max-width: 8.33333%;
}
.style-guide .small-offset-0 {
margin-left: 0%;
}
.style-guide .small-2 {
-webkit-flex: 0 0 16.66667%;
-ms-flex: 0 0 16.66667%;
flex: 0 0 16.66667%;
max-width: 16.66667%;
}
.style-guide .small-offset-1 {
margin-left: 8.33333%;
}
.style-guide .small-3 {
-webkit-flex: 0 0 25%;
-ms-flex: 0 0 25%;
flex: 0 0 25%;
max-width: 25%;
}
.style-guide .small-offset-2 {
margin-left: 16.66667%;
}
.style-guide .small-4 {
-webkit-flex: 0 0 33.33333%;
-ms-flex: 0 0 33.33333%;
flex: 0 0 33.33333%;
max-width: 33.33333%;
}
.style-guide .small-offset-3 {
margin-left: 25%;
}
.style-guide .small-5 {
-webkit-flex: 0 0 41.66667%;
-ms-flex: 0 0 41.66667%;
flex: 0 0 41.66667%;
max-width: 41.66667%;
}
.style-guide .small-offset-4 {
margin-left: 33.33333%;
}
.style-guide .small-6 {
-webkit-flex: 0 0 50%;
-ms-flex: 0 0 50%;
flex: 0 0 50%;
max-width: 50%;
}
.style-guide .small-offset-5 {
margin-left: 41.66667%;
}
.style-guide .small-7 {
-webkit-flex: 0 0 58.33333%;
-ms-flex: 0 0 58.33333%;
flex: 0 0 58.33333%;
max-width: 58.33333%;
}
.style-guide .small-offset-6 {
margin-left: 50%;
}
.style-guide .small-8 {
-webkit-flex: 0 0 66.66667%;
-ms-flex: 0 0 66.66667%;
flex: 0 0 66.66667%;
max-width: 66.66667%;
}
.style-guide .small-offset-7 {
margin-left: 58.33333%;
}
.style-guide .small-9 {
-webkit-flex: 0 0 75%;
-ms-flex: 0 0 75%;
flex: 0 0 75%;
max-width: 75%;
}
.style-guide .small-offset-8 {
margin-left: 66.66667%;
}
.style-guide .small-10 {
-webkit-flex: 0 0 83.33333%;
-ms-flex: 0 0 83.33333%;
flex: 0 0 83.33333%;
max-width: 83.33333%;
}
.style-guide .small-offset-9 {
margin-left: 75%;
}
.style-guide .small-11 {
-webkit-flex: 0 0 91.66667%;
-ms-flex: 0 0 91.66667%;
flex: 0 0 91.66667%;
max-width: 91.66667%;
}
.style-guide .small-offset-10 {
margin-left: 83.33333%;
}
.style-guide .small-12 {
-webkit-flex: 0 0 100%;
-ms-flex: 0 0 100%;
flex: 0 0 100%;
max-width: 100%;
}
.style-guide .small-offset-11 {
margin-left: 91.66667%;
}
.style-guide .small-order-1 {
-webkit-order: 1;
-ms-flex-order: 1;
order: 1;
}
.style-guide .small-order-2 {
-webkit-order: 2;
-ms-flex-order: 2;
order: 2;
}
.style-guide .small-order-3 {
-webkit-order: 3;
-ms-flex-order: 3;
order: 3;
}
.style-guide .small-order-4 {
-webkit-order: 4;
-ms-flex-order: 4;
order: 4;
}
.style-guide .small-order-5 {
-webkit-order: 5;
-ms-flex-order: 5;
order: 5;
}
.style-guide .small-order-6 {
-webkit-order: 6;
-ms-flex-order: 6;
order: 6;
}
.style-guide .small-collapse > .column,
.style-guide .small-collapse > .columns {
padding-left: 0;
padding-right: 0;
}
.style-guide .small-uncollapse > .column,
.style-guide .small-uncollapse > .columns {
padding-left: 0.9375rem;
padding-right: 0.9375rem;
}
@media screen and (min-width: 40em) {
.style-guide .mobile-hide {
display: block !important;
}
.style-guide .desktop-hide {
display: none !important;
}
.style-guide .medium-1 {
-webkit-flex: 0 0 8.33333%;
-ms-flex: 0 0 8.33333%;
flex: 0 0 8.33333%;
max-width: 8.33333%;
}
.style-guide .medium-offset-0 {
margin-left: 0%;
}
.style-guide .medium-2 {
-webkit-flex: 0 0 16.66667%;
-ms-flex: 0 0 16.66667%;
flex: 0 0 16.66667%;
max-width: 16.66667%;
}
.style-guide .medium-offset-1 {
margin-left: 8.33333%;
}
.style-guide .medium-3 {
-webkit-flex: 0 0 25%;
-ms-flex: 0 0 25%;
flex: 0 0 25%;
max-width: 25%;
}
.style-guide .medium-offset-2 {
margin-left: 16.66667%;
}
.style-guide .medium-4 {
-webkit-flex: 0 0 33.33333%;
-ms-flex: 0 0 33.33333%;
flex: 0 0 33.33333%;
max-width: 33.33333%;
}
.style-guide .medium-offset-3 {
margin-left: 25%;
}
.style-guide .medium-5 {
-webkit-flex: 0 0 41.66667%;
-ms-flex: 0 0 41.66667%;
flex: 0 0 41.66667%;
max-width: 41.66667%;
}
.style-guide .medium-offset-4 {
margin-left: 33.33333%;
}
.style-guide .medium-6 {
-webkit-flex: 0 0 50%;
-ms-flex: 0 0 50%;
flex: 0 0 50%;
max-width: 50%;
}
.style-guide .medium-offset-5 {
margin-left: 41.66667%;
}
.style-guide .medium-7 {
-webkit-flex: 0 0 58.33333%;
-ms-flex: 0 0 58.33333%;
flex: 0 0 58.33333%;
max-width: 58.33333%;
}
.style-guide .medium-offset-6 {
margin-left: 50%;
}
.style-guide .medium-8 {
-webkit-flex: 0 0 66.66667%;
-ms-flex: 0 0 66.66667%;
flex: 0 0 66.66667%;
max-width: 66.66667%;
}
.style-guide .medium-offset-7 {
margin-left: 58.33333%;
}
.style-guide .medium-9 {
-webkit-flex: 0 0 75%;
-ms-flex: 0 0 75%;
flex: 0 0 75%;
max-width: 75%;
}
.style-guide .medium-offset-8 {
margin-left: 66.66667%;
}
.style-guide .medium-10 {
-webkit-flex: 0 0 83.33333%;
-ms-flex: 0 0 83.33333%;
flex: 0 0 83.33333%;
max-width: 83.33333%;
}
.style-guide .medium-offset-9 {
margin-left: 75%;
}
.style-guide .medium-11 {
-webkit-flex: 0 0 91.66667%;
-ms-flex: 0 0 91.66667%;
flex: 0 0 91.66667%;
max-width: 91.66667%;
}
.style-guide .medium-offset-10 {
margin-left: 83.33333%;
}
.style-guide .medium-12 {
-webkit-flex: 0 0 100%;
-ms-flex: 0 0 100%;
flex: 0 0 100%;
max-width: 100%;
}
.style-guide .medium-offset-11 {
margin-left: 91.66667%;
}
.style-guide .medium-order-1 {
-webkit-order: 1;
-ms-flex-order: 1;
order: 1;
}
.style-guide .medium-order-2 {
-webkit-order: 2;
-ms-flex-order: 2;
order: 2;
}
.style-guide .medium-order-3 {
-webkit-order: 3;
-ms-flex-order: 3;
order: 3;
}
.style-guide .medium-order-4 {
-webkit-order: 4;
-ms-flex-order: 4;
order: 4;
}
.style-guide .medium-order-5 {
-webkit-order: 5;
-ms-flex-order: 5;
order: 5;
}
.style-guide .medium-order-6 {
-webkit-order: 6;
-ms-flex-order: 6;
order: 6;
}
.style-guide .row.medium-unstack > .column,
.style-guide .row.medium-unstack > .columns {
-webkit-box-flex: 0;
-webkit-flex: 0 0 100%;
-ms-flex: 0 0 100%;
flex: 0 0 100%;
}
.style-guide .row.medium-unstack > .column,
.style-guide .row.medium-unstack > .columns {
-webkit-box-flex: 1;
-webkit-flex: 1 1 0px;
-ms-flex: 1 1 0px;
flex: 1 1 0px;
}
.style-guide .medium-collapse > .column,
.style-guide .medium-collapse > .columns {
padding-left: 0;
padding-right: 0;
}
.style-guide .medium-uncollapse > .column,
.style-guide .medium-uncollapse > .columns {
padding-left: 0.9375rem;
padding-right: 0.9375rem;
}
.style-guide .medium-shrink {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
max-width: 100%;
}
}
@media screen and (min-width: 64em) {
.style-guide .large-1 {
-webkit-flex: 0 0 8.33333%;
-ms-flex: 0 0 8.33333%;
flex: 0 0 8.33333%;
max-width: 8.33333%;
}
.style-guide .large-offset-0 {
margin-left: 0%;
}
.style-guide .large-2 {
-webkit-flex: 0 0 16.66667%;
-ms-flex: 0 0 16.66667%;
flex: 0 0 16.66667%;
max-width: 16.66667%;
}
.style-guide .large-offset-1 {
margin-left: 8.33333%;
}
.style-guide .large-3 {
-webkit-flex: 0 0 25%;
-ms-flex: 0 0 25%;
flex: 0 0 25%;
max-width: 25%;
}
.style-guide .large-offset-2 {
margin-left: 16.66667%;
}
.style-guide .large-4 {
-webkit-flex: 0 0 33.33333%;
-ms-flex: 0 0 33.33333%;
flex: 0 0 33.33333%;
max-width: 33.33333%;
}
.style-guide .large-offset-3 {
margin-left: 25%;
}
.style-guide .large-5 {
-webkit-flex: 0 0 41.66667%;
-ms-flex: 0 0 41.66667%;
flex: 0 0 41.66667%;
max-width: 41.66667%;
}
.style-guide .large-offset-4 {
margin-left: 33.33333%;
}
.style-guide .large-6 {
-webkit-flex: 0 0 50%;
-ms-flex: 0 0 50%;
flex: 0 0 50%;
max-width: 50%;
}
.style-guide .large-offset-5 {
margin-left: 41.66667%;
}
.style-guide .large-7 {
-webkit-flex: 0 0 58.33333%;
-ms-flex: 0 0 58.33333%;
flex: 0 0 58.33333%;
max-width: 58.33333%;
}
.style-guide .large-offset-6 {
margin-left: 50%;
}
.style-guide .large-8 {
-webkit-flex: 0 0 66.66667%;
-ms-flex: 0 0 66.66667%;
flex: 0 0 66.66667%;
max-width: 66.66667%;
}
.style-guide .large-offset-7 {
margin-left: 58.33333%;
}
.style-guide .large-9 {
-webkit-flex: 0 0 75%;
-ms-flex: 0 0 75%;
flex: 0 0 75%;
max-width: 75%;
}
.style-guide .large-offset-8 {
margin-left: 66.66667%;
}
.style-guide .large-10 {
-webkit-flex: 0 0 83.33333%;
-ms-flex: 0 0 83.33333%;
flex: 0 0 83.33333%;
max-width: 83.33333%;
}
.style-guide .large-offset-9 {
margin-left: 75%;
}
.style-guide .large-11 {
-webkit-flex: 0 0 91.66667%;
-ms-flex: 0 0 91.66667%;
flex: 0 0 91.66667%;
max-width: 91.66667%;
}
.style-guide .large-offset-10 {
margin-left: 83.33333%;
}
.style-guide .large-12 {
-webkit-flex: 0 0 100%;
-ms-flex: 0 0 100%;
flex: 0 0 100%;
max-width: 100%;
}
.style-guide .large-offset-11 {
margin-left: 91.66667%;
}
.style-guide .large-order-1 {
-webkit-order: 1;
-ms-flex-order: 1;
order: 1;
}
.style-guide .large-order-2 {
-webkit-order: 2;
-ms-flex-order: 2;
order: 2;
}
.style-guide .large-order-3 {
-webkit-order: 3;
-ms-flex-order: 3;
order: 3;
}
.style-guide .large-order-4 {
-webkit-order: 4;
-ms-flex-order: 4;
order: 4;
}
.style-guide .large-order-5 {
-webkit-order: 5;
-ms-flex-order: 5;
order: 5;
}
.style-guide .large-order-6 {
-webkit-order: 6;
-ms-flex-order: 6;
order: 6;
}
.style-guide .large-collapse > .column,
.style-guide .large-collapse > .columns {
padding-left: 0;
padding-right: 0;
}
.style-guide .large-uncollapse > .column,
.style-guide .large-uncollapse > .columns {
padding-left: 0.9375rem;
padding-right: 0.9375rem;
}
.style-guide .large-shrink {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
max-width: 100%;
}
}
.style-guide .shrink {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
max-width: 100%;
}
.style-guide .column.align-top,
.style-guide .align-top.columns {
-webkit-align-self: flex-start;
-ms-flex-item-align: start;
align-self: flex-start;
}
.style-guide .column.align-bottom,
.style-guide .align-bottom.columns {
-webkit-align-self: flex-end;
-ms-flex-item-align: end;
align-self: flex-end;
}
.style-guide .column.align-middle,
.style-guide .align-middle.columns {
-webkit-align-self: center;
-ms-flex-item-align: center;
align-self: center;
}
.style-guide .column.align-stretch,
.style-guide .align-stretch.columns {
-webkit-align-self: stretch;
-ms-flex-item-align: stretch;
align-self: stretch;
}
.style-guide .align-right {
-webkit-justify-content: flex-end;
-ms-flex-pack: end;
justify-content: flex-end;
}
.style-guide .align-center {
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
}
.style-guide .align-justify {
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
}
.style-guide .align-spaced {
-webkit-justify-content: space-around;
-ms-flex-pack: distribute;
justify-content: space-around;
}
.style-guide .align-top {
-webkit-align-items: flex-start;
-ms-flex-align: start;
align-items: flex-start;
}
.style-guide .align-self-top {
-webkit-align-self: flex-start;
-ms-flex-item-align: start;
align-self: flex-start;
}
.style-guide .align-bottom {
-webkit-align-items: flex-end;
-ms-flex-align: end;
align-items: flex-end;
}
.style-guide .align-self-bottom {
-webkit-align-self: flex-end;
-ms-flex-item-align: end;
align-self: flex-end;
}
.style-guide .align-middle {
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}
.style-guide .align-self-middle {
-webkit-align-self: center;
-ms-flex-item-align: center;
align-self: center;
}
.style-guide .align-stretch {
-webkit-align-items: stretch;
-ms-flex-align: stretch;
align-items: stretch;
}
.style-guide .align-self-stretch {
-webkit-align-self: stretch;
-ms-flex-item-align: stretch;
align-self: stretch;
}
.style-guide .small-order-1 {
-webkit-order: 1;
-ms-flex-order: 1;
order: 1;
}
.style-guide .small-order-2 {
-webkit-order: 2;
-ms-flex-order: 2;
order: 2;
}
.style-guide .small-order-3 {
-webkit-order: 3;
-ms-flex-order: 3;
order: 3;
}
.style-guide .small-order-4 {
-webkit-order: 4;
-ms-flex-order: 4;
order: 4;
}
.style-guide .small-order-5 {
-webkit-order: 5;
-ms-flex-order: 5;
order: 5;
}
.style-guide .small-order-6 {
-webkit-order: 6;
-ms-flex-order: 6;
order: 6;
}
@media screen and (min-width: 40em) {
.style-guide .medium-order-1 {
-webkit-order: 1;
-ms-flex-order: 1;
order: 1;
}
.style-guide .medium-order-2 {
-webkit-order: 2;
-ms-flex-order: 2;
order: 2;
}
.style-guide .medium-order-3 {
-webkit-order: 3;
-ms-flex-order: 3;
order: 3;
}
.style-guide .medium-order-4 {
-webkit-order: 4;
-ms-flex-order: 4;
order: 4;
}
.style-guide .medium-order-5 {
-webkit-order: 5;
-ms-flex-order: 5;
order: 5;
}
.style-guide .medium-order-6 {
-webkit-order: 6;
-ms-flex-order: 6;
order: 6;
}
}
@media screen and (min-width: 64em) {
.style-guide .large-order-1 {
-webkit-order: 1;
-ms-flex-order: 1;
order: 1;
}
.style-guide .large-order-2 {
-webkit-order: 2;
-ms-flex-order: 2;
order: 2;
}
.style-guide .large-order-3 {
-webkit-order: 3;
-ms-flex-order: 3;
order: 3;
}
.style-guide .large-order-4 {
-webkit-order: 4;
-ms-flex-order: 4;
order: 4;
}
.style-guide .large-order-5 {
-webkit-order: 5;
-ms-flex-order: 5;
order: 5;
}
.style-guide .large-order-6 {
-webkit-order: 6;
-ms-flex-order: 6;
order: 6;
}
}
.style-guide .small-border-top {
border-top: .0666rem solid #cacaca;
}
.style-guide .small-border-right {
border-right: .0666rem solid #cacaca;
}
.style-guide .small-border-bottom {
border-bottom: .0666rem solid #cacaca;
}
.style-guide .small-border-left {
border-left: .0666rem solid #cacaca;
}
.style-guide .small-reset-border-top {
border-top: none;
}
.style-guide .small-reset-border-right {
border-right: none;
}
.style-guide .small-reset-border-bottom {
border-bottom: none;
}
.style-guide .small-reset-border-left {
border-left: none;
}
@media all and (min-width: 40em) {
.style-guide .medium-border-top {
border-top: .0666rem solid #cacaca;
}
.style-guide .medium-border-right {
border-right: .0666rem solid #cacaca;
}
.style-guide .medium-border-bottom {
border-bottom: .0666rem solid #cacaca;
}
.style-guide .medium-border-left {
border-left: .0666rem solid #cacaca;
}
.style-guide .medium-reset-border-top {
border-top: none;
}
.style-guide .medium-reset-border-right {
border-right: none;
}
.style-guide .medium-reset-border-bottom {
border-bottom: none;
}
.style-guide .medium-reset-border-left {
border-left: none;
}
}
@media all and ( min-width: 64em ) {
.style-guide .large-border-top {
border-top: .0666rem solid #cacaca;
}
.style-guide .large-border-right {
border-right: .0666rem solid #cacaca;
}
.style-guide .large-border-bottom {
border-bottom: .0666rem solid #cacaca;
}
.style-guide .large-border-left {
border-left: .0666rem solid #cacaca;
}
.style-guide .large-reset-border-top {
border-top: none;
}
.style-guide .large-reset-border-right {
border-right: none;
}
.style-guide .large-reset-border-bottom {
border-bottom: none;
}
.style-guide .large-reset-border-left {
border-left: none;
}
}
.style-guide .align-start {
-webkit-align-self: flex-start;
-moz-align-self: flex-start;
-ms-align-self: flex-start;
align-self: flex-start;
}
/* re-define chevron link styles */
.style-guide .link {
padding: 0 34px 0 0;
font-size: inherit;
}
.style-guide .chevron:hover,
.style-guide .chevron:focus,
.style-guide .chevron.active {
padding: 0 21px 1px 0;
}
.style-guide .chevron:before {
width: 16px;
height: 16px;
margin: -8px 0 0;
font-size: 10px;
}
/* fix horizontal padding on mobile */
@media (max-width:767px) {
.style-guide section > .copy {
padding-left: 0;
padding-right: 0;
}
}
.style-guide .color-text {
color: #414141;
}
.style-guide .text-left {
text-align: left;
}
.style-guide .text-center {
text-align: center;
}
.style-guide .text-right {
text-align: right;
}
.style-guide .small-text-left {
text-align: left;
}
.style-guide .small-text-center {
text-align: center;
}
.style-guide .small-text-right {
text-align: right;
}
@media all and (min-width: 40em) {
.style-guide .medium-text-left {
text-align: left;
}
.style-guide .medium-text-center {
text-align: center;
}
.style-guide .medium-text-right {
text-align: right;
}
}
@media all and ( min-width: 64em ) {
.style-guide .large-text-left {
text-align: left;
}
.style-guide .large-text-center {
text-align: center;
}
.style-guide .large-text-right {
text-align: right;
}
}
/* small displays */
.style-guide .show-for-small-only,
.style-guide .show-for-small-up,
.style-guide .show-for-small,
.style-guide .show-for-small-down,
.style-guide .hide-for-medium-only,
.style-guide .hide-for-medium-up,
.style-guide .hide-for-medium,
.style-guide .show-for-medium-down,
.style-guide .hide-for-large-only,
.style-guide .hide-for-large-up,
.style-guide .hide-for-large,
.style-guide .show-for-large-down {
display: inherit !important;
}
.style-guide .hide-for-small-only,
.style-guide .hide-for-small-up,
.style-guide .hide-for-small,
.style-guide .hide-for-small-down,
.style-guide .show-for-medium-only,
.style-guide .show-for-medium-up,
.style-guide .show-for-medium,
.style-guide .hide-for-medium-down,
.style-guide .show-for-large-only,
.style-guide .show-for-large-up,
.style-guide .show-for-large,
.style-guide .hide-for-large-down {
display: none !important;
}
/* medium displays */
@media all and (min-width: 40em) {
.style-guide .hide-for-small-only,
.style-guide .show-for-small-up,
.style-guide .hide-for-small,
.style-guide .hide-for-small-down,
.style-guide .show-for-medium-only,
.style-guide .show-for-medium-up,
.style-guide .show-for-medium,
.style-guide .show-for-medium-down,
.style-guide .hide-for-large-only,
.style-guide .hide-for-large-up,
.style-guide .hide-for-large,
.style-guide .show-for-large-down {
display: inherit !important;
}
.style-guide .show-for-small-only,
.style-guide .hide-for-small-up,
.style-guide .show-for-small,
.style-guide .show-for-small-down,
.style-guide .hide-for-medium-only,
.style-guide .hide-for-medium-up,
.style-guide .hide-for-medium,
.style-guide .hide-for-medium-down,
.style-guide .show-for-large-only,
.style-guide .show-for-large-up,
.style-guide .show-for-large,
.style-guide .hide-for-large-down {
display: none !important;
}
}
/* large displays */
@media all and (min-width: 64em) {
.style-guide .hide-for-small-only,
.style-guide .show-for-small-up,
.style-guide .hide-for-small,
.style-guide .hide-for-small-down,
.style-guide .hide-for-medium-only,
.style-guide .show-for-medium-up,
.style-guide .hide-for-medium,
.style-guide .hide-for-medium-down,
.style-guide .show-for-large-only,
.style-guide .show-for-large-up,
.style-guide .show-for-large,
.style-guide .show-for-large-down {
display: inherit !important;
}
.style-guide .show-for-small-only,
.style-guide .hide-for-small-up,
.style-guide .show-for-small,
.style-guide .show-for-small-down,
.style-guide .show-for-medium-only,
.style-guide .hide-for-medium-up,
.style-guide .show-for-medium,
.style-guide .show-for-medium-down,
.style-guide .hide-for-large-only,
.style-guide .hide-for-large-up,
.style-guide .hide-for-large,
.style-guide .hide-for-large-down {
display: none !important;
}
}
/** END STYLEGUIDE STYLES **/