/* imports */

    /* global vars */

/* element vars */

/* match container_padding */

/* make sure scale resolves to a whole number to avoid UA clipping. */
/* using 'em' units caused blurry and shaky text when the 'em' resolved to fractional pixels */
/* required by _input-invalid.css */
/* can calculate by hand but easier to use trial and error via dev tools to get exact size */
    /* import _fonts.css FIRST */
@font-face
{
    font-display: swap;
    font-family: 'Lato';
    font-style: normal;
    font-weight: 400;

    src: url( '/assets/img/www/main/fonts/lato-v24-latin-regular.woff2' ) format( 'woff2' ),
         url( '/assets/img/www/main/fonts/lato-v24-latin-regular.woff' ) format( 'woff' ),
         url( '/assets/img/www/main/fonts/lato-v24-latin-regular.ttf' ) format( 'truetype' );
}

@font-face
{
    font-display: swap;
    font-family: 'Lato';
    font-style: normal;
    font-weight: 700;

    src: url( '/assets/img/www/main/fonts/lato-v24-latin-700.woff2' ) format( 'woff2' ),
         url( '/assets/img/www/main/fonts/lato-v24-latin-700.woff' ) format( 'woff' ),
         url( '/assets/img/www/main/fonts/lato-v24-latin-700.ttf' ) format( 'truetype' );
}

@font-face
{
    font-display: swap;
    font-family: 'Lato';
    font-style: normal;
    font-weight: 900;

    src: url( '/assets/img/www/main/fonts/lato-v24-latin-900.woff2' ) format( 'woff2' ),
         url( '/assets/img/www/main/fonts/lato-v24-latin-900.woff' ) format( 'woff' ),
         url( '/assets/img/www/main/fonts/lato-v24-latin-900.ttf' ) format( 'truetype' );
}

@font-face
{
    font-display: swap;
    font-family: 'Lato';
    font-style: italic;
    font-weight: 400;

    src: url( '/assets/img/www/main/fonts/lato-v24-latin-italic.woff2' ) format( 'woff2' ),
         url( '/assets/img/www/main/fonts/lato-v24-latin-italic.woff' ) format( 'woff' ),
         url( '/assets/img/www/main/fonts/lato-v24-latin-italic.ttf' ) format( 'truetype' );
}

@font-face
{
    font-display: swap;
    font-family: 'Lato';
    font-style: italic;
    font-weight: 700;

    src: url( '/assets/img/www/main/fonts/lato-v24-latin-700italic.woff2' ) format( 'woff2' ),
         url( '/assets/img/www/main/fonts/lato-v24-latin-700italic.woff' ) format( 'woff' ),
         url( '/assets/img/www/main/fonts/lato-v24-latin-700italic.ttf' ) format( 'truetype' );
}

@font-face
{
    font-display: swap;
    font-family: 'Lato';
    font-style: italic;
    font-weight: 900;

    src: url( '/assets/img/www/main/fonts/lato-v24-latin-900italic.woff2' ) format( 'woff2' ),
         url( '/assets/img/www/main/fonts/lato-v24-latin-900italic.woff' ) format( 'woff' ),
         url( '/assets/img/www/main/fonts/lato-v24-latin-900italic.ttf' ) format( 'truetype' );
}
/*
    Add Toggle functionality to a page in a very generic way.
    Although nested Toggles are supported by this file's
    Javascript counterpart, the CSS below does NOT!
*/

/*.Toggle
{
    cursor: pointer;
}*/

.Toggle__container--nojs .Toggle__content,
.Toggle--active .Toggle__content/*,
.Toggle--active + .Toggle__content*/
{
    display: block;
}

.Toggle__content
{
    display: none;
}
/**
 * This file is not part of the official html5shiv.js shim!
 * 
 * It has been added for non-IE browsers lacking HTML5 support
 * since the shim is conditionally loaded for IE browsers and we need to
 * style block level HTML5 elements.
 */

article   ,
aside     ,
dialog    ,
figcaption,
figure    ,
footer    ,
header    ,
hgroup    ,
main      ,
menu      ,
nav       ,
section
{
	display: block;
}.align-items--center
{
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}

.align-items--flex-start
{
    -ms-flex-align: start;
    -webkit-align-items: flex-start;
    align-items: flex-start;
}
.flex
{
    /*display: -moz-box;*/

display: -ms-flexbox;

/*display: -webkit-box;*/
display: -webkit-flex;

display: flex;}

/* justify-content--center equivalent for flex containers that overflow */
.flex-center--x > :first-child
{
    margin-left: auto;
}

/* justify-content--center equivalent for flex containers that overflow */
.flex-center--x > :last-child
{
    margin-right: auto;
}

.flex-direction--column
{
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;
}

.flex-wrap--wrap
{
    -ms-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
}
.justify-content--between
{
    -ms-flex-pack: justify;
    -webkit-justify-content: space-between;
    justify-content: space-between;
}

.justify-content--center
{
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
}

.justify-content--end
{
    -ms-flex-pack: end;
    -webkit-justify-content: flex-end;
    justify-content: flex-end;
}
.mobile-overflow
{
	overflow: auto;
	/* IE8 shows the scrollbar! */
	overflow: visible\9;

	-webkit-overflow-scrolling: touch;
}/*
	General class that resets mulitple styles of various elements even though
	some styles may not apply to some of the affected elements.
*/

.reset
{
	*border-collapse: collapse;
	border-spacing: 0;
	border-width: 0;

	list-style: none;
	margin: 0;
	padding: 0;
}/*
	Tame superscripts
*/

sup
{
	font-size: 75%;
	line-height: 0;
}.responsive
{
    display: block;
    height: 100%;
    width: 100%;
}

.responsive--fluid-width
{
    height: auto;
    max-width: 100%;
}

.responsive--height
{
    display: block;
    height: 100%;
    width: auto;
}

.responsive--width
{
    display: block;
    height: auto;
    width: 100%;
}
.standout-text--blend
{
    color: inherit;

    font-size: 1em;
    font-style: inherit;
    font-weight: inherit;

    text-align: inherit;
    text-decoration: inherit;
    text-transform: inherit;
}

.standout-text--bottom
{
    vertical-align: bottom;
}

.standout-text--center
{
    text-align: center;
}

.standout-text--dots
{
         overflow: hidden;
text-overflow: ellipsis;
  white-space: nowrap;}

.standout-text--em
{
    font-style: italic;
}

.standout-text--fat
{
    font-weight: bolder;
}

.standout-text--left
{
    text-align: left;
}

.standout-text--loud
{
    text-transform: uppercase;
}

.standout-text--middle
{
    vertical-align: middle;
}

.standout-text--nogap
{
    line-height: 0;
}

.standout-text--nostep
{
    text-decoration: none;
}

.standout-text--nowrap
{
    white-space: nowrap;
}

.standout-text--right
{
    text-align: right;
}

.standout-text--spaced
{
    letter-spacing: .25em;
}

.standout-text--step
{
    text-decoration: underline;
}

.standout-text--strike
{
    text-decoration: line-through;
}

.standout-text--thin
{
    font-weight: lighter;
}

.standout-text--top
{
    vertical-align: top;
}
.ada-focus-within       :focus, .ada-focus:focus       { outline: 2px dashed; }
.ada-focus-within--thin :focus, .ada-focus--thin:focus { outline: 1px dashed; }

.ada-focus-within--inset      :focus, .ada-focus--inset:focus      { outline-offset: -2px; }
.ada-focus-within--inset-thin :focus, .ada-focus--inset-thin:focus { outline-offset: -1px; }

.ada-focus-within :active,
.ada-focus-within :hover,
.ada-focus:active,
.ada-focus:hover
{
	outline: 0;
}

.ada-focus-within--bright :focus, .ada-focus--bright:focus { outline-color: #DC3545; }
.ada-focus-within--dull   :focus, .ada-focus--dull:focus   { outline-color: #343A40; }
/*
	@link https://a11yproject.com/posts/how-to-hide-content/
	@link https://css-tricks.com/places-its-tempting-to-use-display-none-but-dont/
	@link https://github.com/h5bp/html5-boilerplate/blob/master/dist/css/main.css
	@link https://snook.ca/archives/html_and_css/hiding-content-for-accessibility
*/
.ada-hide
{
	border: 0 !important;
	clip: rect(0 0 0 0);
	height: 1px;
	margin: -1px !important;
	overflow: hidden;
	padding: 0 !important;
	position: absolute !important;
	width: 1px;
	white-space: nowrap;
}

.ada-hide--focusable:active,
.ada-hide--focusable:focus
{
	height: auto;
	margin: auto !important;
	overflow: visible;
	position: static !important;
	width: auto;
	white-space: normal;
}
.ada-skip--fixed
{
	left: 0;
	position: fixed;
	right: 0;
}
.ada-skip__item--center
{
	display: block;

	padding: 1em !important;

	text-align: center;
}
/* all files in partials (not recursive) */
#main-ads__slogan
{
    font-size: 3.3em;
}
#modal-menu
{
    top: 107px;

    z-index: 3;
}
#modal-menu__content
{
    -moz-transform: translateX(-100%);
    -ms-transform: translateX(-100%);
    -o-transform: translateX(-100%);
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
}

#modal-menu.modal--on #modal-menu__content
{
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    -webkit-transform: none;
    transform: none;
    -moz-transition: transform 0.375s cubic-bezier(0.4, 0, 0.2, 1);
    -o-transition: transform 0.375s cubic-bezier(0.4, 0, 0.2, 1);
    -webkit-transition: transform 0.375s cubic-bezier(0.4, 0, 0.2, 1);
    transition: transform 0.375s cubic-bezier(0.4, 0, 0.2, 1);
}
#modal-menu__ctas
{
    display: none;
}
#modal-menu__search
{
    font-size: .9em;
}
.main-tile__content
{
    padding: 3.6em 5em 4.5em;
}
.main-tile__header
{
    height: 204px;
}
.modal-menu__innerlist
{
    padding-bottom: 0.6em;
}
.modal-menu__link
{
    color: #333335;
    display: block;

    font-size: 1.2em;
    font-weight: bold;

    padding: .5em 0;

    text-decoration: none;
}

.modal-menu__link--button
{
    background: 0;
    cursor: pointer;
    font-family: 'Lato', sans-serif;
    position: relative;
    width: 100%;
}

.modal-menu__link--button:after,
.modal-menu__link--button:before
{
    border-left: 1px solid #333335;
    border-top: 1px solid #333335;

    content: '';

    height: 10px;

    position: absolute;
    
    right: 10px;

    -moz-transform: translateY( -9px ) rotate( -135deg );
    -ms-transform: translateY( -9px ) rotate( -135deg );
    -o-transform: translateY( -9px ) rotate( -135deg );
    -webkit-transform: translateY( -9px ) rotate( -135deg );
    transform: translateY( -9px ) rotate( -135deg );

    top: 50%;

    width: 10px;
}

.Toggle--active .modal-menu__link--button:after,
.Toggle--active .modal-menu__link--button:before
{
    -moz-transform: translateY( -2px ) rotate( 45deg );
    -ms-transform: translateY( -2px ) rotate( 45deg );
    -o-transform: translateY( -2px ) rotate( 45deg );
    -webkit-transform: translateY( -2px ) rotate( 45deg );
    transform: translateY( -2px ) rotate( 45deg );
}

.modal-menu__link--button:hover,
.modal-menu__link--on
{
    text-decoration: underline; /* match a:hover */
}

.modal-menu__link--innerlist
{
    font-size: .8em;
    padding: .5em;
}
.modal-menu__outerlist-item
{
    border-bottom: 1px solid #D0D2D3;
}
.modal__content
{
    background-color: #FFFFFF;

    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;

    max-height: 100%;

    overflow: auto;

    padding: 4em 4em;

    /* for .modal__close--icon */
    position: relative;

    width: 100%;
}

.modal__content--fancy
{
    -moz-transform: scale(0, 0);
    -ms-transform: scale(0, 0);
    -o-transform: scale(0, 0);
    -webkit-transform: scale(0, 0);
    transform: scale(0, 0);
    -moz-transition: transform .3s;
    -o-transition: transform .3s;
    -webkit-transition: transform .3s;
    transition: transform .3s;
}

.modal--on .modal__content--fancy
{
    -moz-transform: scale(1, 1);
    -ms-transform: scale(1, 1);
    -o-transform: scale(1, 1);
    -webkit-transform: scale(1, 1);
    transform: scale(1, 1);
}

    .modal__content--isophobic
    {
        padding-bottom: 3.5em;
        padding-top: 3.5em;
    }

.modal__content--slim
{
    max-width: 800px;
}

.modal__content--slimmer
{
    max-width: 600px;
}

.modal__content--transparent
{
    background: none;
}
script[ data-lazy-src ]
{
    display: block;
}

script[ data-lazy-src ][ src ]
{
    display: none;
}
#footer-legal
{
    margin-top: 3em;
}
#footer-logo
{
    height: 70px;
    width: 272px;
}
#footer-logo__link
{
    color: #333335;
}
#footer
{
    font-size: 1em;

    margin-top: 4em;
    padding-bottom: 3em;
}
#hamburger
{
    width: 19px;
}
#hamburger__link
{
    /*display: -moz-box;*/

display: -ms-flexbox;

/*display: -webkit-box;*/
display: -webkit-flex;

display: flex;}
#hamburger__patty,
#hamburger__patty:after,
#hamburger__patty:before
{
    background-color: #FFFFFF;

    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;

    content: '';

    height: 2px;

    position: absolute;

    -moz-transition: top       .15s 0.225s,
                transform .15s;
    -o-transition: top       .15s 0.225s,
                transform .15s;
    -webkit-transition: top       .15s 0.225s,
                transform .15s;
    transition: top       .15s 0.225s,
                transform .15s;

    width: 19px;
}

#hamburger__patty
{
    margin-top: -1px;
    top: 50%;
}

#hamburger__patty:after
{
    top: 6px;
}

#hamburger__patty:before
{
    top: -6px;
}

.hamburger--on #hamburger__patty,
.hamburger--on #hamburger__patty:after,
.hamburger--on #hamburger__patty:before
{
    -moz-transform: rotate( 45deg );
    -ms-transform: rotate( 45deg );
    -o-transform: rotate( 45deg );
    -webkit-transform: rotate( 45deg );
    transform: rotate( 45deg );

    -moz-transition-delay: 0s, 0.225s;
    -o-transition-delay: 0s, 0.225s;
    -webkit-transition-delay: 0s, 0.225s;
    transition-delay: 0s, 0.225s;
}

.hamburger--on #hamburger__patty:after,
.hamburger--on #hamburger__patty:before
{
    top: 0;

    -moz-transform: rotate( -90deg );
    -ms-transform: rotate( -90deg );
    -o-transform: rotate( -90deg );
    -webkit-transform: rotate( -90deg );
    transform: rotate( -90deg );
}
#hamburger__text
{
    margin-right: 1em;
}
#header
{
    border-bottom: 1px solid #D0D2D3;

    font-size: 1em;

    left: 0;

    padding-bottom: .9em;
    padding-top: .9em;

    position: fixed;

    right: 0;
    top: 0;

    z-index: 3;
}
#logo__link
{
    color: #333335;

    display: block;

    height: 70px;

    margin: auto;

    width: 272px;

    z-index: 2;
}
#main-ads
{
    margin: 4.25em 0;
}
#main-header
{
    padding-bottom: 3em;
    padding-top: 3em;
}
#main-header__slogan
{
    font-size: 1.1em;
}
#main-header__title
{
    color: #153165;
    font-size: 3em;
}

#main-header__title > span
{
    color: #1E42A5;
}
#main-strips
{
    padding-bottom: 4.5em;
    padding-top: 5em;
}
#main-strips__title
{
    color: #153165;
    font-size: 2.1em;
}
#main
{
    font-size: 1em;

    /*overflow: auto;*/

    padding-top: 107px;
}
#modal-apply
{
    z-index: 8;
}
#modal-apply__link
{
    filter: alpha( opacity=60);
    opacity: .6;
}

#modal-apply__link[href]
{
    filter: alpha( opacity=100);
    opacity: 1;
}
#modal-confirm
{
    z-index: 9;
}
#modal-iframe
{
    z-index: 7;
}
#modal-login
{
    z-index: 5;
}
#modal-video
{
    z-index: 6;
}
#nav
{
    bottom: 0;

    font-size: 1em;

    left: 0;

    position: absolute;

    right: 0;
    top: 0;

    z-index: 1;
}
#reviews
{
    font-size: 1em;

    padding-bottom: 4em;
    padding-top: 5em;
}
#reviews__title
{
    font-size: 2.1em;
}
#reviews__content
{
    padding: 5em;
}
#social
{
    margin-top: .75em;
}
.SlideShow__menu-button
{
    background: none;
    border: 0;

    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;

    color: #FFFFFF;

    cursor: pointer;

    display: block;

    height: 38px;

    padding: 17px 7px;

    width: 38px;
}

.SlideShow__menu-button--next,
.SlideShow__menu-button--previous
{
    background-color: #F2C318;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;

    color: #153165;

    padding: 10px 14px;
}

.SlideShow__menu-button--pause
{
    padding: 12px 13px;
}

.SlideShow__menu-button > span
{
    border-color: #FFFFFF;
    border-style: solid;
    border-width: 4px 0 0;

    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;

    display: block;

    height: 100%;

    -moz-transition: border-color .8s;
    -o-transition: border-color .8s;
    -webkit-transition: border-color .8s;
    transition: border-color .8s;
}

.SlideShow__menu-button.SlideShow--on > span
{
    border-color: #F2C318;
}

.SlideShow__menu-button--pause > span
{
    border-color: #F2C318;
    border-width: 0 4px;

    -moz-transition: none;
    -o-transition: none;
    -webkit-transition: none;
    transition: none;
}

.SlideShow__menu-button--pause.SlideShow--on > span
{
    border-color: transparent transparent transparent #F2C318;
    border-width: 7px 0 7px 12px;
}

.SlideShow__menu-button--next > span,
.SlideShow__menu-button--previous > span
{
    background-image: url( '/assets/img/www/main/icons/composite.svg' );
    background-repeat: no-repeat;
    background-position: -160px;

    border: 0;
}

.SlideShow__menu-button--previous > span
{
    background-position: -140px;
}
.SlideShow__menu-item--next
{
    -ms-flex-order: 2;
    -webkit-order: 2;
    order: 2;
}

.SlideShow__menu-item--previous
{
    margin-left: 14px;
    margin-right: 14px;

    -ms-flex-order: 1;
    -webkit-order: 1;
    order: 1;
}
.SlideShow__menu
{
    /* remove ugly highlight color when clicking menu items */
    -webkit-tap-highlight-color: transparent;
}
.SlideShow__slide
{
    /*
        fixes iOS bug where the bottom of each image 'settles' down at the end
        of the transition

        NOTE: Only fixes settling when overflow: hidden is NOT set!
        NOTE: But, we prefer to fix the content ghosting so overflow: hidden remains.
    */
    /*-webkit-backface-visibility: hidden;*/

    /* hide all but the active slide */
    height: 0;

    opacity /* $no_alias */: 0;

    /* avoid ghosting of text between transitions */
    overflow: hidden;

    -moz-transition: opacity .8s;
    -o-transition: opacity .8s;
    -webkit-transition: opacity .8s;
    transition: opacity .8s;

    visibility: hidden;
}

.SlideShow--on
{
    height: auto;

    opacity /* $no_alias */: 1;

    visibility: visible;
}
.ada-skip--fixed
{
    z-index: 4;
}
.block--accent-lapis-left
{
    border-left-color: #0071B9;
    border-left-style: solid;
    border-left-width: 15px;
}

.block--accent-lapis-right
{
    border-right-color: #0071B9;
    border-right-style: solid;
    border-right-width: 15px;
}

.block--black
{
    background-color: #333335;
    color: #FFFFFF;
}

.block--blue
{
    background-color: #1E42A5;
    color: #FFFFFF;
}

.block--gold
{
    background-color: #F2C318;
    color: #333335;
}

.block--gold-light
{
    background-color: #FFD331;
    color: #333335;
}

.block--heather
{
    background-color: #F7F5F3;
    color: #333335;
}

.block--lapis
{
    background-color: #0071B9;
    color: #FFFFFF;
}

.block--navy
{
    background-color: #153165;
    color: #FFFFFF;
}

.block--teal
{
    background-color: #00857E;
    color: #FFFFFF;
}

.block--white
{
    background-color: #FFFFFF;
    color: #333335;
}
.btn
{
    border: 2px solid;
    -moz-border-radius: 24px;
    -webkit-border-radius: 24px;
    border-radius: 24px;

    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;

    /* for non-anchor elements */
    cursor: pointer;

    display: inline-block;

    /* needed for elems whose font is set by UA's (e.g. submit buttons)*/
    font: 18px/44px 'Lato', sans-serif;
    font-weight: bold;

    padding: 0 30px;

    /* !important for a:hover */
    text-decoration: none !important;

    -moz-transition: background-color .3s,
                border-color .3s;
    -o-transition: background-color .3s,
                border-color .3s;
    -webkit-transition: background-color .3s,
                border-color .3s;
    transition: background-color .3s,
                border-color .3s;
}

.btn--black,
.btn--black-hover:focus,
.btn--black-hover:hover
{
    background-color: #333335;
    border-color: #153165;
    color: #FFFFFF;
}

.btn--block
{
    display: block; /* reset .btn */

    /* Some elems (i.e. button) do not expand fully w/ display: block.
       We think UA defaults are the cause.
    */
    width: 100%;
}

.btn--blue/*,*/
/*.btn--blue-hover:focus,*/
/*.btn--blue-hover:hover*/
{
    background-color: #1E42A5;
    border-color: #153165;
    color: #FFFFFF;
}

.btn--blue-inverse/*,*/
/*.btn--blue-inverse-hover:focus,*/
/*.btn--blue-inverse-hover:hover*/
{
    background-color: #FFFFFF;
    border-color: #153165; 
    color: #1E42A5;
}

.btn--min-height
{
    min-height: 48px;   
}

.btn--min-width
{
    min-width: 138px;   
}

.btn--navy,
.btn--navy-hover:focus,
.btn--navy-hover:hover
{
    background-color: #153165;
    border-color: #153165;
    color: #FFFFFF;
}

.btn--navy-inverse/*,*/
/*.btn--navy-inverse-hover:focus,*/
/*.btn--navy-inverse-hover:hover*/
{
    background-color: #FFFFFF;
    border-color: #153165; 
    color: #153165;
}

.btn--short
{
    line-height: 40px;
}

.btn--sibling
{
    margin: .5em .5em;
}
.btn__text
{
    display: block;
    font-size: 1em;
    text-align: center;
}
.container
{
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;

    margin: auto;

    max-width: 1300px;

    /* experimental - mainly for flex children that do not take the full width */
    width: 100%;
}

.container--clip
{
    overflow: hidden;
}

.container--gutter
{
    padding: 0 15px;
}

.container--position
{
    position: relative;    
}

.container--thin
{
    max-width: 975px;
}

.container--wide
{
    max-width: 1500px;
}

.container--widest
{
    max-width: 1920px;
}
.curve
{
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    border-radius: 20px;
}

.curve--huge
{
    -moz-border-radius: 250px;
    -webkit-border-radius: 250px;
    border-radius: 250px;
}

.curve--tiny
{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}
.footer-legal--offset
{
    margin-left: 1em;
    margin-right: 1em;
}
.footer-legal__content-item
{
    color: #153165;
    font-size: .7em;
}

.footer-legal__content-item--offset
{
    margin-top: 1em;
}
.footer-nav
{
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 1em 2.75em;
}
.footer-nav__link
{
    color: #153165;
    font-size: .85em;
    text-decoration: none;    
}
.footer-nav__title
{
    color: #153165;

    font-size: .85em;

    text-transform: uppercase;
}
.gradient--blue-right
{
    background-image: linear-gradient( 145deg, #1E42A5, #0071B9 );
}
.icon-link__icon
{
    display: block;
    -moz-transition: transform .15s;
    -o-transition: transform .15s;
    -webkit-transition: transform .15s;
    transition: transform .15s;

    /* UA wobble hack */
    -moz-transform: scale( 1.00001 );
    -ms-transform: scale( 1.00001 );
    -o-transform: scale( 1.00001 );
    -webkit-transform: scale( 1.00001 );
    transform: scale( 1.00001 );
}

/*.icon-link--on > .icon-link__icon,*/
:focus         > .icon-link__icon,
:hover         > .icon-link__icon
{
    -moz-transform: scale( 1.08 );
    -ms-transform: scale( 1.08 );
    -o-transform: scale( 1.08 );
    -webkit-transform: scale( 1.08 );
    transform: scale( 1.08 );
}
.icon-link__text
{
    -moz-backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;

    display: block;

    -moz-transition: transform .15s;
    -o-transition: transform .15s;
    -webkit-transition: transform .15s;
    transition: transform .15s;
}

/*.icon-link--on > .icon-link__text--x,*/
:focus         > .icon-link__text--x,
:hover         > .icon-link__text--x
{
    -moz-transform: translateX( 3px );
    -ms-transform: translateX( 3px );
    -o-transform: translateX( 3px );
    -webkit-transform: translateX( 3px );
    transform: translateX( 3px );
}

/*.icon-link--on > .icon-link__text--y,*/
:focus         > .icon-link__text--y,
:hover         > .icon-link__text--y
{
    -moz-transform: translateY( 4px );
    -ms-transform: translateY( 4px );
    -o-transform: translateY( 4px );
    -webkit-transform: translateY( 4px );
    transform: translateY( 4px );
}
.icon
{
    background: url( '/assets/img/www/main/icons/composite.svg' );
background-repeat: no-repeat;
}

/*
By placing icon-X rules in a subfolder and then importing from this
file, we are assured that the top rule will be defined first.
This is needed for specificity purposes.
*/
.icon--contact
{
    background-position: -104px;
    width: 26px;
}
.icon--search
{
    background-position: -68px;
    width: 26px;
}
.icon--x
{
    background-position: -0px;

    height: 24px;
    width: 24px;
}

.icon--x-black
{
    background-position: -34px;
}
.icon-color--black
{
    color: #333335;
}

.icon-color--heather
{
    color: #F7F5F3;
}
.input
{
    /*
        Remove inner shadow for iOS. If ommited, must define background-image
        to prevent UA default
    */
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;

    border: 1px solid #D0D2D3;

    /* undo iOS default border radius */
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;

    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;

    display: block;

    font: 1em/1.5 'Lato', sans-serif;

    padding: .75em;

    width: 100%;
}

/*
    Some .input elements are displayed next to
    submit btns and the following rule helps control
    the vertical spacing/heights in a cross browser way.

    Do not apply to textareas!
*/
input.input
{
    height: 3em;

    padding: 0 .75em; /* reset .input */
}

.input--fancy
{
    /* get rid of focus flash on iOS */
    -webkit-tap-highlight-color: transparent;
}

/* hide ugly down arrow on IE10+ */
select.input--fancy::-ms-expand
{
    display: none;
}

.input--fancy:hover,
.input--fancy:focus
{
    background-color: #F7F5F3;
    border-color: #0071B9;
    outline-color: #0071B9;
}

/*
	required variables:
		3em
*/

.input-invalid,
.input-invalid-block
{
	background-color: #FFDFDF;

	padding: .8em;
}

.input-invalid
{
	font-weight: bold;

	/* offset padding so that neighboring elements do not shift */
	margin: -.8em 0;

	/* for tooltip*/
	position: relative;

	/* IE7 bug: invoke hasLayout */
	*zoom: 1;
}

.input-tooltip
{
	background-color: #FFF;
	border: 1px solid #CCC;

	bottom: 3.8em;

	-moz-box-shadow: 0 0 7px 0 #CCC;
	-webkit-box-shadow: 0 0 7px 0 #CCC;
	box-shadow: 0 0 7px 0 #CCC;

	display: none;

	font-weight: normal; /* reset .input-invalid */

	padding: 7px;
	position: absolute;

	right: .8em;
}

.input-invalid:hover          > .input-tooltip,
.input-invalid > .input:focus + .input-tooltip
{
	display: block;
}

.input-arrow
{
	/* triangle height + border */
	bottom: -8px;

	border-left: 7px solid transparent;
	border-right: 7px solid transparent;
	border-top: 7px solid #C0C0C0;

	left: 7px;

	position: absolute;

	height: 0;
	width: 0;
}

/*
	Prevent input:focus zooming on mobile devices
	
	@link http://mydevice.io/devices/
	NOTE: largest width and height for smartphones and phablets
*/
@media
	only screen and ( max-width: 504px ) and ( orientation: portrait  ),
	only screen and ( max-width: 768px ) and ( orientation: landscape )
{

	.input
	{
		font-size: 1rem;
	}

	.input-tooltip
	{
		bottom: calc( 3rem /*nop*/ + /*nop*/ .8em );
	}

}.main-ad
{
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;

    padding: 2.4em;

    text-decoration: none !important;
}
.main-ad__content-item
{
    margin: auto;
    max-width: 475px;
}

* + .main-ad__content-item
{
    margin-top: 1em;
}

* + .main-ad__content-item--slogan
{
    margin-top: .5em;
}
.main-ad__icon
{
    display: block;

    height: 70px;

    margin: auto;

    width: 70px;
}
.main-ad__slogan
{
    font-size: .9em;
}
.main-ad__title
{
    font-size: 1.2em;
}
.main-ads__item
{
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;

    padding-bottom: .75em;
    padding-top: .75em;

    width: 33.33%;
}

.main-ads__item:nth-child( 3n + 1 ):last-child
{
    width: 100%;
}

.main-ads__item:nth-child( 3n + 1 ):nth-last-child( 2 ),
.main-ads__item:nth-child( 3n + 2 ):last-child
{
    width: 50%;
}
.main-article
{
    margin-bottom: 4em;
    margin-top: 4em;
}

/* adjust specificity for @media styles */
.main-article.main-article--bind-bottom
{
    margin-bottom: 0;
}
/**
    Anchors must be offset to avoid their contents from being rendered "behind" the sticky header.
    The offsetting strategy fails if the anchor's parent prevents overflow.

    Hence, the name of this class is tightly coupled to .main-article instead of the more general
    name such as .anchor since it is implemented at the template and controlled level.
*/

.main-article__anchor:before
{
    content: '';

    display: block;

    height: 107px;

    margin-top: -107px;
}
.main-article__body
{
    font-size: .9em;
}
.main-article__box
{
    background-color: rgba( 0, 113, 185, 0.15 );

    border: 1px solid #0071B9;

    padding: .9em 1.2em;
}

.main-article__box--fat
{
    padding: 1.5em 1.5em;
}

/**
 * @ref https://getbootstrap.com/docs/4.0/components/alerts/
 */
.main-article__box--danger
{
    background-color: #F8D7DA;
    border-color: #ea8991;
    color: #721C24;
}

/*.main-article__box--success
{
	background-color: #d4edda;
	    border-color: #c3e6cb;
	           color: #155724;
}*/

.main-article__box--warning
{
    background-color: #FFD331;
    border-color: #F2C318;
}
* + .main-article__boxes-content-item
{
    margin-top: 1em;
}

* + .main-article__boxes-content-item--button
{
    margin-top: 1.5em;
}

* + .main-article__boxes-content-item--title
{
    margin-top: 1.5em;
}
.main-article__boxes-content
{
    padding: 1.8em 1.5em;
}
.main-article__boxes-item
{
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;

    padding: .5em;
}

.main-article__boxes-item--x2
{
    width: 50%;
}
.main-article__boxes-title
{
    color: #1E42A5;
    font-size: 1.2em;
}
.main-article__content
{
    margin-bottom: 1.75em;
    margin-top: 1.75em;
}

* + .main-article__content--form
{
    margin-top: 3em;
}

.main-article__content--footer
{
    margin-top: 2em;
}
* + .main-article__form-content-item
{
    margin-top: 1.5em;
}

* + .main-article__form-content-item--text
{
    margin-top: 1em;
}

.main-article__form-content-item--short + .main-article__form-content-item--short
{
    margin-top: .9em;
}
.main-article__form-content
{
    margin: auto;

    max-width: 580px;

    padding: 5em 3em;
}
.main-article__form-title
{
    color: #153165;
    font-size: 2.1em;
}
.main-article__form
{
    padding: 5em 0;
}
/*.main-article__item--offset,*/
.main-article__items > * + *
{
    margin-top: .5em;
}

.main-article__item--offset-small/*,
.main-article__items--small > * + **/
{
    margin-top: .25em;
}

.main-article__item--offset-tall/*,
.main-article__items--tall > * + **/
{
    margin-top: 1em;
}
.main-article__list
{
    list-style-position: inside;
    margin: 0;
    padding: 0;
}

.main-article__list--column
{
    -moz-columns: 2 462.5px;
    -webkit-columns: 2 462.5px;
    columns: 2 462.5px;
}

.main-article__list--column > li
{
    break-inside: avoid;
}

.main-article__list--fancy
{
    list-style: none;
}

.main-article__list--fancy > li
{
    padding-left: 27px;

    position: relative;
}

.main-article__list--fancy > li:before
{
    background: url( '/assets/img/www/main/icons/composite.svg' );
background-repeat: no-repeat;
background-position: -180px;

    content: '';

    height: 1.5em;

    left: 0;
    position: absolute;
    top: 0;

    width: 18px;
}

.main-article__list--fancy-perk > li:before
{
    background-position: -208px;
}
.main-article__table
{
    background-color: #FFFFFF;

    border-spacing: 0;

    width: 100%;
}

.main-article__table *
{
    text-align: left;
}

.main-article__table--center *
{
    text-align: center;
}

.main-article__table > caption
{
    background-color: rgba( 0, 113, 185, 0.15 );

    font-weight: bold;

    padding: 0.833em;
}

.main-article__table--even > tr:nth-child( 2n  ),
.main-article__table--odd  > tr:nth-child( odd )
{
    background-color: #F7F5F3;
}

.main-article__table--lines tr > *
{
    border-top: 1px solid #D0D2D3;
}

.main-article__table tr > *
{
    padding: 0.833em;
}
.main-article__title
{
    color: #153165;
    font-size: 2.1em;
}

.main-article__title.main-article__title--body
{
    font-size: 1.5em;
}

.main-article__title.main-article__title--small
{
    font-size: 1.25em;
}
.main-header--border-gold
{
    border-bottom: 10px solid #F2C318;
}

.main-header--noborder
{
    border-bottom: 0;
}
* + .main-header__content-item
{
    margin-top: 1.5em;
}

.main-header__content-item
{
    max-width: 700px;
}

.main-header__content:only-child > .main-header__content-item
{
    /* IE11 does not honor auto margin */
    align-self: center;

    /* The below are redundant with the above IE11 hack.
       Comment until needed.
    *//*
    margin-left: auto;
    margin-right: auto;*/
}

.main-header__content-item--button
{
    /* IE11 jumpy button fix */
    -ms-flex-shrink: 0;
    -webkit-flex-shrink: 0;
    flex-shrink: 0;
}
.main-header__content
{
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;

    width: 50%;
}

.main-header__content:only-child
{
    text-align: center;
    width: 100%;
}

.main-header__content--body
{
    padding-right: 5em;
}

.main-header__content--body:last-child
{
    padding-right: 0;
}
.main-nav__icon
{
    height: 55px;
     width: 55px;

    margin: auto;
}
.main-nav__link
{
    color: #FFFFFF;

    display: block;

    max-width: 120px;

    padding: 2.2em 2em;

    text-decoration: none !important;
}
.main-nav__text
{
    font-size: .9em;

    height: 1.2em;

    line-height: 1.2;

    margin-top: .75em;
}
.main-strip
{
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;

    height: 100%;

    padding: 1em 2.25em;

    text-decoration: none !important;
}
.main-strip__content-item--content
{
    -ms-flex-grow: 1;
    -webkit-flex-grow: 1;
    flex-grow: 1;
}

* + .main-strip__content-item--content
{
    /*display: -moz-box;*/

display: -ms-flexbox;

/*display: -webkit-box;*/
display: -webkit-flex;

display: flex;margin-left: 1em;
    min-height: 75px;
}

_:-ms-lang(x),
* + .main-strip__content-item--content
{
    height: 1px;
}

* + .main-strip__content-item--slogan
{
    margin-top: .25em;
}
.main-strip__icon
{
    display: block;

    height: 75px;

    width: 110px;
}
.main-strip__slogan
{
    font-size: 1.1em;
}

.main-strip__slogan > span
{
    color: #0071B9;

    font-weight: bold;
}
.main-strip__title
{
    color: #153165;
    font-size: 1.2em;
}
* + .main-strips__content-item
{
    margin-top: .75em;
}
.main-strips__item
{
    padding-top: .75em;
}

.main-strips__item--strip
{
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 50%;
}
.main-tile
{
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;

    padding: 2em 1em 1.8em;

    text-decoration: none !important;
}
* + .main-tile__content-item
{
    margin-top: 1em;
}

.main-tile__content-item--title + .main-tile__content-item--slogan
{
    margin-top: .25em;
}
.main-tile__icon
{
    display: block;

    height: 70px;

    margin: auto;

    width: 70px;
}
.main-tile__slogan
{
    font-size: 1.1em;
}
.main-tile__title
{
    color: #153165;
    font-size: 1.5em;
}
.main-tiles__item
{
    width: 25%;
}
.modal .modal-iframe__container
{
    bottom: 0;
      left: 0;
     right: 0;
       top: 0;

    position: absolute; /* reset .modal__content */

    width: auto; /* reset .modal__content */
}

.modal-iframe__container--gutter
{
    margin: 1.5em;
}
.modal-iframe__iframe
{
    margin-top: 3em;

    overflow: hidden;
}

.ua--ios .modal-iframe__iframe
{
    overflow-x: hidden;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
}
.modal
{
    bottom: 0;
left: 0;

position: fixed;

right: 0;
top: 0;color: #333335;
    font-size: 1em;

    -moz-transition: background-color .3s;
    -o-transition: background-color .3s;
    -webkit-transition: background-color .3s;
    transition: background-color .3s;

    visibility: hidden;
}

.modal--on
{
    background-color: rgba( 21, 49, 101, 0.75 );

    visibility: visible;
}
.modal__body
{
    font-size: .9em;
}
.modal__close--icon
{
    background: none; /* reset UA default */
    border: 0;        /* reset UA default */

    cursor: pointer;

    font-size: inherit;

    padding: 1em;

    position: absolute;
    right: 0;
    top: 0;
}
.modal__content-item + .modal__content-item
{
    margin-top: 1.5em;
}

.modal__content-item--short + .modal__content-item--short
{
    margin-top: .9em;
}
.modal__title
{
    color: #153165;
    font-size: 2.1em;
}
.nav__item--offset-left
{
    margin-left: 1.75em;
}

.nav__item--offset-left-small
{
    margin-left: .5em;
}
.nav__link--icon
{
    color: #153165;
    padding: 0 .75em;
}
.ua--nojs .only--js,
.ua--nojs .only--mobile,
.ua--desktop .only--mobile
{
    display: none;
}
.proxy-focus
{
    border: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    width: 0 !important;

    position: absolute;
}

/*.proxy-focus--bottom
{
    bottom: 0 !important;
}*/

/*.proxy-focus--left
{
    left: 0 !important;
}*/

/*.proxy-focus--right
{
    right: 0 !important;
}*/

.proxy-focus--top
{
    top: 0 !important;
}
.review__author
{
    color: #F2C318;

    font-size: 1em;
}
.review__quote
{
    font-size: 1.1em;
}
.review__signature
{
    font-size: .7em;
}
* + .review__content-item
{
    margin-top: 1.5em;
}
.reviews__content-item
{
    margin: auto;
    max-width: 850px;
}

* + .reviews__content-item
{
    margin-top: 1.5em;
}
.scrollbars
{
    /*-webkit-overflow-scrolling: touch;*/
    -ms-overflow-style: -ms-autohiding-scrollbar;
    overflow: auto;
    overflow: overlay;

    scrollbar-arrow-color: #333335;
    scrollbar-face-color: rgba( 138, 138, 138, 0.75 );
    scrollbar-shadow-color: rgba( 138, 138, 138, 0.75 );
    scrollbar-track-color: rgba( 208, 210, 211, 0.75 );

    /* FireFox */
    scrollbar-color: rgba( 138, 138, 138, 0.75 ) rgba( 208, 210, 211, 0.75 );
}

.scrollbars::-webkit-scrollbar
{
    background-color: rgba( 208, 210, 211, 0.75 );

    height: .7em;
     width: .7em;
}

.scrollbars::-webkit-scrollbar-thumb
{
    background-color: rgba( 138, 138, 138, 0.75 );
}

.scrollbars--thin
{
    scrollbar-width: thin;
}

.scrollbars--thin::-webkit-scrollbar
{
    height: .4em;
     width: .4em;
}

/* NOT USED
.scrollbars--nox
{
    overflow-x: hidden;
}
*/

/* NOT USED
.scrollbars--noy
{
    overflow-y: hidden;
}
*/
.social__icon
{
    height: 30px;
    width: 30px;
}

.social__icon--load
{
    background: url( '/assets/img/www/main/logos/composites/social.svg' );
    background-repeat: no-repeat;    
}

/*
	By placing icon rules in a subfolder and then importing from this
	file, we are assured that the top rules will be defined first.
	This is needed for specificity purposes.
*/
.social__icon--facebook
{
    background-position: -0px;
}
.social__icon--instagram
{
    background-position: -40px;
}
.social__icon--x
{
    background-position: -80px;
}
.social__link
{
    color: #333335;
    margin: 0 .5em;
}
.sticks--center-load
{
    background-image: url( '/assets/img/www/main/misc/sticks--center.svg' );
    background-position: center top;
    background-repeat: no-repeat;
}

.sticks--left-load
{
    background-image: url( '/assets/img/www/main/misc/sticks--left.svg' );
    background-position: left top;
    background-repeat: no-repeat;
}

.sticks--right-load
{
    background-image: url( '/assets/img/www/main/misc/sticks--right.svg' );
    background-position: right top;
    background-repeat: no-repeat;
}
.text--small
{
    font-size: 0.8em;
}

.text--tiny
{
    font-size: 0.6em;
}
.title
{
    font-family: 'Lato', sans-serif;
    font-weight: 900;

    line-height: 1.2;
}
a
{
    color: #1E42A5;
}

.a--light
{
    color: #0071B9;
}

a,
a:hover
{
    text-decoration: underline;
}
body
{
    font: 20px/1.5 'Lato', sans-serif;

    margin: 0;

    /* @ref: https://blog.55minutes.com/2012/04/iphone-text-resizing/ */
    -moz-text-size-adjust: 100% /*none*/;
    -ms-text-size-adjust: 100% /*none*/;
    -webkit-text-size-adjust: 100% /*none*/;
}

@media only screen and ( min-width: 1940px )
{
    body
    {
        -moz-box-shadow: 0 0 10px 0 #8A8A8A;
        -webkit-box-shadow: 0 0 10px 0 #8A8A8A;
        box-shadow: 0 0 10px 0 #8A8A8A;
    }
}
/* end: imports */

/* media queries */

@media only screen and ( max-width: 1500px )
{
        #footer
{
    padding-bottom: $footer_offset_small_em;
    padding-top: $footer_offset_small_em;
}
#footer__legal
{
    margin-top: $footer_legal_offset_top_outer_em / 2;
}
#footer__logo
{
    height: 105px;
    width: 408px;
}
#logo
{
    height: $logo_height_smallpx;
    width: $logo_width_smallpx;
}
#main-ads
{
    padding-bottom: 4em;
    padding-top: 4em;
}
#main-ads__slogan
{
    font-size: 2.1em;
}
#main-header__title
{
    font-size: 2.1em;
}
#main-tiles
{
    padding-bottom: 4em;
    padding-top: 4em;
}
#main
{
    padding-top: 107px - ( 70 - $logo_height_small );
}
#modal-menu
{
    top: 107px - ( 70 - $logo_height_small );
}
.footer__nav
{
    padding-left: 1em;
    padding-right: 1em;
}

nav.footer__nav
{
    max-width: 250px;
    width: 25%;
}
.footer__tile
{
    width: 100%;
}

.footer__tile--logo
{
    margin-top: 1em;
}
.imark-block
{
    padding-bottom: $imark_block_offset_small_em;
    padding-top: $imark_block_offset_small_em;
}
.main-ad__title
{
    font-size: 1.25em;
}
.main-article
{
    margin-bottom: 4em;
    margin-top: 4em;
}
.main-article__anchor:before
{
    height: 107px - ( 70 - $logo_height_small );

    margin-top: -107px - ( 70 - $logo_height_small );
}
.main-article__boxes-content
{
    padding: 1.8em;
}
.main-article__boxes-title
{
    font-size: 1.25em;
}
.main-article__form-content
{
    padding: 2em 2em;
}
.main-article__form-title
{
    font-size: 2em;
}
.main-article__title
{
    font-size: 2em;
}
.main-header__content--body
{
    padding-left: 30px;
    padding-right: 30px;
}
.main-nav__link
{
    padding: 2em 1.8em;
}
.main-nav__text
{
    font-size: .9em;
}
.main-tile__content
{
    padding: 2em;
}
.main-tile__header
{
    height: 130px;
}
.main-tile__title
{
    font-size: 1.5em;
}
.modal-iframe__container--gutter
{
    /* take full screen */
    margin: 0;
}
.modal__content
{
    padding: 3.5em 2.75em;
}

.modal__content--isophobic
{
    padding-bottom: 2.75em;
    padding-top: 2.75em;
}
}

@media only screen and ( max-width: 1000px )
{
        #logo
{
    height: 56px;
    width: 217.6px;
}
#logo__link
{
    margin-right: 1em;
}
#main
{
    padding-top: 93px;
}
#modal-menu
{
    top: 93px;
}
.main-ads__item
{
    width: 50%;
}
.main-article__anchor:before
{
    height: 93px;

    margin-top: -93px;
}
.main-article__form-content
{
    padding: 2em 1.5em;
}
.main-header__content
{
    max-width: 700px;

    width: 100%;
}

.main-header__content--figure
{
    margin-top: 1.5em;

    padding-left: 15px;
    padding-right: 15px;
}
.modal__content
{
    padding-left: 1.75em;
    padding-right: 1.75em;
}
.nav__item:nth-child( 2 )
{
    display: none;
}

.nav__item--offset-left
{
    margin-left: .5em;
}
.nav__link--icon
{
    padding-left: 1em;
    padding-right: 1em;
}
}

@media only screen and ( max-width: 810px )
{
        #main-ads
{
    padding-bottom: 3em;
    padding-top: 3em;
}
#main-ads__slogan
{
    font-size: 2em;
}
#main-header
{
    padding-bottom: 3em;
    padding-top: 3em;
}
#main-header__title
{
    font-size: 2em;
}
#main-tiles
{
    padding-bottom: 3em;
    padding-top: 3em;
}
.imark-block
{
    padding-bottom: $imark_block_offset_smaller_em;
    padding-top: $imark_block_offset_smaller_em;
}
.main-article
{
    margin-bottom: 3em;
    margin-top: 3em;
}
.main-article__boxes-content
{
    padding: 1.5em;
}
.main-article__form-title
{
    font-size: 1.9em;
}
.main-article__title
{
    font-size: 1.9em;
}

.main-article__title.main-article__title--body
{
    font-size: 1.4em;
}

.main-article__title.main-article__title--small
{
    font-size: 1.25em;
}
.main-nav__link
{
    padding-top: 1.8em;
}
.main-nav__text
{
    font-size: .8em;
}
.main-tile__content
{
    padding: 1.5em;
}
.main-tile__header
{
    height: 110px;
}
.main-tile__title
{
    font-size: 1.25em;
}
}

@media only screen and ( max-width: 735px )
{
        #header
{
    padding-bottom: .5em;
    padding-top: .5em;
}
#logo__link
{
    margin-right: 0;
}
#main
{
    padding-top: 77px;
}
#modal-menu
{
    top: 77px;
}
#modal-menu__ctas
{
    display: block;
    margin-bottom: $modal_content_item_offset_top_button_em;
}
nav.footer__nav
{
    width: 50%;
}
.main-article__anchor:before
{
    height: 77px;

    margin-top: -77px;
}
.nav__item:nth-child( n + 2 )
{
    display: none;
}

.nav__item--border-right
{
    border-right: 0;
}
}

@media only screen and ( max-width: 568px )
{
        #main-ads__slogan
{
    font-size: 1.8em;
}
#main-header__title
{
    font-size: 1.8em;
}
.main-ads__item
{
    width: 100%;
}
.main-article__boxes-item
{
    width: 100%;
}
.main-article__form-title
{
    font-size: 1.7em;
}
.main-article__title
{
    font-size: 1.7em;
}
.main-tiles__item
{
    width: 100%;
}
.modal__content
{
    padding: 3em 1.5em;
}

.modal__content--isophobic
{
    padding-bottom: 2.5em;
    padding-top: 2.5em;
}
.modal__title
{
    font-size: 1.6em;
}
}

/* end: media queries */
