/* Minification failed. Returning unminified contents. (933,1): run-time error CSS1019: Unexpected token, found '@import' (933,9): run-time error CSS1019: Unexpected token, found 'url("//hello.myfonts.net/count/345f17")' */ /* cookie banner ============================ */ #cookie-banner { background: #ececec; display: none; padding: 25px 50px; position: relative; z-index: 2; } #cookie-banner .wrapper { padding-right: 120px; position: relative; } #cookie-banner .cookie-text { color: #360554; } #cookie-banner #accept-cookies { background: url("/Media/icons/close.png") no-repeat 0 0 transparent; -moz-background-size: 13px auto; -ms-background-size: 13px auto; -o-background-size: 13px auto; -webkit-background-size: 13px auto; background-size: 13px auto; border: none; font-size: 0; height: 13px; outline: none; position: absolute; right: 20px; text-indent: -9999px; text-transform: capitalize; top: 50%; -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%); width: 13px; } #cookie-banner #accept-cookies:focus { opacity: 0.6; } /* responsive ============================ */ @media screen and (max-width: 1024px) { #cookie-banner { padding: 15px 25px; } #cookie-banner .wrapper { padding-right: 70px; } #cookie-banner .cookie-text { font-size: 1.5rem; line-height: 2.2rem; } #cookie-banner #accept-cookies { right: 0; } } @media screen and (max-width: 736px) { #cookie-banner { padding-left: 20px; padding-right: 20px; } #cookie-banner .wrapper { padding-left: 0; padding-right: 50px; } #cookie-banner .cookie-text { font-size: 1.2rem; line-height: 2rem; } #cookie-banner #accept-cookies { top: 11px; } #cookie-banner #accept-cookies:focus { opacity: 1; } } /* header ============================ */ header#site-header { background: #ffffff; font-family: "Freight Sans W03 Medium", Arial, 'Helvetica Neue', Helvetica, sans-serif; display: table; position: relative; width: 100%; z-index: 2; } header#site-header.slim { -moz-transition: 0.4s ease; -ms-transition: 0.4s ease; -o-transition: 0.4s ease; -webkit-transition: 0.4s ease; transition: 0.4s ease; } header#site-header .hidden { opacity: 0; visibility: hidden; } /* logo */ #logo { border-right: 1px solid #ececec; display: table-cell; padding: 20px 20px 19px 42px; vertical-align: middle; } #logo > a, #logo > a img { display: block; max-width: none; } .slim #logo { border-right: none; display: block; float: left; max-width: 18rem; padding: 9px 22px 12px 42px; } .slim #logo > a img { height: auto; width: 100%; } /* navigation links */ #navigation-links { display: table-cell; padding: 0; vertical-align: top; width: 100%; } #navigation-links ul { position: static; } .slim #navigation-links { display: none; } /* header links */ #header-links { padding-right: 40px; } #header-links ul { display: inline-block; padding-right: 10px; vertical-align: top; z-index: 1; } #header-links ul > li { display: inline-block; line-height: 1.7rem; vertical-align: top; } #header-links ul > li > a, #header-links ul > li > button { background: none; border: none; color: #00a896; display: block; outline: none; padding: 12px 12px 10px; position: relative; -moz-transition: 0.2s ease; -ms-transition: 0.2s ease; -o-transition: 0.2s ease; -webkit-transition: 0.2s ease; transition: 0.2s ease; } #header-links ul > li > a:focus, #header-links ul > li > button:focus { color: #360554; } #header-links ul > li.active > a, #header-links ul > li.active > button { background: #360554; color: #ffffff; } #header-links ul > li.has-children > a, #header-links ul > li.has-children > button { padding-left: 21px; padding-right: 29px; } #header-links ul > li.has-children > a:before, #header-links ul > li.has-children > button:before { border-left: 4px solid transparent; border-right: 4px solid transparent; border-bottom: 4px solid #00a896; content: ""; height: 0; position: absolute; right: 13px; top: 55%; -moz-transform: translateY(-50%) rotate(180deg); -ms-transform: translateY(-50%) rotate(180deg); -o-transform: translateY(-50%) rotate(180deg); -webkit-transform: translateY(-50%) rotate(180deg); transform: translateY(-50%) rotate(180deg); width: 0; } #header-links ul > li.has-children.active > a:before, #header-links ul > li.has-children.active > button:before { border-bottom-color: #ffffff; -moz-transform: translateY(-50%) rotate(0); -ms-transform: translateY(-50%) rotate(0); -o-transform: translateY(-50%) rotate(0); -webkit-transform: translateY(-50%) rotate(0); transform: translateY(-50%) rotate(0); } #header-links ul > li > ul { background: #360554; display: none; left: 0; padding: 9px 0; position: absolute; top: 100%; width: 201px; } #header-links ul > li > ul > li { display: block; font-family: "Freight Sans W03 Medium", Arial, 'Helvetica Neue', Helvetica, sans-serif; } #header-links ul > li > ul > li > a { color: #ffffff; display: block; padding: 7px 21px 8px; text-transform: capitalize; } #header-links ul > li > ul > li > a .external-arrow { width: 11px; height: 11px; margin-left: 11px; } #header-links ul > li > ul > li > a .external-arrow:after { height: 40%; } #header-links ul > li > ul > li > a .external-arrow:before { width: 40%; } #header-links ul > li > ul > li > a .external-arrow .arrow { height: 11px; top: -4px; right: -1px; } #header-links ul > li > ul > li > a .external-arrow .arrow:before, #header-links ul > li > ul > li > a .external-arrow .arrow:after { height: 5px; bottom: -1px; left: -1px; border-radius: 0; } #header-links ul > li > ul > li > a .external-arrow .arrow:after { left: auto; right: -1px; } #header-links ul > li > ul > li > a:hover .external-arrow .arrow, #header-links ul > li > ul > li > a:focus .external-arrow .arrow { -webkit-animation: moveSecondLevelExternal 0.25s ease-out both; -moz-animation: moveSecondLevelExternal 0.25s ease-out both; -o-animation: moveSecondLevelExternal 0.25s ease-out both; -ms-animation: moveSecondLevelExternal 0.25s ease-out both; } #header-links ul > li > ul > li > a:focus { color: #ed9c11; } #header-links ul > li#language-selector .selected { font-family: "Freight Sans W03 Medium", Arial, 'Helvetica Neue', Helvetica, sans-serif; line-height: 1.7rem; text-transform: capitalize; } #header-links ul > li#language-selector > ul { left: auto; min-width: 158px; padding: 13px 0 12px; right: 0; width: 100%; } #header-links ul > li#language-selector > ul > li > a { padding: 5px 21px; } #header-links ul > li#language-selector > ul > li > a:after { display: none; } #header-links .form-toggle { font-size: 1.6rem; letter-spacing: 0; padding: 4px 26px; } /* primary navigation */ nav#primary-navigation { clear: both; padding: 17px 0 14px; } nav#primary-navigation ul > li { display: inline-block; font-family: "Freight Sans W03 Medium", Arial, 'Helvetica Neue', Verdana, sans-serif; font-size: 1.8rem; line-height: 2.4rem; padding: 0 15px; position: static; vertical-align: middle; } nav#primary-navigation ul > li > .nav-item { background: none; border: none; color: #200b3f; cursor: pointer; position: relative; } nav#primary-navigation ul > li > .nav-item:focus { color: #ed9c11; } nav#primary-navigation ul > li.has-children > .nav-item { padding-right: 21px; } nav#primary-navigation ul > li.has-children > .nav-item:after { border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 4px solid #190140; content: ""; display: block; position: absolute; right: 4px; top: 50%; -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%); } nav#primary-navigation ul > li.has-children.active > .nav-item:after { border-bottom: 4px solid #ed9c11; border-top: none; } nav#primary-navigation ul > li > .megamenu { background: #ffffff; display: none; left: 0; position: absolute; text-align: left; top: 100%; width: 100%; z-index: 1; } nav#primary-navigation ul > li > .megamenu header { background: #12003b; background: -moz-linear-gradient(left, #12003b 0%, #3f065b 100%); background: -webkit-linear-gradient(left, #12003b 0%,#3f065b 100%); background: linear-gradient(to right, #12003b 0%,#3f065b 100%); padding: 22px 0; } nav#primary-navigation ul > li > .megamenu header h2 { color: #ffffff; margin: 0; padding-left: 12px; position: relative; } nav#primary-navigation ul > li > .megamenu header h2:before { background: #ed9c11; content: ""; display: block; height: 0; left: 0; margin-right: 12px; position: absolute; top: 55%; -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%); -moz-transition: 0.5s ease; -ms-transition: 0.5s ease; -o-transition: 0.5s ease; -webkit-transition: 0.5s ease; transition: 0.5s ease; width: 4px; } nav#primary-navigation ul > li.has-children.active > .megamenu header h2.line-active:before { height: 30px; } nav#primary-navigation ul > li > .megamenu .megamenu-inner > .wrapper { padding: 45px 0; } nav#primary-navigation ul > li > .megamenu .megamenu-inner .secondary-navigation { float: left; max-width: 40%; width: 100%; } nav#primary-navigation ul > li > .megamenu .megamenu-inner .secondary-navigation ul > li { float: left; font-size: 2.4rem; letter-spacing: -0.02em; line-height: 3rem; padding: 9px 20px 8px 0; width: 50%; } nav#primary-navigation ul > li > .megamenu .megamenu-inner .secondary-navigation ul > li:nth-child(even) { padding-left: 8px; width: 49%; } nav#primary-navigation ul > li > .megamenu .megamenu-inner .secondary-navigation ul > li:nth-child(odd) { clear: left; } nav#primary-navigation ul > li > .megamenu .megamenu-inner .secondary-navigation ul > li > a { position: relative; } nav#primary-navigation ul > li > .megamenu .megamenu-inner .secondary-navigation ul > li > a:after { background: #ed9c11; bottom: 7px; content: ""; display: inline-block; height: 5px; opacity: 0; position: absolute; right: -13px; -moz-transition: 0.3s ease opacity; -ms-transition: 0.3s ease opacity; -o-transition: 0.3s ease opacity; -webkit-transition: 0.3s ease opacity; transition: 0.3s ease opacity; vertical-align: baseline; width: 5px; } nav#primary-navigation ul > li > .megamenu .megamenu-inner .secondary-navigation ul > li > a:hover:after, nav#primary-navigation ul > li > .megamenu .megamenu-inner .secondary-navigation ul > li > a:focus:after { opacity: 1; } nav#primary-navigation ul > li > .megamenu .megamenu-inner .navigation-tiles { float: right; max-width: 60%; padding-top: 15px; } nav#primary-navigation ul > li > .megamenu .megamenu-inner .navigation-tiles .tile-grid { width: 103%; } nav#primary-navigation ul > li > .megamenu .megamenu-inner .navigation-tiles .tile-grid .tile { border: 2px solid #f7f7f7; display: inline-block; max-width: 342px; min-height: 262px; vertical-align: top; width: 342px; } nav#primary-navigation ul > li > .megamenu .megamenu-inner .navigation-tiles .tile-grid .tile + .tile { margin-left: 25px; } nav#primary-navigation ul > li > .megamenu .megamenu-inner .navigation-tiles .tile-grid .tile .inner { font-size: 1.6rem; height: 100%; line-height: 2.4rem; padding: 26px 30px 72px; position: relative; } nav#primary-navigation ul > li > .megamenu .megamenu-inner .navigation-tiles .tile-grid .tile .inner h4 { color: #360554; margin: 0 0 19px; padding: 0; } nav#primary-navigation ul > li > .megamenu .megamenu-inner .navigation-tiles .tile-grid .tile .inner .category { color: #ed9c11; font-family: "AvenirLTStd-Black", Arial, 'Helvetica Neue', Helvetica, sans-serif; font-size: 1.6rem; line-height: 2.3rem; } nav#primary-navigation ul > li > .megamenu .megamenu-inner .navigation-tiles .tile-grid .tile .inner .date { font-weight: 600; } nav#primary-navigation ul > li > .megamenu .megamenu-inner .navigation-tiles .tile-grid .tile .inner .location { padding-bottom: 14px; padding-top: 1px; } nav#primary-navigation ul > li > .megamenu .megamenu-inner .navigation-tiles .tile-grid .tile .inner .summary-text { min-height: 65px; padding-bottom: 14px; } nav#primary-navigation ul > li > .megamenu .megamenu-inner .navigation-tiles .tile-grid .tile .inner .cta { bottom: 26px; left: 30px; position: absolute; } /* site search */ #site-search-navicon { border-left: 1px solid #ececec; display: table-cell; vertical-align: middle; } #navicon-wrapper:focus, #site-search:focus, #site-search-navicon:focus { background: #f7f7f7; outline: none; } #site-search { height: 43px; padding: 0 31px 0 32px; text-align: center; vertical-align: middle; width: 110px; } #site-search:after { background: #9279a1; content: ""; display: block; height: 0; position: absolute; right: 110px; top: 0; -moz-transition: all 0.6s ease; -o-transition: all 0.6s ease; -webkit-transition: all 0.4s ease; transition: all 0.6s ease; width: 1px; } #site-search #search-area .stylish-text, #site-search.open #search-area .placeholder-wrapper { float: left; } #site-search button { background: none; border: none; margin: 0 auto; outline: none; padding: 0; } #site-search button.search-icon { height: 43px; position: relative; width: 46px; z-index: 1; } #site-search button.search-icon:before, #site-search button.search-icon:after { content: ""; display: block; margin: 0; padding: 0; position: absolute; -moz-transition: all 0.6s ease; -o-transition: all 0.6s ease; -webkit-transition: all 0.6s ease; transition: all 0.6s ease; } #site-search button.search-icon:before { border: 2px solid #360554; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; height: 35px; left: 1px; top: 0; width: 35px; } #site-search button.search-icon:after { background: #360554; bottom: -2px; height: 16px; right: 6px; -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform: rotate(-45deg); width: 2px; } #site-search #search-area input[type="submit"] { -ms-filter: alpha(opacity=0); filter: alpha(opacity=0); float: right; width: 48px; height: 48px; opacity: 0; padding: 0; margin: 5px 20px 0 20px; background: url("/Media/Icons/search-icon.png") no-repeat; background-size: contain; -ms-transition: 0.3s ease; -o-transition: 0.3s ease; -webkit-transition: 0.3s ease; transition: 0.3s ease; visibility: visible; } #site-search.open { padding-left: 34px; } #site-search.open button.search-icon { height: 43px; width: 43px; } #site-search.open button.search-icon:before { border: none; border-right: 2px solid #ffffff; -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; height: 60px; left: 20px; -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); top: -8px; width: 0; } #site-search.open button.search-icon:after { background-color: #ffffff; bottom: -8px; height: 60px; right: 20px; } #site-search #search-area { background: #12003b; background: -moz-linear-gradient(left, #12003b 0%, #3f065b 100%); background: -webkit-linear-gradient(left, #12003b 0%,#3f065b 100%); background: linear-gradient(to right, #12003b 0%,#3f065b 100%); height: 100%; overflow: hidden; position: absolute; right: 0; top: 0; -moz-transition: all 0.6s ease; -o-transition: all 0.6s ease; -webkit-transition: all 0.6s ease; transition: all 0.6s ease; width: 0; } #site-search.open #search-area { width: 100%; } #site-search.open #search-area .stylish-text, #site-search.open #search-area .placeholder-wrapper { width: calc(100% - 100px); } #site-search.open #search-area input[type="submit"] { -ms-filter: alpha(opacity=100); filter: alpha(opacity=100); opacity: 1; visibility: visible; } #site-search.open #search-area input[type="submit"]:focus { -ms-filter: alpha(opacity=50); filter: alpha(opacity=50); opacity: 0.5; } #site-search.open:after { height: 100%; } #site-search form { opacity: 0; padding: 23px 120px 22px 102px; -moz-transition: all 4s ease; -o-transition: all 4s ease; -webkit-transition: all 4s ease; transition: all 4s ease; visibility: hidden; } #site-search.open form { opacity: 1; visibility: visible; } #site-search form input, #site-search form > div > span, #site-search .placeholder-wrapper > div > span, #site-search .placeholder-wrapper .placeholder { border: none; color: #ffffff; display: block; font-size: 4.8rem; height: 54px; letter-spacing: -0.02em; line-height: 5rem; margin: 0; padding: 0 15px; } #site-search .placeholder-wrapper .placeholder { color: #827691; left: 0; line-height: 5.4rem; margin-top: -26px; text-align: left; width: 100%; } #site-search form input:-webkit-input-placeholder { color: #827691; } #site-search form input:-moz-placeholder { color: #827691; } #site-search form input:-ms-input-placeholder { color: #827691; } #site-search form input::placeholder { color: #827691; } #site-search form > div > span:before, #site-search .placeholder-wrapper > div > span:before { background: #ececec; content: ""; display: block; height: 41px; left: 0; position: absolute; top: 8px; width: 2px; } .nav-open #site-search-navicon { position: relative; z-index: 0; } .search-open #site-search .search-icon:focus { -ms-filter: alpha(opacity=70); filter: alpha(opacity=70); opacity: 0.7; } .safari #site-search form input, .safari #site-search form > div > span, .safari #site-search .placeholder-wrapper > div > span, .safari #site-search .placeholder-wrapper .placeholder { line-height: 5.4rem; } .slim #site-search, .slim #site-search-navicon { display: block; float: right; } .slim #site-search { border-left: 1px solid #ececec; padding: 19px 21px 21px 20px; width: auto; } .slim #site-search button.search-icon { display: block; height: 27px; margin: 0 auto; width: 27px; } .slim #site-search button.search-icon:before { height: 21px; width: 21px; } .slim #site-search button.search-icon:after { bottom: 0; height: 7px; right: 1px; } .slim #site-search.open { padding: 21px 21px 15px 23px; } .slim #site-search.open button.search-icon { height: 24px; width: 24px; } .slim #site-search.open button.search-icon:after { bottom: -4px; height: 32px; right: 11px; } .slim #site-search.open button.search-icon:before { height: 32px; left: -7px; top: -11px; } .slim #site-search form { padding: 17px 95px 16px 20px; } .slim #site-search form input, .slim #site-search form > div > span, .slim #site-search .placeholder-wrapper > div > span, .slim #site-search .placeholder-wrapper .placeholder { font-size: 2.8rem; height: 34px; line-height: 3rem; } .slim #site-search form > div > span:before { height: 37px; top: -3px; } .slim #site-search:after { right: 69px; } .safari .slim #site-search form input, .safari .slim #site-search form > div > span, .safari .slim #site-search .placeholder-wrapper > div > span, .safari .slim #site-search .placeholder-wrapper .placeholder { line-height: 3.4rem; } .search-open #logo, .search-open #navigation-links { opacity: 0; visibility: hidden; } /* navicon */ #navicon { display: none; } .slim #navicon-wrapper { padding: 20px 22px 23px 21px; } .slim #navicon { background: none; border: none; display: block; height: 24px; margin: 0 auto; outline: none; padding: 0; position: relative; width: 26px; } .slim #navicon > span.line { background-color: #360554; height: 2px; position: absolute; left: 0; top: 0; width: 100%; pointer-events: none; -webkit-transition: top 0.2s ease-in-out 0.3s, -webkit-transform 0.3s ease-in-out; transition: transform 0.3s ease-in-out, top 0.2s ease-in-out 0.3s, -webkit-transform 0.3s ease-in-out; } .slim #navicon > span.line:first-child:before { background-color: #360554; content: ""; height: 2px; left: 0; position: absolute; width: 100%; -webkit-transition: -webkit-transform 0.1s ease-in-out 0.2s; transition: transform 0.1s ease-in-out 0.2s, -webkit-transform 0.1s ease-in-out 0.2s; } .slim #navicon > span.line:nth-child(2n) { top: 0; bottom: 0; margin: auto; -webkit-transition: opacity 0s ease-in-out 0.3s; transition: opacity 0s ease-in-out 0.3s; } .slim #navicon > span.line:last-child { bottom: 0; top: auto; -webkit-transition: opacity 0s ease-in-out 0.3s, bottom 0.2s ease-in-out 0.3s; transition: opacity 0s ease-in-out 0.3s, bottom 0.2s ease-in-out 0.3s; } .slim #navicon.open > span.line:first-child { left: -3px; top: 11px; -webkit-transform: rotate(135deg); transform: rotate(135deg); -webkit-transition: top 0.3s ease-in-out, -webkit-transform 0.3s linear 0.3s, width 0.6s ease-in-out, left 0.6s ease-in-out; transition: top 0.3s ease-in-out, transform 0.3s linear 0.3s, width 0.6s ease-in-out, left 0.6s ease-in-out; width: 32px; } .slim #navicon.open > span.line:first-child:before { -webkit-transform: rotate(90deg); transform: rotate(90deg); -webkit-transition: -webkit-transform 0.1s ease-in-out 0.3s; transition: transform 0.1s ease-in-out 0.3s; } .slim #navicon.open > span.line:nth-child(2n) { opacity: 0; -webkit-transition: opacity 0s ease-in-out 0.3s; transition: opacity 0s ease-in-out 0.3s; } .slim #navicon.open > span.line:last-child { bottom: 11px; opacity: 0; -webkit-transition: bottom 0.3s ease-in-out, opacity 0s ease-in-out 0.3s; transition: bottom 0.3s ease-in-out, opacity 0s ease-in-out 0.3s; } /* responsive ============================ */ @media screen and (max-width: 1420px) { nav#primary-navigation ul > li { padding: 0 5px; } } @media screen and (max-width: 1280px) { /* logo*/ #logo { padding-left: 21px; } #logo > a, #logo > a img { height: auto; max-width: 120px; } /* navigation links */ #navigation-links { padding-left: 5px; padding-right: 5px; } /* header links */ #header-links { padding-right: 25px; } /* primary navigation */ nav#primary-navigation { padding-top: 17px; } nav#primary-navigation ul > li { font-size: 1.5rem; } nav#primary-navigation ul > li > .megamenu header .wrapper, nav#primary-navigation ul > li > .megamenu .megamenu-inner > .wrapper { padding-left: 20px; padding-right: 20px; } nav#primary-navigation ul > li > .megamenu .megamenu-inner .navigation-tiles { max-width: 65%; } nav#primary-navigation ul > li > .megamenu .megamenu-inner .navigation-tiles .tile-grid .tile + .tile { margin-left: 15px; } nav#primary-navigation ul > li > .megamenu .megamenu-inner .secondary-navigation { max-width: 35%; } nav#primary-navigation ul > li > .megamenu .megamenu-inner .secondary-navigation ul > li { font-size: 1.9rem; } nav#primary-navigation ul > li > .megamenu .megamenu-inner .secondary-navigation ul > li > a:after { margin-left: 5px; } /* site search */ #site-search { height: auto; padding: 0 10px 0 12px; width: 90px; } #site-search.open { padding-left: 10px; } #site-search:after { right: 90px; } #site-search.open #search-area input[type="submit"] { margin-right: 0; } } @media screen and (max-width: 1170px) { /* primary navigation */ nav#primary-navigation ul > li { padding: 0; } nav#primary-navigation ul > li > .megamenu .megamenu-inner .navigation-tiles .tile-grid .tile { max-width: 300px; } nav#primary-navigation ul > li > .megamenu .megamenu-inner .secondary-navigation ul > li { padding: 5px 10px 5px 0; } } @media screen and (max-width: 1024px) { /* header */ header#site-header { border-bottom: 1px solid #ececec; display: block; } /* logo */ #logo { border-right: none; display: block; float: left; max-width: 18rem; padding: 9px 52px 12px 12px; } #logo > a img { height: auto; width: 100%; } .slim #logo { padding: 9px 52px 12px 12px; } /* navigation links */ #navigation-links { background: #ffffff; display: none; -webkit-flex-flow: column-reverse; flex-flow: column-reverse; left: 0; overflow-y: auto; padding: 0; position: absolute; top: 101%; width: 100%; z-index: 1; } html.overflow-hidden body.step-form-open #navigation-links { overflow: hidden; } /* header links */ #header-links { display: flex; display: -webkit-flex; -webkit-flex-flow: column-reverse; flex-flow: column-reverse; float: none; padding-right: 0; padding-top: 32px; position: relative; right: auto; text-align: center; } #header-links ul { border-top: 1px solid #f2f2f2; clear: both; display: block; padding: 14px 20px 24px; text-align: left; width: 100%; } #header-links ul > li { display: block; font-size: 1.8rem; line-height: 2rem; padding: 0; } #header-links ul > li > a, #header-links ul > li > button, #header-links ul > li.has-children > a, #header-links ul > li.has-children > button { display: inline-block; padding: 8px 29px 6px 0; } #header-links ul > li > a:focus, #header-links ul > li > button:focus { color: #00a896; } #header-links ul > li.active > a, #header-links ul > li.active > button { background: none; color: #00a896; } #header-links ul > li.has-children.active > a:before, #header-links ul > li.has-children.active > button:before { border-bottom-color: #00a896; } #header-links ul > li > ul, #header-links ul > li#language-selector > ul { background: none; border-top: none; padding: 2px 0 0; position: relative; width: 100%; } #header-links ul > li > ul > li { font-size: 1.6rem; padding: 0; } #header-links ul > li > ul > li > a, #header-links ul > li#language-selector > ul > li > a { color: #360554; padding: 6px 20px; } #header-links ul > li#language-selector > ul { padding-bottom: 6px; } #header-links .button { float: none; font-size: 2.1rem; margin: 0 auto 9px; padding: 10px 30px 9px; } #header-links, #primary-navigation { opacity: 0; -moz-transition: 0.4s ease visibility, 0.8s ease opacity; -ms-transition: 0.4s ease visibility, 0.8s ease opacity; -o-transition: 0.4s ease visibility, 0.8s ease opacity; -webkit-transition: 0.4s ease visibility, 0.8s ease opacity; transition: 0.4s ease visibility, 0.8s ease opacity; visibility: hidden; } /* primary navigation */ nav#primary-navigation { text-align: left; opacity: 0; padding: 0; } nav#primary-navigation ul > li { border-bottom: 1px solid #f2f2f2; display: block; font-size: 2.1rem; padding: 0; } nav#primary-navigation ul > li > .nav-item { display: block; padding: 13px 21px; text-align: left; width: 100%; } nav#primary-navigation ul > li.has-children > .nav-item:after { border-left-width: 5px; border-right-width: 5px; border-top-width: 6px; right: 21px; } nav#primary-navigation ul > li.has-children.active > .nav-item:after { border-bottom-width: 6px; border-bottom-color: #ffffff; } nav#primary-navigation ul > li.has-children.active > .nav-item { background: #360554; color: #ffffff; } nav#primary-navigation ul > li > .megamenu { position: relative; } nav#primary-navigation ul > li > .megamenu header, nav#primary-navigation ul > li > .megamenu .megamenu-inner .navigation-tiles { display: none; } nav#primary-navigation ul > li > .megamenu .megamenu-inner > .wrapper { padding: 0 40px; } nav#primary-navigation ul > li > .megamenu .megamenu-inner .secondary-navigation, nav#primary-navigation ul > li > .megamenu .megamenu-inner .secondary-navigation ul > li, nav#primary-navigation ul > li > .megamenu .megamenu-inner .secondary-navigation ul > li:nth-child(even) { border: none; float: none; font-size: 1.8rem; max-width: 100%; padding: 0; width: 100%; } nav#primary-navigation ul > li > .megamenu .megamenu-inner .secondary-navigation ul > li, nav#primary-navigation ul > li > .megamenu .megamenu-inner .secondary-navigation ul > li:nth-child(even) { padding: 6px 0 7px; } nav#primary-navigation ul > li > .megamenu .megamenu-inner .secondary-navigation ul > li:first-child { padding-top: 6px; } nav#primary-navigation ul > li > .megamenu .megamenu-inner .secondary-navigation ul > li:last-child { padding-bottom: 11px; } .nav-open #header-links, .nav-open nav#primary-navigation { opacity: 1; visibility: visible; } .nav-open #site-overlay.active { background: #ffffff; } .nav-open.step-form-open #header-links > ul, .nav-open.step-form-open #header-links > .button, .nav-open.step-form-open nav#primary-navigation { opacity: 0; visibility: hidden; z-index: -1; } /* site search */ #site-search, #site-search-navicon { display: block; float: right; } #site-search { border-left: 1px solid #ececec; overflow: hidden; padding: 19px 21px 21px 20px; width: auto; } #site-search button.search-icon { display: block; height: 27px; margin: 0 auto; width: 27px; } #site-search button.search-icon:before { height: 21px; width: 21px; } #site-search button.search-icon:after { bottom: 0; height: 7px; right: 1px; } #site-search #search-area input[type="submit"] { width: 24px; height: 24px; margin: 5px 0 0 0; } #site-search.open { padding: 21px 21px 15px 20px; } #site-search.open button.search-icon { height: 24px; width: 24px; } #site-search.open #search-area .stylish-text { width: calc(100% - 30px); } #site-search.open button.search-icon:after { bottom: -4px; height: 32px; right: 11px; } #site-search.open button.search-icon:before { height: 32px; left: 11px; top: -4px; } #site-search form { padding: 17px 85px 16px 20px; } #site-search form input, #site-search form > div > span, #site-search .placeholder-wrapper > div > span, #site-search .placeholder-wrapper .placeholder { font-size: 2.8rem; height: 34px; line-height: 3rem; } #site-search form > div > span:before { height: 37px; top: -3px; } #site-search:after { right: 68px; } .safari #site-search form input, .safari #site-search form > div > span, .safari #site-search .placeholder-wrapper > div > span, .safari #site-search .placeholder-wrapper .placeholder { line-height: 3.4rem; } /* navicon */ #navicon-wrapper { padding: 20px 22px 23px 21px; } .mobile #navicon-wrapper:focus, .mobile #site-search:focus, .mobile #site-search-navicon:focus { background: initial; } #navicon { background: none; border: none; display: block; height: 24px; margin: 0 auto; outline: none; padding: 0; position: relative; width: 26px; } #navicon > span.line { background-color: #360554; height: 2px; position: absolute; left: 0; top: 0; width: 100%; pointer-events: none; -webkit-transition: top 0.2s ease-in-out 0.3s, -webkit-transform 0.3s ease-in-out; transition: transform 0.3s ease-in-out, top 0.2s ease-in-out 0.3s, -webkit-transform 0.3s ease-in-out; } #navicon > span.line:first-child:before { background-color: #360554; content: ""; height: 2px; left: 0; position: absolute; width: 100%; -webkit-transition: -webkit-transform 0.1s ease-in-out 0.2s; transition: transform 0.1s ease-in-out 0.2s, -webkit-transform 0.1s ease-in-out 0.2s; } #navicon > span.line:nth-child(2n) { top: 0; bottom: 0; margin: auto; -webkit-transition: opacity 0s ease-in-out 0.3s; transition: opacity 0s ease-in-out 0.3s; } #navicon > span.line:last-child { bottom: 0; top: auto; -webkit-transition: opacity 0s ease-in-out 0.3s, bottom 0.2s ease-in-out 0.3s; transition: opacity 0s ease-in-out 0.3s, bottom 0.2s ease-in-out 0.3s; } #navicon.open > span.line:first-child { left: -3px; top: 11px; -webkit-transform: rotate(135deg); transform: rotate(135deg); -webkit-transition: top 0.3s ease-in-out, -webkit-transform 0.3s linear 0.3s, width 0.6s ease-in-out, left 0.6s ease-in-out; transition: top 0.3s ease-in-out, transform 0.3s linear 0.3s, width 0.6s ease-in-out, left 0.6s ease-in-out; width: 32px; } #navicon.open > span.line:first-child:before { -webkit-transform: rotate(90deg); transform: rotate(90deg); -webkit-transition: -webkit-transform 0.1s ease-in-out 0.3s; transition: transform 0.1s ease-in-out 0.3s; } #navicon.open > span.line:nth-child(2n) { opacity: 0; -webkit-transition: opacity 0s ease-in-out 0.3s; transition: opacity 0s ease-in-out 0.3s; } #navicon.open > span.line:last-child { bottom: 11px; opacity: 0; -webkit-transition: bottom 0.3s ease-in-out, opacity 0s ease-in-out 0.3s; transition: bottom 0.3s ease-in-out, opacity 0s ease-in-out 0.3s; } } /* keyframe animations ============================ */ /* article animations */ @keyframes animateWidth { from { width: 0; } to { width: 100%; } } @-webkit-keyframes animateWidth { from { width: 0; } to { width: 100%; } } @-moz-keyframes animateWidth { from { width: 0; } to { width: 100%; } } @-ms-keyframes animateWidth { from { width: 0; } to { width: 100%; } } @-o-keyframes animateWidth { from { width: 0; } to { width: 100%; } } @keyframes moveArrow { from { left: 0; } 50% { left: -10px; } 75% { left: 10px; } to { left: 0; } } @-webkit-keyframes moveArrow { from { left: 0; } 50% { left: -10px; } 75% { left: 10px; } to { left: 0; } } @-moz-keyframes moveArrow { from { left: 0; } 50% { left: -10px; } 75% { left: 10px; } to { left: 0; } } @-ms-keyframes moveArrow { from { left: 0; } 50% { left: -10px; } 75% { left: 10px; } to { left: 0; } } @-o-keyframes moveArrow { from { left: 0; } 50% { left: -10px; } 75% { left: 10px; } to { left: 0; } } @keyframes showBorder { from { height: 0; } to { height: 100%; } } @-webkit-keyframes showBorder { from { height: 0; } to { height: 100%; } } @-moz-keyframes showBorder { from { height: 0; } to { height: 100%; } } @-ms-keyframes showBorder { from { height: 0; } to { height: 100%; } } @-o-keyframes showBorder { from { height: 0; } to { height: 100%; } } @keyframes showBackground { from { width: 0; } to { width: 100%; } } @-webkit-keyframes showBackground { from { width: 0; } to { width: 100%; } } @-moz-keyframes showBackground { from { width: 0; } to { width: 100%; } } @-ms-keyframes showBackground { from { width: 0; } to { width: 100%; } } @-o-keyframes showBackground { from { width: 0; } to { width: 100%; } } @keyframes zoomContent { from { opacity: 0; -webkit-transform: scale3d(0.7, 0.7, 0.7); -moz-transform: scale3d(0.7, 0.7, 0.7); -ms-transform: scale3d(0.7, 0.7, 0.7); -o-transform: scale3d(0.7, 0.7, 0.7); transform: scale3d(0.7, 0.7, 0.7); } to { opacity: 1; -webkit-transform: scale3d(1, 1, 1); -moz-transform: scale3d(1, 1, 1); -ms-transform: scale3d(1, 1, 1); -o-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } @-webkit-keyframes zoomContent { from { opacity: 0; -webkit-transform: scale3d(0.7, 0.7, 0.7); -moz-transform: scale3d(0.7, 0.7, 0.7); -ms-transform: scale3d(0.7, 0.7, 0.7); -o-transform: scale3d(0.7, 0.7, 0.7); transform: scale3d(0.7, 0.7, 0.7); } to { opacity: 1; -webkit-transform: scale3d(1, 1, 1); -moz-transform: scale3d(1, 1, 1); -ms-transform: scale3d(1, 1, 1); -o-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } @-moz-keyframes zoomContent { from { opacity: 0; -webkit-transform: scale3d(0.7, 0.7, 0.7); -moz-transform: scale3d(0.7, 0.7, 0.7); -ms-transform: scale3d(0.7, 0.7, 0.7); -o-transform: scale3d(0.7, 0.7, 0.7); transform: scale3d(0.7, 0.7, 0.7); } to { opacity: 1; -webkit-transform: scale3d(1, 1, 1); -moz-transform: scale3d(1, 1, 1); -ms-transform: scale3d(1, 1, 1); -o-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } @-ms-keyframes zoomContent { from { opacity: 0; -webkit-transform: scale3d(0.7, 0.7, 0.7); -moz-transform: scale3d(0.7, 0.7, 0.7); -ms-transform: scale3d(0.7, 0.7, 0.7); -o-transform: scale3d(0.7, 0.7, 0.7); transform: scale3d(0.7, 0.7, 0.7); } to { opacity: 1; -webkit-transform: scale3d(1, 1, 1); -moz-transform: scale3d(1, 1, 1); -ms-transform: scale3d(1, 1, 1); -o-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } @-o-keyframes zoomContent { from { opacity: 0; -webkit-transform: scale3d(0.7, 0.7, 0.7); -moz-transform: scale3d(0.7, 0.7, 0.7); -ms-transform: scale3d(0.7, 0.7, 0.7); -o-transform: scale3d(0.7, 0.7, 0.7); transform: scale3d(0.7, 0.7, 0.7); } to { opacity: 1; -webkit-transform: scale3d(1, 1, 1); -moz-transform: scale3d(1, 1, 1); -ms-transform: scale3d(1, 1, 1); -o-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } /* download arrow animation */ @keyframes moveDownloadArrow { from { top: 0; } 50% { top: -7px; } 75% { top: 3px; } to { top: 0; } } @-webkit-keyframes moveDownloadArrow { from { top: 0; } 50% { top: -7px; } 75% { top: 3px; } to { top: 0; } } @-moz-keyframes moveDownloadArrow { from { top: 0; } 50% { top: -7px; } 75% { top: 3px; } to { top: 0; } } @-ms-keyframes moveDownloadArrow { from { top: 0; } 50% { top: -7px; } 75% { top: 3px; } to { top: 0; } } @-o-keyframes moveDownloadArrow { from { top: 0; } 50% { top: -7px; } 75% { top: 3px; } to { top: 0; } } /* follow link arrow animation */ @keyframes moveArrowExternal { from { top: -5px; right: 0; } 50% { top: 0; right: 5px; } 75% { top: -8px; right: -3px; } to { top: -5px; right: 0; } } @-webkit-keyframes moveArrowExternal { from { top: -5px; right: 0; } 50% { top: 0; right: 5px; } 75% { top: -8px; right: -3px; } to { top: -5px; right: 0; } } @-moz-keyframes moveArrowExternal { from { top: -5px; right: 0; } 50% { top: 0; right: 5px; } 75% { top: -8px; right: -3px; } to { top: -5px; right: 0; } } @-ms-keyframes moveArrowExternal { from { top: -5px; right: 0; } 50% { top: 0; right: 5px; } 75% { top: -8px; right: -3px; } to { top: -5px; right: 0; } } @-o-keyframes moveArrowExternal { from { top: -5px; right: 0; } 50% { top: 0; right: 5px; } 75% { top: -8px; right: -3px; } to { top: -5px; right: 0; } } /* follow link arrow animation larger scale */ @keyframes moveArrowLargeExternal { from { top: -6px; right: 1px; } 50% { top: 0; right: 6px; } 75% { top: -8px; right: -1px; } to { top: -6px; right: 1px; } } @-webkit-keyframes moveArrowLargeExternal { from { top: -6px; right: 1px; } 50% { top: 0; right: 6px; } 75% { top: -8px; right: -1px; } to { top: -6px; right: 1px; } } @-moz-keyframes moveArrowLargeExternal { from { top: -6px; right: 1px; } 50% { top: 0; right: 6px; } 75% { top: -8px; right: -1px; } to { top: -6px; right: 1px; } } @-ms-keyframes moveArrowLargeExternal { from { top: -6px; right: 1px; } 50% { top: 0; right: 6px; } 75% { top: -8px; right: -1px; } to { top: -6px; right: 1px; } } @-o-keyframes moveArrowLargeExternal { from { top: -6px; right: 1px; } 50% { top: 0; right: 6px; } 75% { top: -8px; right: -1px; } to { top: -6px; right: 1px; } } /* follow link arrow animation smaller scale */ @keyframes moveSecondLevelExternal { from { top: -4px; right: -1px; } 50% { top: -2px; right: 1px; } 75% { top: -6px; right: -3px; } to { top: -4px; right: -1px; } } @-webkit-keyframes moveSecondLevelExternal { from { top: -4px; right: -1px; } 50% { top: -2px; right: 1px; } 75% { top: -6px; right: -3px; } to { top: -4px; right: -1px; } } @-moz-keyframes moveSecondLevelExternal { from { top: -4px; right: -1px; } 50% { top: -2px; right: 1px; } 75% { top: -6px; right: -3px; } to { top: -4px; right: -1px; } } @-ms-keyframes moveSecondLevelExternal { from { top: -4px; right: -1px; } 50% { top: -2px; right: 1px; } 75% { top: -6px; right: -3px; } to { top: -4px; right: -1px; } } @-o-keyframes moveSecondLevelExternal { from { top: -4px; right: -1px; } 50% { top: -2px; right: 1px; } 75% { top: -6px; right: -3px; } to { top: -4px; right: -1px; } } /* ellipsis animation */ @-moz-keyframes ellipsis { to { width: 30px; } } @-ms-keyframes ellipsis { to { width: 30px; } } @-o-keyframes ellipsis { to { width: 30px; } } @-webkit-keyframes ellipsis { to { width: 30px; } } @keyframes ellipsis { to { width: 30px; } } /* phone animation */ @-moz-keyframes vibratePhone { from { -moz-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); -webkit-transform: rotate(0); transform: rotate(0); } 20% { -moz-transform: rotate(4deg); -ms-transform: rotate(4deg); -o-transform: rotate(4deg); -webkit-transform: rotate(4deg); transform: rotate(4deg); } 40% { -moz-transform: rotate(-4deg); -ms-transform: rotate(-4deg); -o-transform: rotate(-4deg); -webkit-transform: rotate(-4deg); transform: rotate(-4deg); } 60% { -moz-transform: rotate(4deg); -ms-transform: rotate(4deg); -o-transform: rotate(4deg); -webkit-transform: rotate(4deg); transform: rotate(4deg); } 80% { -moz-transform: rotate(-4deg); -ms-transform: rotate(-4deg); -o-transform: rotate(-4deg); -webkit-transform: rotate(-4deg); transform: rotate(-4deg); } to { -moz-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); -webkit-transform: rotate(0); transform: rotate(0); } } @-ms-keyframes vibratePhone { from { -moz-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); -webkit-transform: rotate(0); transform: rotate(0); } 20% { -moz-transform: rotate(4deg); -ms-transform: rotate(4deg); -o-transform: rotate(4deg); -webkit-transform: rotate(4deg); transform: rotate(4deg); } 40% { -moz-transform: rotate(-4deg); -ms-transform: rotate(-4deg); -o-transform: rotate(-4deg); -webkit-transform: rotate(-4deg); transform: rotate(-4deg); } 60% { -moz-transform: rotate(4deg); -ms-transform: rotate(4deg); -o-transform: rotate(4deg); -webkit-transform: rotate(4deg); transform: rotate(4deg); } 80% { -moz-transform: rotate(-4deg); -ms-transform: rotate(-4deg); -o-transform: rotate(-4deg); -webkit-transform: rotate(-4deg); transform: rotate(-4deg); } to { -moz-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); -webkit-transform: rotate(0); transform: rotate(0); } } @-o-keyframes vibratePhone { from { -moz-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); -webkit-transform: rotate(0); transform: rotate(0); } 20% { -moz-transform: rotate(4deg); -ms-transform: rotate(4deg); -o-transform: rotate(4deg); -webkit-transform: rotate(4deg); transform: rotate(4deg); } 40% { -moz-transform: rotate(-4deg); -ms-transform: rotate(-4deg); -o-transform: rotate(-4deg); -webkit-transform: rotate(-4deg); transform: rotate(-4deg); } 60% { -moz-transform: rotate(4deg); -ms-transform: rotate(4deg); -o-transform: rotate(4deg); -webkit-transform: rotate(4deg); transform: rotate(4deg); } 80% { -moz-transform: rotate(-4deg); -ms-transform: rotate(-4deg); -o-transform: rotate(-4deg); -webkit-transform: rotate(-4deg); transform: rotate(-4deg); } to { -moz-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); -webkit-transform: rotate(0); transform: rotate(0); } } @-webkit-keyframes vibratePhone { from { -moz-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); -webkit-transform: rotate(0); transform: rotate(0); } 20% { -moz-transform: rotate(4deg); -ms-transform: rotate(4deg); -o-transform: rotate(4deg); -webkit-transform: rotate(4deg); transform: rotate(4deg); } 40% { -moz-transform: rotate(-4deg); -ms-transform: rotate(-4deg); -o-transform: rotate(-4deg); -webkit-transform: rotate(-4deg); transform: rotate(-4deg); } 60% { -moz-transform: rotate(4deg); -ms-transform: rotate(4deg); -o-transform: rotate(4deg); -webkit-transform: rotate(4deg); transform: rotate(4deg); } 80% { -moz-transform: rotate(-4deg); -ms-transform: rotate(-4deg); -o-transform: rotate(-4deg); -webkit-transform: rotate(-4deg); transform: rotate(-4deg); } to { -moz-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); -webkit-transform: rotate(0); transform: rotate(0); } } @keyframes vibratePhone { from { -moz-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); -webkit-transform: rotate(0); transform: rotate(0); } 20% { -moz-transform: rotate(4deg); -ms-transform: rotate(4deg); -o-transform: rotate(4deg); -webkit-transform: rotate(4deg); transform: rotate(4deg); } 40% { -moz-transform: rotate(-4deg); -ms-transform: rotate(-4deg); -o-transform: rotate(-4deg); -webkit-transform: rotate(-4deg); transform: rotate(-4deg); } 60% { -moz-transform: rotate(4deg); -ms-transform: rotate(4deg); -o-transform: rotate(4deg); -webkit-transform: rotate(4deg); transform: rotate(4deg); } 80% { -moz-transform: rotate(-4deg); -ms-transform: rotate(-4deg); -o-transform: rotate(-4deg); -webkit-transform: rotate(-4deg); transform: rotate(-4deg); } to { -moz-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); -webkit-transform: rotate(0); transform: rotate(0); } } @-moz-keyframes sendSignal { from { opacity: 0; -moz-transform: translate(0, 0) scale(1); -ms-transform: translate(0, 0) scale(1); -o-transform: translate(0, 0) scale(1); -webkit-transform: translate(0, 0) scale(1); transform: translate(0, 0) scale(1); } 50% { opacity: 0.7; -moz-transform: translate(3px, -3px) scale(1.2); -ms-transform: translate(3px, -3px) scale(1.2); -o-transform: translate(3px, -3px) scale(1.2); -webkit-transform: translate(3px, -3px) scale(1.2); transform: translate(3px, -3px) scale(1.2); } to { opacity: 0.2; -moz-transform: translate(6px, -6px) scale(1.4); -ms-transform: translate(6px, -6px) scale(1.4); -o-transform: translate(6px, -6px) scale(1.4); -webkit-transform: translate(6px, -6px) scale(1.4); transform: translate(6px, -6px) scale(1.4); } } @-ms-keyframes sendSignal { from { opacity: 0; -moz-transform: translate(0, 0) scale(1); -ms-transform: translate(0, 0) scale(1); -o-transform: translate(0, 0) scale(1); -webkit-transform: translate(0, 0) scale(1); transform: translate(0, 0) scale(1); } 50% { opacity: 0.7; -moz-transform: translate(3px, -3px) scale(1.2); -ms-transform: translate(3px, -3px) scale(1.2); -o-transform: translate(3px, -3px) scale(1.2); -webkit-transform: translate(3px, -3px) scale(1.2); transform: translate(3px, -3px) scale(1.2); } to { opacity: 0.2; -moz-transform: translate(6px, -6px) scale(1.4); -ms-transform: translate(6px, -6px) scale(1.4); -o-transform: translate(6px, -6px) scale(1.4); -webkit-transform: translate(6px, -6px) scale(1.4); transform: translate(6px, -6px) scale(1.4); } } @-o-keyframes sendSignal { from { opacity: 0; -moz-transform: translate(0, 0) scale(1); -ms-transform: translate(0, 0) scale(1); -o-transform: translate(0, 0) scale(1); -webkit-transform: translate(0, 0) scale(1); transform: translate(0, 0) scale(1); } 50% { opacity: 0.7; -moz-transform: translate(3px, -3px) scale(1.2); -ms-transform: translate(3px, -3px) scale(1.2); -o-transform: translate(3px, -3px) scale(1.2); -webkit-transform: translate(3px, -3px) scale(1.2); transform: translate(3px, -3px) scale(1.2); } to { opacity: 0.2; -moz-transform: translate(6px, -6px) scale(1.4); -ms-transform: translate(6px, -6px) scale(1.4); -o-transform: translate(6px, -6px) scale(1.4); -webkit-transform: translate(6px, -6px) scale(1.4); transform: translate(6px, -6px) scale(1.4); } } @-webkit-keyframes sendSignal { from { opacity: 0; -moz-transform: translate(0, 0) scale(1); -ms-transform: translate(0, 0) scale(1); -o-transform: translate(0, 0) scale(1); -webkit-transform: translate(0, 0) scale(1); transform: translate(0, 0) scale(1); } 50% { opacity: 0.7; -moz-transform: translate(3px, -3px) scale(1.2); -ms-transform: translate(3px, -3px) scale(1.2); -o-transform: translate(3px, -3px) scale(1.2); -webkit-transform: translate(3px, -3px) scale(1.2); transform: translate(3px, -3px) scale(1.2); } to { opacity: 0.2; -moz-transform: translate(6px, -6px) scale(1.4); -ms-transform: translate(6px, -6px) scale(1.4); -o-transform: translate(6px, -6px) scale(1.4); -webkit-transform: translate(6px, -6px) scale(1.4); transform: translate(6px, -6px) scale(1.4); } } @keyframes sendSignal { from { opacity: 0; -moz-transform: translate(0, 0) scale(1); -ms-transform: translate(0, 0) scale(1); -o-transform: translate(0, 0) scale(1); -webkit-transform: translate(0, 0) scale(1); transform: translate(0, 0) scale(1); } 50% { opacity: 0.7; -moz-transform: translate(3px, -3px) scale(1.2); -ms-transform: translate(3px, -3px) scale(1.2); -o-transform: translate(3px, -3px) scale(1.2); -webkit-transform: translate(3px, -3px) scale(1.2); transform: translate(3px, -3px) scale(1.2); } to { opacity: 0.2; -moz-transform: translate(6px, -6px) scale(1.4); -ms-transform: translate(6px, -6px) scale(1.4); -o-transform: translate(6px, -6px) scale(1.4); -webkit-transform: translate(6px, -6px) scale(1.4); transform: translate(6px, -6px) scale(1.4); } } /* email animation */ @-moz-keyframes animateEnvelope { from { border-top: 2px solid #360554; } 50% { border-top: 2px solid #f7f7f7; } to { border-top: 2px solid #360554; } } @-ms-keyframes animateEnvelope { from { border-top: 2px solid #360554; } 50% { border-top: 2px solid #f7f7f7; } to { border-top: 2px solid #360554; } } @-o-keyframes animateEnvelope { from { border-top: 2px solid #360554; } 50% { border-top: 2px solid #f7f7f7; } to { border-top: 2px solid #360554; } } @-webkit-keyframes animateEnvelope { from { border-top: 2px solid #360554; } 50% { border-top: 2px solid #f7f7f7; } to { border-top: 2px solid #360554; } } @keyframes animateEnvelope { from { border-top: 2px solid #360554; } 50% { border-top: 2px solid #f7f7f7; } to { border-top: 2px solid #360554; } } @-moz-keyframes animateEnvelopeLeft { from { -moz-transform: rotate(35deg); -ms-transform: rotate(35deg); -o-transform: rotate(35deg); -webkit-transform: rotate(35deg); transform: rotate(35deg); } 50% { -moz-transform: rotate(-35deg); -ms-transform: rotate(-35deg); -o-transform: rotate(-35deg); -webkit-transform: rotate(-35deg); transform: rotate(-35deg); } to { -moz-transform: rotate(35deg); -ms-transform: rotate(35deg); -o-transform: rotate(35deg); -webkit-transform: rotate(35deg); transform: rotate(35deg); } } @-ms-keyframes animateEnvelopeLeft { from { -moz-transform: rotate(35deg); -ms-transform: rotate(35deg); -o-transform: rotate(35deg); -webkit-transform: rotate(35deg); transform: rotate(35deg); } 50% { -moz-transform: rotate(-35deg); -ms-transform: rotate(-35deg); -o-transform: rotate(-35deg); -webkit-transform: rotate(-35deg); transform: rotate(-35deg); } to { -moz-transform: rotate(35deg); -ms-transform: rotate(35deg); -o-transform: rotate(35deg); -webkit-transform: rotate(35deg); transform: rotate(35deg); } } @-o-keyframes animateEnvelopeLeft { from { -moz-transform: rotate(35deg); -ms-transform: rotate(35deg); -o-transform: rotate(35deg); -webkit-transform: rotate(35deg); transform: rotate(35deg); } 50% { -moz-transform: rotate(-35deg); -ms-transform: rotate(-35deg); -o-transform: rotate(-35deg); -webkit-transform: rotate(-35deg); transform: rotate(-35deg); } to { -moz-transform: rotate(35deg); -ms-transform: rotate(35deg); -o-transform: rotate(35deg); -webkit-transform: rotate(35deg); transform: rotate(35deg); } } @-webkit-keyframes animateEnvelopeLeft { from { -moz-transform: rotate(35deg); -ms-transform: rotate(35deg); -o-transform: rotate(35deg); -webkit-transform: rotate(35deg); transform: rotate(35deg); } 50% { -moz-transform: rotate(-35deg); -ms-transform: rotate(-35deg); -o-transform: rotate(-35deg); -webkit-transform: rotate(-35deg); transform: rotate(-35deg); } to { -moz-transform: rotate(35deg); -ms-transform: rotate(35deg); -o-transform: rotate(35deg); -webkit-transform: rotate(35deg); transform: rotate(35deg); } } @keyframes animateEnvelopeLeft { from { -moz-transform: rotate(35deg); -ms-transform: rotate(35deg); -o-transform: rotate(35deg); -webkit-transform: rotate(35deg); transform: rotate(35deg); } 50% { -moz-transform: rotate(-35deg); -ms-transform: rotate(-35deg); -o-transform: rotate(-35deg); -webkit-transform: rotate(-35deg); transform: rotate(-35deg); } to { -moz-transform: rotate(35deg); -ms-transform: rotate(35deg); -o-transform: rotate(35deg); -webkit-transform: rotate(35deg); transform: rotate(35deg); } } @-moz-keyframes animateEnvelopeRight { from { -moz-transform: rotate(-35deg); -ms-transform: rotate(-35deg); -o-transform: rotate(-35deg); -webkit-transform: rotate(-35deg); transform: rotate(-35deg); } 50% { -moz-transform: rotate(35deg); -ms-transform: rotate(35deg); -o-transform: rotate(35deg); -webkit-transform: rotate(35deg); transform: rotate(35deg); } to { -moz-transform: rotate(-35deg); -ms-transform: rotate(-35deg); -o-transform: rotate(-35deg); -webkit-transform: rotate(-35deg); transform: rotate(-35deg); } } @-ms-keyframes animateEnvelopeRight { from { -moz-transform: rotate(-35deg); -ms-transform: rotate(-35deg); -o-transform: rotate(-35deg); -webkit-transform: rotate(-35deg); transform: rotate(-35deg); } 50% { -moz-transform: rotate(35deg); -ms-transform: rotate(35deg); -o-transform: rotate(35deg); -webkit-transform: rotate(35deg); transform: rotate(35deg); } to { -moz-transform: rotate(-35deg); -ms-transform: rotate(-35deg); -o-transform: rotate(-35deg); -webkit-transform: rotate(-35deg); transform: rotate(-35deg); } } @-o-keyframes animateEnvelopeRight { from { -moz-transform: rotate(-35deg); -ms-transform: rotate(-35deg); -o-transform: rotate(-35deg); -webkit-transform: rotate(-35deg); transform: rotate(-35deg); } 50% { -moz-transform: rotate(35deg); -ms-transform: rotate(35deg); -o-transform: rotate(35deg); -webkit-transform: rotate(35deg); transform: rotate(35deg); } to { -moz-transform: rotate(-35deg); -ms-transform: rotate(-35deg); -o-transform: rotate(-35deg); -webkit-transform: rotate(-35deg); transform: rotate(-35deg); } } @-webkit-keyframes animateEnvelopeRight { from { -moz-transform: rotate(-35deg); -ms-transform: rotate(-35deg); -o-transform: rotate(-35deg); -webkit-transform: rotate(-35deg); transform: rotate(-35deg); } 50% { -moz-transform: rotate(35deg); -ms-transform: rotate(35deg); -o-transform: rotate(35deg); -webkit-transform: rotate(35deg); transform: rotate(35deg); } to { -moz-transform: rotate(-35deg); -ms-transform: rotate(-35deg); -o-transform: rotate(-35deg); -webkit-transform: rotate(-35deg); transform: rotate(-35deg); } } @keyframes animateEnvelopeRight { from { -moz-transform: rotate(-35deg); -ms-transform: rotate(-35deg); -o-transform: rotate(-35deg); -webkit-transform: rotate(-35deg); transform: rotate(-35deg); } 50% { -moz-transform: rotate(35deg); -ms-transform: rotate(35deg); -o-transform: rotate(35deg); -webkit-transform: rotate(35deg); transform: rotate(35deg); } to { -moz-transform: rotate(-35deg); -ms-transform: rotate(-35deg); -o-transform: rotate(-35deg); -webkit-transform: rotate(-35deg); transform: rotate(-35deg); } } @-moz-keyframes animateEnvelopeInner { from { opacity: 0; } 10% { opacity: 1; } 90% { opacity: 1; } to { opacity: 0; } } @-ms-keyframes animateEnvelopeInner { from { opacity: 0; } 10% { opacity: 1; } 90% { opacity: 1; } to { opacity: 0; } } @-o-keyframes animateEnvelopeInner { from { opacity: 0; } 10% { opacity: 1; } 90% { opacity: 1; } to { opacity: 0; } } @-webkit-keyframes animateEnvelopeInner { from { opacity: 0; } 10% { opacity: 1; } 90% { opacity: 1; } to { opacity: 0; } } @keyframes animateEnvelopeInner { from { opacity: 0; } 10% { opacity: 1; } 90% { opacity: 1; } to { opacity: 0; } } @-moz-keyframes animateLetter { from { opacity: 0; width: 13px; height: 9px; top: -16px; left: -22px; } 50% { opacity: 0.7; top: -8px; left: 0; } to { opacity: 0; width: 24px; height: 9px; top: 0; left: 0; } } @-ms-keyframes animateLetter { from { opacity: 0; width: 13px; height: 9px; top: -16px; left: -22px; } 50% { opacity: 0.7; top: -8px; left: 0; } to { opacity: 0; width: 24px; height: 9px; top: 0; left: 0; } } @-o-keyframes animateLetter { from { opacity: 0; width: 13px; height: 9px; top: -16px; left: -22px; } 50% { opacity: 0.7; top: -8px; left: 0; } to { opacity: 0; width: 24px; height: 9px; top: 0; left: 0; } } @-webkit-keyframes animateLetter { from { opacity: 0; width: 13px; height: 9px; top: -16px; left: -22px; } 50% { opacity: 0.7; top: -8px; left: 0; } to { opacity: 0; width: 24px; height: 9px; top: 0; left: 0; } } @-moz-keyframes animateFax { from { opacity: 1; -moz-transform: translate(0, 0) scale(1); -ms-transform: translate(0, 0) scale(1); -o-transform: translate(0, 0) scale(1); -webkit-transform: translate(0, 0) scale(1); transform: translate(0, 0) scale(1); } 50% { opacity: 0.5; -moz-transform: translate(0, 15px) scale(0.7); -ms-transform: translate(0, 15px) scale(0.7); -o-transform: translate(0, 15px) scale(0.7); -webkit-transform: translate(0, 15px) scale(0.7); transform: translate(0, 15px) scale(0.7); } to { opacitY: 0; -moz-transform: translate(-20px, 40px) scale(0.5); -ms-transform: translate(-20px, 40px) scale(0.5); -o-transform: translate(-20px, 40px) scale(0.5); -webkit-transform: translate(-20px, 40px) scale(0.5); transform: translate(-20px, 40px) scale(0.5); } } @-ms-keyframes animateFax { from { opacity: 1; -moz-transform: translate(0, 0) scale(1); -ms-transform: translate(0, 0) scale(1); -o-transform: translate(0, 0) scale(1); -webkit-transform: translate(0, 0) scale(1); transform: translate(0, 0) scale(1); } 50% { opacity: 0.5; -moz-transform: translate(0, 15px) scale(0.7); -ms-transform: translate(0, 15px) scale(0.7); -o-transform: translate(0, 15px) scale(0.7); -webkit-transform: translate(0, 15px) scale(0.7); transform: translate(0, 15px) scale(0.7); } to { opacitY: 0; -moz-transform: translate(-20px, 40px) scale(0.5); -ms-transform: translate(-20px, 40px) scale(0.5); -o-transform: translate(-20px, 40px) scale(0.5); -webkit-transform: translate(-20px, 40px) scale(0.5); transform: translate(-20px, 40px) scale(0.5); } } @-o-keyframes animateFax { from { opacity: 1; -moz-transform: translate(0, 0) scale(1); -ms-transform: translate(0, 0) scale(1); -o-transform: translate(0, 0) scale(1); -webkit-transform: translate(0, 0) scale(1); transform: translate(0, 0) scale(1); } 50% { opacity: 0.5; -moz-transform: translate(0, 15px) scale(0.7); -ms-transform: translate(0, 15px) scale(0.7); -o-transform: translate(0, 15px) scale(0.7); -webkit-transform: translate(0, 15px) scale(0.7); transform: translate(0, 15px) scale(0.7); } to { opacitY: 0; -moz-transform: translate(-20px, 40px) scale(0.5); -ms-transform: translate(-20px, 40px) scale(0.5); -o-transform: translate(-20px, 40px) scale(0.5); -webkit-transform: translate(-20px, 40px) scale(0.5); transform: translate(-20px, 40px) scale(0.5); } } @-webkit-keyframes animateFax { from { opacity: 1; -moz-transform: translate(0, 0) scale(1); -ms-transform: translate(0, 0) scale(1); -o-transform: translate(0, 0) scale(1); -webkit-transform: translate(0, 0) scale(1); transform: translate(0, 0) scale(1); } 50% { opacity: 0.5; -moz-transform: translate(0, 15px) scale(0.7); -ms-transform: translate(0, 15px) scale(0.7); -o-transform: translate(0, 15px) scale(0.7); -webkit-transform: translate(0, 15px) scale(0.7); transform: translate(0, 15px) scale(0.7); } to { opacitY: 0; -moz-transform: translate(-20px, 40px) scale(0.5); -ms-transform: translate(-20px, 40px) scale(0.5); -o-transform: translate(-20px, 40px) scale(0.5); -webkit-transform: translate(-20px, 40px) scale(0.5); transform: translate(-20px, 40px) scale(0.5); } } @keyframes animateFax { from { opacity: 1; -moz-transform: translate(0, 0) scale(1); -ms-transform: translate(0, 0) scale(1); -o-transform: translate(0, 0) scale(1); -webkit-transform: translate(0, 0) scale(1); transform: translate(0, 0) scale(1); } 50% { opacity: 0.5; -moz-transform: translate(0, 15px) scale(0.7); -ms-transform: translate(0, 15px) scale(0.7); -o-transform: translate(0, 15px) scale(0.7); -webkit-transform: translate(0, 15px) scale(0.7); transform: translate(0, 15px) scale(0.7); } to { opacitY: 0; -moz-transform: translate(-20px, 40px) scale(0.5); -ms-transform: translate(-20px, 40px) scale(0.5); -o-transform: translate(-20px, 40px) scale(0.5); -webkit-transform: translate(-20px, 40px) scale(0.5); transform: translate(-20px, 40px) scale(0.5); } } /* normalise 3.0.1 */ *{-webkit-tap-highlight-color:rgba(255,255,255,0);-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}audio,canvas,video{display:inline-block;*display:inline;*zoom:1}[hidden],audio:not([controls]){display:none}html{font-size:100%;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}button,html,input,select,textarea{font-family:'PT Sans',sans-serif;color:#222}body{margin:0;font-size:12px;line-height:1.4}a{color:#00e}a:visited{color:#551a8b}a:hover{color:#06e}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}blockquote{margin:1em 40px}dfn{font-style:italic}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}ins{background:#ff9;color:#000;text-decoration:none}mark{background:#ff0;color:#000;font-style:italic;font-weight:700}code,kbd,pre,samp{font-family:monospace,serif;_font-family:'courier new',monospace;font-size:1em}pre{white-space:pre;white-space:pre-wrap;word-wrap:break-word}q{quotes:none}q:after,q:before{content:"";content:none}small{font-size:85%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}ol,ul{margin:0;padding-left:30px}dd{margin:0 0 0 40px}nav ol,nav ul{list-style:none;list-style-image:none;margin:0;padding:0}svg:not(:root){overflow:hidden}figure,form{margin:0}fieldset{border:0;margin:0;padding:0}label{cursor:pointer}legend{border:0;*margin-left:-7px;padding:0;white-space:normal}button,input,select,textarea{font-size:100%;margin:0;vertical-align:baseline;*vertical-align:middle}button,input{line-height:normal}button,input[type=button],input[type=reset],input[type=submit]{cursor:pointer;-webkit-appearance:button;*overflow:visible}button[disabled],input[disabled]{cursor:default}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0;*width:13px;*height:13px}input[type=search]{-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}textarea{overflow:auto;vertical-align:top;resize:vertical}input:invalid,textarea:invalid{background-color:#f0dddd}table{border-collapse:collapse;border-spacing:0}td{vertical-align:top}.chromeframe{margin:0.2em 0;background:#ccc;color:#000;padding:0.2em 0}input[type=email],input[type=number],input[type=password],input[type=reset],input[type=search],input[type=submit],input[type=text],textarea{-webkit-border-radius:0;border-radius:0;-webkit-appearance:none}select{-webkit-border-radius:0;border-radius:0}a,a:focus,a:hover,input,input:focus,select,select:focus,textarea,textarea:focus{outline:0;-webkit-tap-highlight-color:rgba(255,255,255,0)}.cf:after,.cf:before{content:"";display:table}.cf:after{clear:both}.cf{zoom:1}[aria-hidden="true"]{display:none !important} /* responsive 2.0.0 */ .responsive-image-container { position: absolute; top: 0; left: 0; width: 100%; height: 100%; margin: auto; overflow: hidden; } .responsive-image-container img.responsive-image { position: absolute; max-width: none; top: 0; left: 0; border: none; outline: none; opacity: 0; filter: alpha(opacity=0); -webkit-transition: opacity 0.3s; -moz-transition: opacity 0.3s; -ms-transition: opacity 0.3s; -o-transition: opacity 0.3s; transition: opacity 0.3s; } .responsive-image-container img.responsive-image.fitted-wide { width: 100%; height: auto; top: 50%; left: 0; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } .responsive-image-container img.responsive-image.fitted-tall { height: 100%; width: auto; top: 0; left: 50%; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); } .responsive-image-container img.responsive-image.fitted-object-fit { top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; transition: none; } .responsive-image-container img.responsive-image.fitted-margins { -webkit-transform: none; -moz-transform: none; -ms-transform: none; -o-transform: none; transform: none; } .no-js .responsive-image-container img.responsive-image, .responsive-image-container img.responsive-image.fitted { opacity: 1; filter: alpha(opacity=100); } .no-js .responsive-image-container img.responsive-image { width: 100%; height: auto; top: 0; left: 0; } /* global ============================ */ @import url("//hello.myfonts.net/count/345f17"); /* @font-face */ @font-face { font-family: "Freight Sans W01 Semibold"; src: url("/Fonts/FreightSans/d154fe01-4538-4277-9e56-74538134d43b.eot?#iefix"); src: url("/Fonts/FreightSans/d154fe01-4538-4277-9e56-74538134d43b.eot?#iefix") format("eot"),url("/Fonts/FreightSans/84efe8b8-d2b9-464c-93b4-1237a3cb52c3.woff2") format("woff2"),url("/Fonts/FreightSans/0bef275a-3f3b-4cd1-8aa0-3535eefb27c0.woff") format("woff"),url("/Fonts/FreightSans/e0be4e39-367d-4f71-84cf-5b18ccc68510.ttf") format("truetype"); } @font-face { font-family: "Freight Sans W03 Medium"; src: url("/Fonts/FreightSans/0b5df096-1809-4ede-bcf6-dcf708de9efe.eot?#iefix"); src: url("/Fonts/FreightSans/0b5df096-1809-4ede-bcf6-dcf708de9efe.eot?#iefix") format("eot"),url("/Fonts/FreightSans/8b338cb3-bb89-40d3-8c01-5580bceb3715.woff2") format("woff2"),url("/Fonts/FreightSans/4901a31a-f392-404a-a900-77532930640a.woff") format("woff"),url("/Fonts/FreightSans/4d13c8f1-526a-4c9a-ac70-6d7a855f4c4c.ttf") format("truetype"); } @font-face { font-family: "FreightSans W01 Book"; src: url("/Fonts/FreightSans/bcf99a42-5caf-468b-8e66-66723f76bff3.eot?#iefix"); src: url("/Fonts/FreightSans/bcf99a42-5caf-468b-8e66-66723f76bff3.eot?#iefix") format("eot"),url("/Fonts/FreightSans/7eb5d6ea-90f7-45d2-b771-5bd5b4978eb0.woff2") format("woff2"),url("/Fonts/FreightSans/204e59d2-807e-4208-8c9a-7b6b18a37f2b.woff") format("woff"),url("/Fonts/FreightSans/2ef2ae21-f888-48e0-b607-fa5f9bf9cbd3.ttf") format("truetype"); } @font-face { font-family: "AvenirLTStd-Book"; src: url("/Fonts/Avenir/345F17_0_0.eot"); src: url("/Fonts/Avenir/345F17_0_0.eot?#iefix") format("embedded-opentype"),url("/Fonts/Avenir/345F17_0_0.woff2") format("woff2"),url("/Fonts/Avenir/345F17_0_0.woff") format("woff"),url("/Fonts/Avenir/345F17_0_0.ttf") format("truetype"); } @font-face { font-family: "AvenirLTStd-MediumOblique"; src: url("/Fonts/Avenir/345F17_1_0.eot"); src: url("/Fonts/Avenir/345F17_1_0.eot?#iefix") format("embedded-opentype"),url("/Fonts/Avenir/345F17_1_0.woff2") format("woff2"),url("/Fonts/Avenir/345F17_1_0.woff") format("woff"),url("/Fonts/Avenir/345F17_1_0.ttf") format("truetype"); } @font-face { font-family: "AvenirLTStd-BookOblique"; src: url("/Fonts/Avenir/345F17_2_0.eot"); src: url("/Fonts/Avenir/345F17_2_0.eot?#iefix") format("embedded-opentype"),url("/Fonts/Avenir/345F17_2_0.woff2") format("woff2"),url("/Fonts/Avenir/345F17_2_0.woff") format("woff"),url("/Fonts/Avenir/345F17_2_0.ttf") format("truetype"); } @font-face { font-family: "AvenirLTStd-Medium"; src: url("/Fonts/Avenir/345F17_3_0.eot"); src: url("/Fonts/Avenir/345F17_3_0.eot?#iefix") format("embedded-opentype"),url("/Fonts/Avenir/345F17_3_0.woff2") format("woff2"),url("/Fonts/Avenir/345F17_3_0.woff") format("woff"),url("/Fonts/Avenir/345F17_3_0.ttf") format("truetype"); } @font-face { font-family: "AvenirLTStd-BlackOblique"; src: url("/Fonts/Avenir/345F17_4_0.eot"); src: url("/Fonts/Avenir/345F17_4_0.eot?#iefix") format("embedded-opentype"),url("/Fonts/Avenir/345F17_4_0.woff2") format("woff2"),url("/Fonts/Avenir/345F17_4_0.woff") format("woff"),url("/Fonts/Avenir/345F17_4_0.ttf") format("truetype"); } @font-face { font-family: "AvenirLTStd-Black"; src: url("/Fonts/Avenir/345F17_5_0.eot"); src: url("/Fonts/Avenir/345F17_5_0.eot?#iefix") format("embedded-opentype"),url("/Fonts/Avenir/345F17_5_0.woff2") format("woff2"),url("/Fonts/Avenir/345F17_5_0.woff") format("woff"),url("/Fonts/Avenir/345F17_5_0.ttf") format("truetype"); } html { -webkit-overflow-scrolling: touch; -webkit-font-smoothing: antialiased; -webkit-text-size-adjust: 100%; -ms-font-feature-settings: inherit; -ms-text-size-adjust: 100%; font-size: 62.5%; min-height: 100%; overflow-x: hidden; margin: 0; padding: 0; } body { background: #ffffff; color: #1f1f1f; font-family: "AvenirLTStd-Book", Arial, 'Helvetica Neue', Helvetica, sans-serif; font-size: 16px; letter-spacing: 0; line-height: 28px; margin: 0; height: 100%; padding: 0; position: relative; } html.overflow-hidden, html.overflow-hidden body { overflow: hidden; position: relative; } html.ios.overflow-hidden, html.ios.overflow-hidden body { -webkit-overflow-scrolling: auto; height: 100%; width: 100%; } html.ja body, html.ja body * { font-family: Meiryo UI, "AvenirLTStd-Book", Arial, 'Helvetica Neue', Helvetica, sans-serif; } #site-wrapper { min-height: 100%; min-height: 100vh; min-width: 320px; position: relative; } #site-overlay { background: rgba(0,0,0,0.5); height: 100%; left: 0; opacity: 0; position: absolute; top: 0; transition: 0.3s ease visibility, 0.3s ease opacity; visibility: hidden; width: 100%; z-index: 1; } #site-overlay.active { opacity: 1; visibility: visible; } .wrapper { margin: 0 auto; max-width: 1200px; max-width: 120rem; padding: 0; } #main { max-width: 100%; overflow: hidden; } h1, h2, h3, h4, h5, h6 { font-family: "Freight Sans W01 Semibold", Arial, 'Helvetica Neue', Helvetica, sans-serif; font-weight: 400; letter-spacing: -0.02em; margin: 0 0 33px; padding: 0; position: relative; } h1 { font-size: 6.4rem; line-height: 7rem; } h2 { font-family: "Freight Sans W03 Medium", Arial, 'Helvetica Neue', Helvetica, sans-serif; font-size: 4.8rem; line-height: 5.2rem; } h3 { font-family: "Freight Sans W03 Medium", Arial, 'Helvetica Neue', Helvetica, sans-serif; font-size: 3.6rem; line-height: 4.2rem; } h4 { font-family: "Freight Sans W03 Medium", Arial, 'Helvetica Neue', Helvetica, sans-serif; font-size: 2.8rem; line-height: 3rem; } h5 { font-size: 1.8rem; line-height: 2.4rem; } h6 { color: #360554; font-family: "AvenirLTStd-Black", Arial, 'Helvetica Neue', Helvetica, sans-serif; font-size: 1.6rem; line-height: 2.2rem; } .feature h2 { color: #00a896; letter-spacing: -0.01em; line-height: 5rem; margin-bottom: 38px; padding-left: 14px; } .feature h2:before { background: #ed9c11; content: ""; height: 30px; left: 0; position: absolute; top: 12px; width: 4px; } .feature h2 > a { color: #00a896; } .feature h2 > a:hover { color: #360554; } p { margin: 0; padding: 0; } a, button, .button { color: #360554; border: none; font-weight: 400; outline: none; text-decoration: none; -moz-transition: 0.3s ease; -ms-transition: 0.3s ease; -o-transition: 0.3s ease; -webkit-transition: 0.3s ease; transition: 0.3s ease; } a:visited { color: #360554; } a:hover, a:focus, a:visited:hover { color: #005daa; } ul, ul > li, ol, ol > li { list-style: none; outline: none; padding: 0; position: relative; } button { background: none; border: none; font-family: "AvenirLTStd-Medium", Arial, 'Helvetica Neue', Helvetica, sans-serif; font-weight: 400; outline: none; padding: 0; } .button, button.button, .button.secondary, .blue-bg .form .full-submit { background: #360554; border: none; box-shadow: none; color: #ffffff; display: inline-block; font-family: "AvenirLTStd-Medium", Arial, 'Helvetica Neue', Helvetica, sans-serif; font-size: 2.1rem; letter-spacing: -0.02em; line-height: 2.7rem; outline: none; padding: 13px 37px 14px; position: relative; text-align: center; vertical-align: top; z-index: 0; } .button:before, button.button:before, .button.secondary:before, .button.tertiary:before { background: #ffffff; -moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2); box-shadow: 0 0 4px rgba(0, 0, 0, 0.2); content: ""; display: block; height: 100%; left: 0; position: absolute; top: 0; -moz-transition: 0.3s ease; -ms-transition: 0.3s ease; -o-transition: 0.3s ease; -webkit-transition: 0.3s ease; transition: 0.3s ease; width: 0; z-index: -1; } .button:hover, .button:focus, button.button:hover, button.button:focus, .button.secondary:hover, .button.secondary:focus, .button:visited:hover, button.button:visited:hover, .button:visited:focus, button.button:visited:focus, .button.secondary:visited:hover, .button.secondary:visited:focus, .blue-bg .form .full-submit:hover, .blue-bg .form .full-submit:focus { color: #360554; } .button:visited, button.button:visited, .button.secondary:visited { color: #ffffff; } .button:hover:before, .button:focus:before, button.button:hover:before, button.button:focus:before, .button.tertiary:hover:before, .button.tertiary:focus:before, .button.secondary:hover:before, .button.secondary:focus:before, .button.tertiary:hover:before, .button.tertiary:focus:before, .form .submit:hover:before, .form .submit:focus:before, .button.tab-item.current:before, #header-links .form-toggle:focus:before { width: 100%; } .ie .button:hover:before, .ie .button:focus:before, .ie button.button:hover:before, .ie button.button:focus:before { border: 1px solid #ececec; } .button.tab-item { background: #ffffff; border: none; border-top: solid 1px #ececec; border-bottom: solid 1px #ececec; box-shadow: none; color: #360554; display: inline-block; font-family: "AvenirLTStd-Medium", Arial, 'Helvetica Neue', Helvetica, sans-serif; font-size: 2.1rem; line-height: 2.7rem; letter-spacing: -0.02em; outline: none; padding: 13px 37px 14px; margin-right: 30px; position: relative; text-align: center; vertical-align: top; z-index: 0; } .button.tab-item:before { background: #360554; } .button.tab-item:hover, .button.tab-item.current { color: #ffffff; } .button.tab-item:last-child { margin-right: 0; } .button.tab-item:hover:before { width: 100%; } .button.primary { background: none; color: #360554; font-size: 2.1rem; line-height: 3rem; padding: 0; text-align: left; } .button.primary:before { display: none; } .button.primary:after { background: #ed9c11; clear: both; content: ""; display: block; height: 4px; margin-top: 13px; -moz-transition: 0.3s ease; -ms-transition: 0.3s ease; -o-transition: 0.3s ease; -webkit-transition: 0.3s ease; transition: 0.3s ease; width: 63px; } .button.primary:hover, .button.primary:focus { color: #360554; } .button.primary:hover:after, .button.primary:focus:after { width: 83px; } .button.tertiary, .purple-bg .button.secondary, .purple-bg .form .full-submit, .tertiary-bg .button.secondary, .tertiary-bg .form .full-submit { background: #0094f3; color: #ffffff; } .button.tertiary:hover, .button.tertiary:focus, .purple-bg .button.secondary:hover, .purple-bg .button.secondary:focus, .tertiary-bg .button.secondary:hover, .tertiary-bg .button.secondary:focus { color: #0094f3; } .blue-bg .button.primary, .purple-bg .button.primary, .tertiary-bg .button.primary, .blue-bg .button.primary:hover { color: #ffffff; } /* background colours ============================ */ .grey-bg, .secondary-bg { background: #f7f7f7; } .purple-bg, .tertiary-bg { background: #12003b; background: -moz-linear-gradient(left, #12003b 0%, #3f065b 100%); background: -webkit-linear-gradient(left, #12003b 0%,#3f065b 100%); background: linear-gradient(to right, #12003b 0%,#3f065b 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#12003b', endColorstr='#3f065b',GradientType=1 ); } .tertiary-opaque-bg { background: rgb(18,0,59); background: -moz-linear-gradient(left, rgba(18,0,59,0.75) 0%, rgba(63,6,91,0.75) 100%); background: -webkit-linear-gradient(left, rgba(18,0,59,0.75) 0%,rgba(63,6,91,1) 100%); background: linear-gradient(to right, rgba(18,0,59,0.75) 0%,rgba(63,6,91,0.75) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#12003b', endColorstr='#3f065b',GradientType=1 ); } .blue-bg, .quaternary-bg { background: #0074ee; background: -moz-linear-gradient(left, #0074ee 0%, #00aaf7 100%); background: -webkit-linear-gradient(left, #0074ee 0%,#00aaf7 100%); background: linear-gradient(to right, #0074ee 0%,#00aaf7 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0074ee', endColorstr='#00aaf7',GradientType=1 ); } .quinary-bg { background: #00a896; } .white-bg { background: #ffffff; -webkit-box-shadow: inset 0 0 0 2px #f2f2f2; -moz-box-shadow: inset 0 0 0 2px #f2f2f2; box-shadow: inset 0 0 0 2px #f2f2f2; } /* columns ============================ */ .column { float: left; } /* two-column */ .two-column { margin: 0 -2%; } .two-column .column { padding: 0 2% 1%; width: 50%; } .two-column .column:nth-child(2n+1) { clear: left; } /* three column */ .three-column { margin: 0 -2%; } .three-column .column { padding: 0 2% 51px; width: 33.33%; } .three-column .column:nth-child(3n+1) { clear: left; } /* four column */ .four-column { margin: 0 -1%; } .four-column .column { padding: 0 1%; width: 25%; } .four-column .column:nth-child(4n+1) { clear: left; } /* five column */ .five-column { margin: 0 -0.5%; } .five-column .column { padding: 0 0.5%; width: 20%; } .five-column .column:nth-child(5n+1) { clear: left; } /* six column */ .six-column { margin: 0 -1%; } .six-column .column { padding: 0 1%; width: 12%; } .six-column .column:nth-child(6n+1) { clear: left; } /* page level ============================ */ /* accordions */ .accordion .accordion-content { display: none; } /* articles */ .article-details { padding: 42px 0 20px; } .article-details h1 { color: #00a896; font-family: "FreightSans W01 Book"; padding-left: 32px; } .article-details h1:before { content: ""; width: 4px; height: 40px; position: absolute; top: 18px; left: 0; background: #ed9c11; } .article-details .article-info { float: left; width: 35%; max-width: 305px; padding-left: 32px; box-sizing: border-box; font-family: "AvenirLTStd-Black"; font-size: 1.6rem; color: #360554; } .article-details .article-info span { color: #ed9c11; } .article-details article { float: left; padding-left: 10px; width: 65%; } .article-details article p { margin-bottom: 21px; } .article-details article p.lead, .article-details article p:first-of-type { font-family: "AvenirLTStd-Black", Arial, 'Helvetica Neue', Helvetica, sans-serif; font-weight: 400; } .article-details .general-error, .article-details .not-found { display: none; padding-top: 20px; font-size: 3.6rem; color: #ff0000; } .article-details .author .label { font-family: "AvenirLTStd-Black"; font-size: 1.6rem; color: #360554; } /* carousel */ .feature .mod-carousel .slide-container { padding-bottom: 16px; } .feature .mod-carousel .step { background: #360554; height: 40px; padding: 0; position: absolute; right: 0; top: 50%; -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%); width: 40px; z-index: 1; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .feature .mod-carousel .step:before, .feature .mod-carousel .step:after, .arrow-right:before, .arrow-right:after { -moz-border-bottom-left-radius: 2px; -webkit-border-bottom-left-radius: 2px; border-bottom-left-radius: 2px; -moz-border-bottom-right-radius: 2px; -webkit-border-bottom-right-radius: 2px; border-bottom-right-radius: 2px; background: #ed9c11; content: ""; display: block; height: 12px; left: 19px; position: absolute; top: 10px; -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform: rotate(-45deg); width: 2px; } .feature .mod-carousel .step:after { -moz-border-top-left-radius: 2px; -webkit-border-top-left-radius: 2px; border-top-left-radius: 2px; -moz-border-top-right-radius: 2px; -webkit-border-top-right-radius: 2px; border-top-right-radius: 2px; top: 18px; -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); } .feature .mod-carousel .step.prev { left: 0; right: auto; } .feature .mod-carousel .step.prev:focus { -webkit-box-shadow: 5px 5px #ed9c11; -moz-box-shadow: 5px 5px #ed9c11; -ms-box-shadow: 5px 5px #ed9c11; -o-box-shadow: 5px 5px #ed9c11; box-shadow: 5px 5px #ed9c11; outline: none; } .feature .mod-carousel .step.next:focus { -webkit-box-shadow: -5px 5px #ed9c11; -moz-box-shadow: -5px 5px #ed9c11; -ms-box-shadow: -5px 5px #ed9c11; -o-box-shadow: -5px 5px #ed9c11; box-shadow: -5px 5px #ed9c11; outline: none; } .feature .mod-carousel .step.prev:before { -moz-border-top-left-radius: 2px; -webkit-border-top-left-radius: 2px; border-top-left-radius: 2px; -moz-border-top-right-radius: 2px; -webkit-border-top-left-radius: 2px; border-top-right-radius: 2px; -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); top: 10px; } .feature .mod-carousel .step.prev:after { -moz-border-bottom-left-radius: 2px; -webkit-border-bottom-left-radius: 2px; border-bottom-left-radius: 2px; -moz-border-bottom-right-radius: 2px; -webkit-border-bottom-right-radius: 2px; border-bottom-right-radius: 2px; top: 17px; -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform: rotate(-45deg); } .feature .mod-carousel .step.no-background { background: none; } .feature .mod-carousel .step.prev.no-background:focus, .feature .mod-carousel .step.next.no-background:focus { -moz-box-shadow: none; -ms-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; } .feature .mod-carousel .pagination-controls { clear: both; margin-left: 0 !important; position: relative; text-align: center; } .feature .mod-carousel .pagination-controls > button { background: transparent; border: 2px solid #00a896; border-radius: 0; display: inline-block; height: 10px; margin: 0 4px; vertical-align: top; width: 10px; } .feature .mod-carousel .pagination-controls > button.active { background: #00a896; } .feature .mod-carousel.slide-out .slide .step.prev, .feature .mod-carousel.slide-out .slide .step.next { display: none; } .feature .mod-carousel.slide-in .slide.active .step.next, .feature .mod-carousel.slide-in .slide.active .step.prev { display: block; } /* contact information animations */ .email .email-ico { display: block; width: 26px; height: 17px; position: absolute; top: 10px; left: 1px; border: 2px solid #360554; } .email .email-ico:before, .email .email-ico:after { content: ''; display: block; background: #00a896; width: 14px; height: 2px; position: absolute; top: -1px; left: 0; -moz-transform-origin: 0; -ms-transform-origin: 0; -o-transform-origin: 0; -webkit-transform-origin: 0; transform-origin: 0; -moz-transform: rotate(35deg); -ms-transform: rotate(35deg); -o-transform: rotate(35deg); -webkit-transform: rotate(35deg); transform: rotate(35deg); z-index: 1; } .email .email-ico:after { left: auto; right: 0; -moz-transform: rotate(-35deg); -ms-transform: rotate(-35deg); -o-transform: rotate(-35deg); -webkit-transform: rotate(-35deg); transform: rotate(-35deg); -moz-transform-origin: 100%; -ms-transform-origin: 100%; -o-transform-origin: 100%; -webkit-transform-origin: 100%; transform-origin: 100%; } .email .email-ico .envelope-inner { display: block; width: 100%; position: absolute; top: 0; opacity: 0; } .email .email-ico .envelope-inner:before, .email .email-ico .envelope-inner:after { content: ''; display: block; background: #360554; width: 14px; height: 2px; position: absolute; top: -1px; left: 0; -moz-transform-origin: 0; -ms-transform-origin: 0; -o-transform-origin: 0; -webkit-transform-origin: 0; transform-origin: 0; -moz-transform: rotate(35deg); -ms-transform: rotate(35deg); -o-transform: rotate(35deg); -webkit-transform: rotate(35deg); transform: rotate(35deg); } .email .email-ico .envelope-inner:after { left: auto; right: 0; -moz-transform: rotate(-35deg); -ms-transform: rotate(-35deg); -o-transform: rotate(-35deg); -webkit-transform: rotate(-35deg); transform: rotate(-35deg); -moz-transform-origin: 100%; -ms-transform-origin: 100%; -o-transform-origin: 100%; -webkit-transform-origin: 100%; transform-origin: 100%; } .email .email-ico .letter { display: block; width: 13px; height: 9px; position: absolute; top: -16px; left: -22px; border: 1px solid #360554; opacity: 0; } .email a:hover .email-ico, .email a:focus .email-ico { -webkit-animation: animateEnvelope 0.6s; -moz-animation: animateEnvelope 0.6s; -o-animation: animateEnvelope 0.6s; -ms-animation: animateEnvelope 0.6s; } .email a:hover .email-ico:before, .email a:focus .email-ico:before { -webkit-animation: animateEnvelopeLeft 0.6s; -moz-animation: animateEnvelopeLeft 0.6s; -o-animation: animateEnvelopeLeft 0.6s; -ms-animation: animateEnvelopeLeft 0.6s; } .email a:hover .email-ico:after, .email a:focus .email-ico:after { -webkit-animation: animateEnvelopeRight 0.6s; -moz-animation: animateEnvelopeRight 0.6s; -o-animation: animateEnvelopeRight 0.6s; -ms-animation: animateEnvelopeRight 0.6s; } .email a:hover .email-ico .letter, .email a:focus .email-ico .letter { -webkit-animation: animateLetter 0.3s; -moz-animation: animateLetter 0.3s; -o-animation: animateLetter 0.3s; -ms-animation: animateLetter 0.3s; animation: animateLetter 0.3s; animation-delay: 0.2s; } .email a:hover .email-ico .envelope-inner, .email a:focus .email-ico .envelope-inner { -webkit-animation: animateEnvelopeInner 0.6s; -moz-animation: animateEnvelopeInner 0.6s; -o-animation: animateEnvelopeInner 0.6s; -ms-animation: animateEnvelopeInner 0.6s; animation: animateEnvelopeInner 0.6s; } .phone a:before, .email a:before { display: none; } .phone svg { width: 20px; height: 20px; position: absolute; top: 8px; left: 4px; overflow: visible; } .phone svg .receiver { fill: none; stroke-width: 2px; stroke: #360554; stroke-miterlimit: 10; -moz-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); -webkit-transform: rotate(0); transform: rotate(0); -moz-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; -o-transform-origin: 50% 50%; -webkit-transform-origin: 50% 50%; transform-origin: 50% 50%; } .phone svg .signal { fill: none; stroke-width: 2px; stroke: #00a896; stroke-linejoin: round; -moz-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; -o-transform-origin: 50% 50%; -webkit-transform-origin: 50% 50%; transform-origin: 50% 50%; } .phone svg .signal.two { opacity: 0; -moz-transform: translate(0, 0) scale(1); -ms-transform: translate(0, 0) scale(1); -o-transform: translate(0, 0) scale(1); -webkit-transform: translate(0, 0) scale(1); transform: translate(0, 0) scale(1); -moz-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; -o-transform-origin: 50% 50%; -webkit-transform-origin: 50% 50%; transform-origin: 50% 50%; } .phone a:hover svg .receiver, .phone a:focus svg .receiver { -webkit-animation: vibratePhone 0.35s; -moz-animation: vibratePhone 0.35s; -o-animation: vibratePhone 0.35s; -ms-animation: vibratePhone 0.35s; animation: vibratePhone 0.35s; } .phone a:hover svg .signal.two, .phone a:focus svg .signal.two { -webkit-animation: sendSignal 0.7s ease-out; -moz-animation: sendSignal 0.7s ease-out; -o-animation: sendSignal 0.7s ease-out; -ms-animation: sendSignal 0.7s ease-out; animation: sendSignal 0.7s ease-out; } .fax svg { width: 25px; height: 23px; position: absolute; top: 8px; left: 1px; overflow: visible; } .fax svg .animate { opacity: 0; } .fax svg .machine, .fax svg .paper { fill: none; stroke-width: 2px; stroke: #360554; -moz-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; -o-transform-origin: 50% 50%; -webkit-transform-origin: 50% 50%; transform-origin: 50% 50%; -moz-transform: translate(0, 0) scale(1); -ms-transform: translate(0, 0) scale(1); -o-transform: translate(0, 0) scale(1); -webkit-transform: translate(0, 0) scale(1); transform: translate(0, 0) scale(1); } .fax svg .paper-writing { fill: none; stroke-width: 2px; stroke: #00a896; -moz-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; -o-transform-origin: 50% 50%; -webkit-transform-origin: 50% 50%; transform-origin: 50% 50%; -moz-transform: translate(0, 0) scale(1); -ms-transform: translate(0, 0) scale(1); -o-transform: translate(0, 0) scale(1); -webkit-transform: translate(0, 0) scale(1); transform: translate(0, 0) scale(1); } .fax a:hover svg .animate, .fax a:focus svg .animate { -webkit-animation: animateFax 0.55s; -moz-animation: animateFax 0.55s; -o-animation: animateFax 0.55s; -ms-animation: animateFax 0.55s; animation: animateFax 0.55s; } .ie .phone a:hover svg, .ie .phone a:focus svg { -ms-animation: vibratePhone 0.35s; animation: vibratePhone 0.35s; } .ie .fax a:hover svg, .ie .fax a:focus svg { -ms-animation: vibratePhone 0.35s; animation: vibratePhone 0.35s; } /* filter tabs */ .filter-tabs { margin: 0 -30px; } .filter-tabs ul { border-collapse: separate; border-spacing: 30px 0; display: table; margin: 0; padding: 0; table-layout: fixed; width: 100%; } .filter-tabs ul > li { color: #6b6b6b; cursor: pointer; display: table-cell; font-family: "Freight Sans W03 Medium", Arial, 'Helvetica Neue', Helvetica, sans-serif; font-size: 1.8rem; font-weight: 400; line-height: 3rem; padding: 0; text-align: center; -moz-transition: 0.2s ease; -ms-transition: 0.2s ease; -o-transition: 0.2s ease; -webkit-transition: 0.2s ease; transition: 0.2s ease; } .filter-tabs ul > li.active { background: #360554; color: #ffffff; font-family: "Freight Sans W01 Semibold", Arial, 'Helvetica Neue', Helvetica, sans-serif; } .filter-tabs ul > li button { border-bottom: 2px solid #f2f2f2; border-top: 2px solid #f2f2f2; display: block; padding: 12px 10px 11px; width: 100%; } .filter-tabs ul > li button:focus { border-bottom-color: #6b6b6b; border-top-color: #6b6b6b; } .filter-tabs ul > li.active button { color: #ffffff; border-bottom-color: transparent; border-top-color: transparent; } .filter-tabs ul > li.filter-tab-mobile { display: none; } /* images */ img { border: none; display: block; height: auto; margin: auto; max-width: 100%; outline: none; } /* right rail */ .content-with-rail { max-width: 875px; width: 75%; } .right-rail { margin-top: 60px; max-width: 246px; } .right-rail .sidebar-feature { margin-bottom: 40px; width: 100%; } .right-rail .sidebar-feature h4 { color: #ffffff; margin-bottom: 0; padding: 13px 20px 14px; } .right-rail .sidebar-feature .inner { background: #f7f7f7; font-size: 1.4rem; line-height: 2.2rem; padding: 24px 20px 20px; } .right-rail .sidebar-feature .inner p { margin: 0 0 13px; } .right-rail .sidebar-feature .inner h6 { margin-bottom: 11px; } .right-rail .sidebar-feature .inner ul.links { padding: 0 0 0 10px; } .right-rail .sidebar-feature .inner ul.links > li { display: block; padding: 7px 0; } .right-rail .sidebar-feature .inner ul.links > li:before { display: none; } .right-rail .sidebar-feature .inner ul.links > li a { color: #171717; display: block; padding: 0 0 0 44px; } .right-rail .sidebar-feature .inner ul.links > li a:focus { text-decoration: underline; } .right-rail .sidebar-feature .inner ul.links > li a .download-arrow { position: absolute; top: 6px; left: 0; border-bottom: 2px solid #360554; } .right-rail .sidebar-feature .inner ul.links > li a .download-arrow:before, .right-rail .sidebar-feature .inner ul.links > li a .download-arrow:after, .right-rail .sidebar-feature .inner ul.links > li a .external-arrow:before, .right-rail .sidebar-feature .inner ul.links > li a .external-arrow:after { background: #360554; } .right-rail .sidebar-feature .inner ul.links > li a .download-arrow .arrow, .right-rail .sidebar-feature .inner ul.links > li a .download-arrow .arrow:before, .right-rail .sidebar-feature .inner ul.links > li a .download-arrow .arrow:after, .right-rail .sidebar-feature .inner ul.links > li a .external-arrow .arrow, .right-rail .sidebar-feature .inner ul.links > li a .external-arrow .arrow:before, .right-rail .sidebar-feature .inner ul.links > li a .external-arrow .arrow:after { background: #00a896; } .right-rail .sidebar-feature .inner ul.links > li a:hover .download-arrow .arrow, .right-rail .sidebar-feature .inner ul.links > li a:focus .download-arrow .arrow { -webkit-animation: moveDownloadArrow 0.35s ease-out both; -moz-animation: moveDownloadArrow 0.35s ease-out both; -o-animation: moveDownloadArrow 0.35s ease-out both; -ms-animation: moveDownloadArrow 0.35s ease-out both; } .right-rail .sidebar-feature .inner ul.links > li a .external-arrow { width: 18px; height: 18px; position: absolute; left: 3px; top: 10px; border-bottom: 2px solid #360554; border-left: 2px solid #360554; } .right-rail .sidebar-feature .inner ul.links > li a .external-arrow .arrow { height: 17px; top: -6px; right: 1px; } .right-rail .sidebar-feature .inner ul.links > li a:hover .external-arrow .arrow, .right-rail .sidebar-feature .inner ul.links > li a:focus .external-arrow .arrow { -webkit-animation: moveArrowLargeExternal 0.35s ease-out both; -moz-animation: moveArrowLargeExternal 0.35s ease-out both; -o-animation: moveArrowLargeExternal 0.35s ease-out both; -ms-animation: moveArrowLargeExternal 0.35s ease-out both; } .right-rail .sidebar-feature .inner ul.links > li.external-link a:before { background-image: url("/Media/icons/external-link-dark.png"); background-size: 22px auto; height: 22px; } .right-rail .sidebar-feature .inner ul.links > li.fax a:before { background-image: url("/Media/icons/fax-icon.png"); } .right-rail .sidebar-feature .inner .cta { margin-bottom: 10px; margin-top: 18px; } .right-rail .sidebar-feature .inner .cta .button { width: 100%; } /* tabs */ .tabbed-content, .tabbed-content .filter-content { position: relative; } .tabbed-content .tab-content { -ms-filter: alpha(opacity=0); filter: alpha(opacity=0); opacity: 0; position: absolute; right: 0; top: 0; -moz-transition: 0.4s ease; -ms-transition: 0.4s ease; -o-transition: 0.4s ease; -webkit-transition: 0.4s ease; transition: 0.4s ease; visibility: hidden; width: 100%; } .tabbed-content .tab-content.active { opacity: 1; visibility: visible; } /* tables */ table { border: 1px solid #f2f2f2; table-layout: initial; width: 100%; } table th, table td.tbl-header { background: #260349; color: #ffffff; font-family: "AvenirLTStd-Medium", Arial, 'Helvetica Neue', Helvetica, sans-serif; font-size: 1.4rem; font-weight: 400; line-height: 2.7rem; padding: 8px 21px; text-align: left; } table td { color: #1f1f1f; font-size: 1.2rem; line-height: 2.2rem; padding: 14px 21px; vertical-align: top; } table tr:nth-child(even) td { background: #e8e8e8; } .content-with-rail table { table-layout: fixed; } /* video container */ .video-container { overflow: hidden; padding: 0; position: relative; } .video-container .background { background-position: center center; background-repeat: no-repeat; -moz-background-size: cover; -ms-background-size: cover; -o-background-size: cover; -webkit-background-size: cover; background-size: cover; background-repeat: no-repeat; height: 100%; width: 100%; } .video-container iframe { height: 100%; left: 0; position: absolute; width: 100%; } .video-container .overlay, .video-container .overlay:before { display: block; height: 100%; left: 0; position: absolute; top: 0; width: 100%; } .video-container .overlay:before { background-color: rgba(0, 0, 0, 0.5); content: ""; } .video-container .overlay h2 { color: #ffffff; margin: 71px 58px 0; } .video-container .play.button { height: 106px; left: 50%; padding: 0; position: absolute; top: 50%; -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 106px; } .video-container .play.button:after { background: none; border-bottom: 23px solid transparent; border-left: 35px solid #ffffff; border-top: 22px solid transparent; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; content: ""; height: 0; left: 50%; position: absolute; top: 50%; -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 0; } .video-container .play.button:hover:after, .video-container .play.button:focus:after { border-left-color: #360554; border-right-color: #360554; } /* helper classes ============================ */ .left { float: left; } .right { float: right; } .text-centered { text-align: center; } .transition { -moz-transition: 0.2s ease; -o-transition: 0.2s ease; -webkit-transition: 0.2s ease; transition: 0.2s ease; } .hidden { opacity: 0; visibility: hidden; } .hidden-accessible { position: absolute; clip: rect(1px,1px,1px,1px); padding: 0; border: 0; height: 1px; width: 1px; overflow: hidden; } /* arrow */ .arrow-right { position: relative; display: inline-block; vertical-align: middle; height: 20px; width: 15px; margin-left: 15px; -webkit-transition: all 0.25s; -moz-transition: all 0.25s; -ms-transition: all 0.25s; -o-transition: all 0.25s; transition: all 0.25s; } .arrow-right:before { top: 0; left: 5px; -moz-border-top-left-radius: 2px; -webkit-border-top-left-radius: 2px; border-top-left-radius: 2px; -moz-border-top-right-radius: 2px; -webkit-border-top-left-radius: 2px; border-top-right-radius: 2px; -moz-transform: rotate(135deg); -ms-transform: rotate(135deg); -o-transform: rotate(135deg); -webkit-transform: rotate(135deg); transform: rotate(135deg); } .arrow-right:after { top: 8px; left: 5px; -moz-border-bottom-left-radius: 2px; -webkit-border-bottom-left-radius: 2px; border-bottom-left-radius: 2px; -moz-border-bottom-right-radius: 2px; -webkit-border-bottom-right-radius: 2px; border-bottom-right-radius: 2px; -moz-transform: rotate(-135deg); -ms-transform: rotate(-135deg); -o-transform: rotate(-135deg); -webkit-transform: rotate(-135deg); transform: rotate(-135deg); } .arrow-down { position: relative; display: inline-block; vertical-align: middle; height: 7px; width: 10px; -webkit-transition: all 0.25s; -moz-transition: all 0.25s; -ms-transition: all 0.25s; -o-transition: all 0.25s; transition: all 0.25s; } .arrow-down:before, .arrow-down:after { -moz-border-bottom-left-radius: 2px; -webkit-border-bottom-left-radius: 2px; border-bottom-left-radius: 2px; -moz-border-bottom-right-radius: 2px; -webkit-border-bottom-right-radius: 2px; border-bottom-right-radius: 2px; background: #360554; content: ""; display: block; position: absolute; top: 10px; width: 2px; height: 6px; -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform: rotate(-45deg); } .arrow-down:before { top: 0; left: 0; -moz-border-top-left-radius: 2px; -webkit-border-top-left-radius: 2px; border-top-left-radius: 2px; -moz-border-top-right-radius: 2px; -webkit-border-top-left-radius: 2px; border-top-right-radius: 2px; -moz-transform: rotate(135deg); -ms-transform: rotate(135deg); -o-transform: rotate(135deg); -webkit-transform: rotate(135deg); transform: rotate(135deg); } .arrow-down:after { top: 0; left: 4px; -moz-border-bottom-left-radius: 2px; -webkit-border-bottom-left-radius: 2px; border-bottom-left-radius: 2px; -moz-border-bottom-right-radius: 2px; -webkit-border-bottom-right-radius: 2px; border-bottom-right-radius: 2px; -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); } .download-arrow { display: inline-block; width: 27px; height: 19px; position: relative; border-bottom: 2px solid #ed9c11; } .download-arrow:before, .download-arrow:after { content: ''; display: block; height: 50%; width: 2px; position: absolute; bottom: 0; left: 0; background: #ed9c11; } .download-arrow:after { left: auto; right: 0; } .download-arrow .arrow { display: block; width: 2px; height: 14px; position: absolute; top: 0; left: 50%; transform: translateX(-50%); background: #ed9c11; border-radius: 0 0 2px 2px; } .download-arrow .arrow:before, .download-arrow .arrow:after { content: ''; display: block; width: 2px; height: 6px; position: absolute; bottom: 0; left: -2px; -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform: rotate(-45deg); background: #ed9c11; border-radius: 0 0 2px 2px; } .download-arrow .arrow:after { left: auto; right: -2px; -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); } .external-arrow { display: inline-block; width: 15px; height: 15px; position: relative; border-bottom: 2px solid #ed9c11; border-left: 2px solid #ed9c11; } .external-arrow:before, .external-arrow:after { content: ''; display: block; width: 50%; height: 2px; position: absolute; top: 0; left: 0; background: #ed9c11; } .external-arrow:after { width: 2px; height: 50%; top: auto; bottom: 0; left: auto; right: 0; } .external-arrow .arrow { display: block; width: 2px; height: 14px; position: absolute; top: -5px; right: 0; -moz-transform: translateX(-50%) rotate(225deg); -ms-transform: translateX(-50%) rotate(225deg); -o-transform: translateX(-50%) rotate(225deg); -webkit-transform: translateX(-50%) rotate(225deg); transform: translateX(-50%) rotate(225deg); background: #ed9c11; border-radius: 0 0 2px 2px; } .external-arrow .arrow:before, .external-arrow .arrow:after { content: ''; display: block; width: 2px; height: 6px; position: absolute; bottom: 0; left: -2px; -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform: rotate(-45deg); background: #ed9c11; border-radius: 0 0 2px 2px; } .external-arrow .arrow:after { left: auto; right: -2px; -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); } /* viewports */ .mobile-view, .tablet-mobile-view { display: none; } /* widths */ .third-width { width: 30%; } .four-column-width { width: 40%; } .half-width { width: 50%; } .six-column-width { width: 60%; } .seven-column-width { width: 70%; } .full-width { width: 100%; } /* responsive ============================ */ @media screen and (max-width: 1200px) { .wrapper { padding-left: 20px; padding-right: 20px; } .wrapper .wrapper { padding-left: 0; padding-right: 0; } } @media screen and (max-width: 1100px) { /* right rail */ .content-with-rail { width: 72%; } } @media screen and (max-width: 1024px) { /* global */ .button, button.button, .button.secondary { font-size: 2.1rem; padding: 9px 30px 10px; } .button, .button.secondary, .button.full-submit { max-width: 280px; width: 100%; } /* columns */ .three-column .column, .four-column .column { padding-bottom: 2%; width: 50%; } .five-column .column, .six-column .column { padding-bottom: 2%; width: 33.33%; } .five-column .column { padding-bottom: 1%; } .three-column .column:nth-child(2n+1), .four-column .column:nth-child(2n+1), .five-column .column:nth-child(3n+1), .six-column .column:nth-child(3n+1) { clear: left; } .three-column .column:nth-child(3n+1), .four-column .column:nth-child(4n+1), .five-column .column:nth-child(5n+1), .six-column .column:nth-child(6n+1) { clear: none; } /* helper classes */ .desktop-view { display: none; } .tablet-mobile-view { display: block; } /* articles */ .article-details .article-info { padding-left: 0; } .article-details .article-info span { display: block; } /* filter tabs */ .filter-tabs { margin: 0 -15px; } .filter-tabs ul { border-spacing: 15px 0; } /* right rail */ .content-with-rail { padding-right: 2%; width: 70%; } .right-rail.third-width { width: 40%; } } @media screen and (max-width: 880px) { /* right rail */ .content-with-rail { width: 63%; } /* articles */ .article-details article, .article-details .article-info { padding-left: 0; max-width: 100%; width: 100%; } /* video container */ .video-container .overlay h2 { margin: 41px 20px 0; } .video-container .play.button { height: 80px; width: 80px; } .video-container .play.button:hover:after, .video-container .play.button:focus:after { border-left-color: #ffffff; border-right-color: #ffffff; } /* site overlay */ .nav-open.step-form-open #site-overlay.active { background: #12003b; background: -moz-linear-gradient(left, #12003b 0%, #3f065b 100%); background: -webkit-linear-gradient(left, #12003b 0%,#3f065b 100%); background: linear-gradient(to right, #12003b 0%,#3f065b 100%); } } @media screen and (max-width: 736px) { /* global */ h1 { font-size: 3.6rem; line-height: 4.4rem; } h2 { font-size: 3.2rem; line-height: 4rem; } h3 { font-size: 2.4rem; line-height: 3rem; } h4 { font-size: 2.1rem; line-height: 2.4rem; } h6 { font-size: 1.4rem; line-height: 1.8rem; } .feature h2 { font-size: 3.2rem; letter-spacing: -0.02em; line-height: 4rem; margin-bottom: 33px; padding-left: 12px; } .feature h2 > a:hover { color: #00a896; } .feature h2:before { height: 20px; top: 11px; } .button, .button.primary, .button.secondary { font-size: 1.8rem; } .button.primary:after { margin-top: 7px; } .button:hover, .button:focus, button.button:hover, button.button:focus, .button.secondary:hover, .button.secondary:focus, .button:visited:hover, button.button:visited:hover, .button:visited:focus, button.button:visited:focus, .button.secondary:visited:hover, .button.secondary:visited:focus, .blue-bg .form .full-submit:hover, .blue-bg .form .full-submit:focus, .button.tertiary:hover, .button.tertiary:focus, .purple-bg .button.secondary:hover, .purple-bg .button.secondary:focus { color: #ffffff; } .button:hover:before, .button:focus:before, button.button:hover:before, button.button:focus:before, .button.tertiary:hover:before, .button.tertiary:focus:before, .button.secondary:hover:before, .button.secondary:focus:before, .button.tertiary:hover:before, .button.tertiary:focus:before, .form .submit:hover:before, .form .submit:focus:before, .button.tertiary:hover:before, .button.tertiary:focus:before, .purple-bg .button.secondary:hover:before, .purple-bg .button.secondary:focus:before { width: 0; } /* columns */ .two-column, .three-column, .four-column, .five-column, .six-column { margin: 0; } .two-column .column, .three-column .column, .four-column .column, .five-column .column, .six-column .column { padding: 0 0 6%; width: 100%; } .two-column .column:nth-child(2n+1), .three-column .column:nth-child(2n+1), .three-column .column:nth-child(3n+1), .four-column .column:nth-child(2n+1), .four-column .column:nth-child(4n+1), .five-column .column:nth-child(3n+1), .five-column .column:nth-child(5n+1), .six-column .column:nth-child(3n+1), .six-column .column:nth-child(5n+1) { clear: both; } .third-width, .four-column-width, .half-width, .six-column-width, .seven-column-width { max-width: 100%; width: 100%; } .two-column .column { padding-bottom: 2%; } /* helper classes */ .desktop-tablet-view { display: none; } .mobile-view { display: block; } /* articles */ .article-details { padding-top: 28px; } .article-details h1 { margin-bottom: 24px; padding-left: 12px; } .article-details h1:before { height: 20px; top: 12px; } .article-details .article-info span { display: inline; } .article-details .general-error { font-size: 2.4rem; } /* filter tabs */ .filter-tabs ul > li { display: none; } .filter-tabs ul > li.filter-tab-mobile { display: table-cell; width: 100%; } /* right rail */ .content-with-rail { padding-bottom: 20px; padding-right: 0; width: 100%; } .right-rail { margin-top: 0; } .right-rail.third-width { width: 100%; } .right-rail .sidebar-feature .inner ul.links { padding: 0; } /* video container */ .video-container { height: 200px; } .video-container h2 { display: none; } .video-container .play.button { height: 60px; min-width: 0; width: 60px; } .video-container .play.button:after { border-bottom-width: 12px; border-left-width: 19px; border-top-width: 13px; } }