/* Theme base styles */ /* Tools Any animations, or functions used throughout the project. Note: _macros.css needs to be imported into each stylesheet where macros are used and not included here */ /* Generic This is where reset, normalize & box-sizing styles go. */ *, *:before, *:after { box-sizing: border-box; } /*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */ /* Document ========================================================================== */ /** * 1. Correct the line height in all browsers. * 2. Prevent adjustments of font size after orientation changes in iOS. */ html { line-height: 1.15; /* 1 */ -webkit-text-size-adjust: 100%; /* 2 */ } /* Sections ========================================================================== */ /** * Remove the margin in all browsers. */ body { margin: 0; } /** * Render the `main` element consistently in IE. */ main { display: block; } /** * Correct the font size and margin on `h1` elements within `section` and * `article` contexts in Chrome, Firefox, and Safari. */ h1 { font-size: 2em; margin: 0.67em 0; } /* Grouping content ========================================================================== */ /** * 1. Add the correct box sizing in Firefox. * 2. Show the overflow in Edge and IE. */ hr { box-sizing: content-box; /* 1 */ height: 0; /* 1 */ overflow: visible; /* 2 */ } /** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ pre { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ } /* Text-level semantics ========================================================================== */ /** * Remove the gray background on active links in IE 10. */ a { background-color: transparent; } /** * 1. Remove the bottom border in Chrome 57- * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. */ abbr[title] { border-bottom: none; /* 1 */ text-decoration: underline; /* 2 */ text-decoration: underline dotted; /* 2 */ } /** * Add the correct font weight in Chrome, Edge, and Safari. */ b, strong { font-weight: bolder; } /** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ code, kbd, samp { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ } /** * Add the correct font size in all browsers. */ small { font-size: 80%; } /** * Prevent `sub` and `sup` elements from affecting the line height in * all browsers. */ sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; } /* Embedded content ========================================================================== */ /** * Remove the border on images inside links in IE 10. */ img { border-style: none; } /* Forms ========================================================================== */ /** * 1. Change the font styles in all browsers. * 2. Remove the margin in Firefox and Safari. */ button, input, optgroup, select, textarea { font-family: inherit; /* 1 */ font-size: 100%; /* 1 */ line-height: 1.15; /* 1 */ margin: 0; /* 2 */ } /** * Show the overflow in IE. * 1. Show the overflow in Edge. */ button, input { /* 1 */ overflow: visible; } /** * Remove the inheritance of text transform in Edge, Firefox, and IE. * 1. Remove the inheritance of text transform in Firefox. */ button, select { /* 1 */ text-transform: none; } /** * Correct the inability to style clickable types in iOS and Safari. */ button, [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button; } /** * Remove the inner border and padding in Firefox. */ button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner { border-style: none; padding: 0; } /** * Restore the focus styles unset by the previous rule. */ button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring { outline: 1px dotted ButtonText; } /** * Correct the padding in Firefox. */ fieldset { padding: 0.35em 0.75em 0.625em; } /** * 1. Correct the text wrapping in Edge and IE. * 2. Correct the color inheritance from `fieldset` elements in IE. * 3. Remove the padding so developers are not caught out when they zero out *    `fieldset` elements in all browsers. */ legend { box-sizing: border-box; /* 1 */ color: inherit; /* 2 */ display: table; /* 1 */ max-width: 100%; /* 1 */ padding: 0; /* 3 */ white-space: normal; /* 1 */ } /** * Add the correct vertical alignment in Chrome, Firefox, and Opera. */ progress { vertical-align: baseline; } /** * Remove the default vertical scrollbar in IE 10+. */ textarea { overflow: auto; } /** * 1. Add the correct box sizing in IE 10. * 2. Remove the padding in IE 10. */ [type="checkbox"], [type="radio"] { box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ } /** * Correct the cursor style of increment and decrement buttons in Chrome. */ [type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; } /** * 1. Correct the odd appearance in Chrome and Safari. * 2. Correct the outline style in Safari. */ [type="search"] { -webkit-appearance: textfield; /* 1 */ outline-offset: -2px; /* 2 */ } /** * Remove the inner padding in Chrome and Safari on macOS. */ [type="search"]::-webkit-search-decoration { -webkit-appearance: none; } /** * 1. Correct the inability to style clickable types in iOS and Safari. * 2. Change font properties to `inherit` in Safari. */ ::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ } /* Interactive ========================================================================== */ /* * Add the correct display in Edge, IE 10+, and Firefox. */ details { display: block; } /* * Add the correct display in all browsers. */ summary { display: list-item; } /* Misc ========================================================================== */ /** * Add the correct display in IE 10+. */ template { display: none; } /** * Add the correct display in IE 10. */ [hidden] { display: none; } /* Objects Non-cosmetic design patterns including grid and layout classes) */ /* Responsive grid */ .row-fluid { width: 100%; } .row-fluid:before, .row-fluid:after { display: table; content: ''; } .row-fluid:after { clear: both; } .row-fluid [class*='span'] { display: block; float: left; width: 100%; min-height: 1px; margin-left: 2.127659574%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; } .row-fluid [class*='span']:first-child { margin-left: 0; } .row-fluid .span12 { width: 99.99999998999999%; } .row-fluid .span11 { width: 91.489361693%; } .row-fluid .span10 { width: 82.97872339599999%; } .row-fluid .span9 { width: 74.468085099%; } .row-fluid .span8 { width: 65.95744680199999%; } .row-fluid .span7 { width: 57.446808505%; } .row-fluid .span6 { width: 48.93617020799999%; } .row-fluid .span5 { width: 40.425531911%; } .row-fluid .span4 { width: 31.914893614%; } .row-fluid .span3 { width: 23.404255317%; } .row-fluid .span2 { width: 14.89361702%; } .row-fluid .span1 { width: 6.382978723%; } .container-fluid:before, .container-fluid:after { display: table; content: ''; } .container-fluid:after { clear: both; } @media (max-width: 767px) { .row-fluid { width: 100%; } .row-fluid [class*='span'] { display: block; float: none; width: auto; margin-left: 0; } } @media (min-width: 768px) and (max-width: 1139px) { .row-fluid { width: 100%; } .row-fluid:before, .row-fluid:after { display: table; content: ''; } .row-fluid:after { clear: both; } .row-fluid [class*='span'] { display: block; float: left; width: 100%; min-height: 1px; margin-left: 2.762430939%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; } .row-fluid [class*='span']:first-child { margin-left: 0; } .row-fluid .span12 { width: 99.999999993%; } .row-fluid .span11 { width: 91.436464082%; } .row-fluid .span10 { width: 82.87292817100001%; } .row-fluid .span9 { width: 74.30939226%; } .row-fluid .span8 { width: 65.74585634900001%; } .row-fluid .span7 { width: 57.182320438000005%; } .row-fluid .span6 { width: 48.618784527%; } .row-fluid .span5 { width: 40.055248616%; } .row-fluid .span4 { width: 31.491712705%; } .row-fluid .span3 { width: 22.928176794%; } .row-fluid .span2 { width: 14.364640883%; } .row-fluid .span1 { width: 5.801104972%; } } @media (min-width: 1280px) { .row-fluid { width: 100%; } .row-fluid:before, .row-fluid:after { display: table; content: ''; } .row-fluid:after { clear: both; } .row-fluid [class*='span'] { display: block; float: left; width: 100%; min-height: 1px; margin-left: 2.564102564%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; } .row-fluid [class*='span']:first-child { margin-left: 0; } .row-fluid .span12 { width: 100%; } .row-fluid .span11 { width: 91.45299145300001%; } .row-fluid .span10 { width: 82.905982906%; } .row-fluid .span9 { width: 74.358974359%; } .row-fluid .span8 { width: 65.81196581200001%; } .row-fluid .span7 { width: 57.264957265%; } .row-fluid .span6 { width: 48.717948718%; } .row-fluid .span5 { width: 40.170940171000005%; } .row-fluid .span4 { width: 31.623931624%; } .row-fluid .span3 { width: 23.076923077%; } .row-fluid .span2 { width: 14.529914530000001%; } .row-fluid .span1 { width: 5.982905983%; } } /* Clearfix */ .clearfix:before, .clearfix:after { display: table; content: ''; } .clearfix:after { clear: both; } /* Visibilty classes */ .hide { display: none; } .show { display: block; } .invisible { visibility: hidden; } .hidden { display: none; visibility: hidden; } /* Responsive visibilty classes */ .visible-phone { display: none !important; } .visible-tablet { display: none !important; } .hidden-desktop { display: none !important; } @media (max-width: 767px) { .visible-phone { display: inherit !important; } .hidden-phone { display: none !important; } .hidden-desktop { display: inherit !important; } .visible-desktop { display: none !important; } } @media (min-width: 768px) and (max-width: 1139px) { .visible-tablet { display: inherit !important; } .hidden-tablet { display: none !important; } .hidden-desktop { display: inherit !important; } .visible-desktop { display: none !important; } } .content-wrapper { margin: 0 auto; padding: 0 1rem; } @media screen and (min-width: 1380px) { .content-wrapper { padding: 0; } } .dnd-section > .row-fluid { margin: 0 auto; } .dnd-section .dnd-column { padding: 0 1rem; } @media (max-width: 767px) { .dnd-section .dnd-column { padding: 0; } } /* Elements Base HMTL elements are styled in this section (<body<, <h1>, <a>, <p>, <button> etc.) */ body { line-height: 1.4; word-break: break-word; } html[lang^="ja"] body, html[lang^="zh"] body, html[lang^="ko"] body { line-break: strict; word-break: break-all; } /* Paragraphs */ p { /* font-size: 1rem; */ margin: 0 0 1.4rem; } /* Anchors */ a { cursor: pointer; } /* Headings */ h1, h2, h3, h4, h5, h6 { margin: 0 0 1.4rem; } /* Lists */ ul, ol { margin: 0 0 1.4rem; } ul ul, ol ul, ul ol, ol ol { margin: 0; } ul.no-list { list-style: none; margin: 0; padding-left: 0; } /* Code blocks */ pre { overflow: auto; } code { vertical-align: bottom; } /* Blockquotes */ blockquote { border-left: 2px solid; margin: 0 0 1.4rem; padding-left: 0.7rem; } /* Horizontal rules */ hr { border: none; border-bottom: 1px solid #CCC; } /* Image alt text */ img { font-size: 0.583rem; word-break: normal; } button, .button { cursor: pointer; display: inline-block; text-align: center; transition: all 0.15s linear; white-space: normal; } button:disabled, .button:disabled { background-color: #D0D0D0; border-color: #D0D0D0; color: #E6E6E6; } /* No button */ .no-button, .no-button:hover, .no-button:focus, .no-button:active { background: none; border: none; border-radius: 0; color: initial; font-family: inherit; font-size: inherit; font-style: inherit; font-weight: inherit; letter-spacing: inherit; line-height: inherit; margin-bottom: 0; padding: 0; text-align: left; text-decoration: none; transition: none; } /* Fields */ .hs-form-field { margin-bottom: 1.4rem; } /* Labels */ form label { display: block; font-size: 0.875rem; margin-bottom: 0.35rem; } /* Help text */ form legend { font-size: 0.875rem; } /* Inputs */ form input[type=text], form input[type=email], form input[type=password], form input[type=tel], form input[type=number], form input[type=file], form select, form textarea { display: inline-block; font-size: 0.875rem; padding: 0.7rem; width: 100%; } form fieldset { max-width: 100% !important; } /* Inputs - checkbox/radio */ form .inputs-list { margin: 0; padding: 0; list-style: none; } form .inputs-list > li { display: block; margin: 0.7rem 0; } form .inputs-list input, form .inputs-list span { vertical-align: middle; } form input[type=checkbox], form input[type=radio] { cursor: pointer; margin-right: 0.35rem; } /* Inputs - date picker */ .hs-dateinput { position: relative; } .hs-dateinput:before { content:'\01F4C5'; position: absolute; right: 10%; top: 50%; transform: translateY(-50%); } .fn-date-picker .pika-table thead th { color: #FFF; } .fn-date-picker td.is-selected .pika-button { border-radius: 0; box-shadow: none; } .fn-date-picker td .pika-button:hover, .fn-date-picker td .pika-button:focus { border-radius: 0 !important; color: #FFF; } /* Inputs - file picker */ form input[type=file] { background-color: transparent; border: initial; padding: initial; } /* Headings and text */ form .hs-richtext, form .hs-richtext p { font-size: 0.875rem; margin: 0 0 1.4rem; } form .hs-richtext img { max-width: 100% !important; } /* GDPR */ .legal-consent-container .hs-form-booleancheckbox-display > span, .legal-consent-container .hs-form-booleancheckbox-display > span p { margin-left: 1rem !important; } /* Validation */ .hs-form-required { color: #EF6B51; } .hs-input.invalid.error { border-color: #EF6B51; } .hs-error-msg { color: #EF6B51; margin-top: 0.35rem; } /* Submit button */ form input[type=submit], form .hs-button { cursor: pointer; display: inline-block; text-align: center; transition: all 0.15s linear; white-space: normal; } /* Captcha */ .grecaptcha-badge { margin: 0 auto; } /* Table */ table { border-collapse: collapse; margin-bottom: 1.4rem; overflow-wrap: break-word; } /* Table cells */ td, th { vertical-align: top; } /* Table header */ thead th { vertical-align: bottom; } /* Components Specific pieces of UI that are stylized. Typically used for global partial styling */ /* Header DND sections */ .header .dnd-section { padding: 0; } /* Header container */ .header__container { display: flex; justify-content: space-between; } .header__row-1 { padding-top: 1rem; } .header__row-1, .header__row-2 { align-items: center; display: flex; justify-content: flex-end; width: 100%; } @media (max-width: 1150px) and (min-width: 767px) { .header__column { width: 100%; } } @media (max-width: 767px) { .header__container { flex-direction: column; padding: 1rem 0 0; } .header__column { position: relative; } .header__row-1 { padding-top: 0; } .header__row-2 { justify-content: center; padding: 1.05rem; } } /* Navigation skipper */ .header__skip { height: 1px; left: -1000px; overflow: hidden; position: absolute; text-align: left; top: -1000px; width: 1px; } .header__skip:hover, .header__skip:focus, .header__skip:active { height: auto; left: 0; overflow: visible; top: 0; width: auto; } /* Logo */ .header__logo { align-items: center; display: flex; height: auto; margin-right: auto; max-width: 200px; overflow: hidden; } @media (max-width: 767px) { .header__logo { margin: 0 auto; width: 100%; } } .header__logo img { max-width: 100%; } .header__logo .logo-company-name { font-size: 1.167rem; margin-top: 0.7rem; } .header__logo--main { padding-top: 1rem; } /* Search bar */ .header__search { padding: 0 1rem; width: auto; } .header__search .hs-search-field__input { background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48c3ZnIHdpZHRoPSIyNHB4IiBoZWlnaHQ9IjI0cHgiIHZpZXdCb3g9IjAgMCAyNCAyNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4gICAgICAgIDx0aXRsZT5TZWFyY2g8L3RpdGxlPiAgICA8ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz4gICAgPGRlZnM+ICAgICAgICA8cGF0aCBkPSJNOS4xMzg2MTUzNCwxNS44OTI1Njg1IEM1LjQxMzk1NzQyLDE1Ljg5MjU2ODUgMi4zODM4ODUyNywxMi44NjM0NDc1IDIuMzgzODg1MjcsOS4xMzkwMDM3NiBDMi4zODM4ODUyNyw1LjQxNDU2MDA1IDUuNDEzOTU3NDIsMi4zODM4ODUyNyA5LjEzODYxNTM0LDIuMzgzODg1MjcgQzEyLjg2MzI3MzMsMi4zODM4ODUyNyAxNS44OTI1Njg1LDUuNDE0NTYwMDUgMTUuODkyNTY4NSw5LjEzOTAwMzc2IEMxNS44OTI1Njg1LDEyLjg2MzQ0NzUgMTIuODYzMjczMywxNS44OTI1Njg1IDkuMTM4NjE1MzQsMTUuODkyNTY4NSBNOS4xMzg3NTI0NSwyLjQzMzYwODg3ZS0xMyBDMTQuMTc3OTk1NSwyLjQzMzYwODg3ZS0xMyAxOC4yNzY0NTM3LDQuMTAwMzI0NzEgMTguMjc2NDUzNyw5LjEzOTI3Nzk2IEMxOC4yNzY0NTM3LDExLjIyOTgyMTEgMTcuNTcxMDE2OSwxMy4xNTg0NDM0IDE2LjM4NTYzMTMsMTQuNjk5NjY5NiBMMjMuNjUwODg4MSwyMS45NjUyMjY2IEMyNC4xMTYzNzA2LDIyLjQzMDcwOTIgMjQuMTE2MzcwNiwyMy4xODU0MDU1IDIzLjY1MDg4ODEsMjMuNjUwODg4MSBDMjMuMTg1NDA1NSwyNC4xMTYzNzA2IDIyLjQzMDcwOTIsMjQuMTE2MzcwNiAyMS45NjUyMjY2LDIzLjY1MDg4ODEgTDE0LjY5OTgxMzMsMTYuMzg1NDcxMyBDMTMuMTU4NDQwNSwxNy41NzA5NTA5IDExLjIyOTU3MzgsMTguMjc2NDUzNyA5LjEzODc1MjQ1LDE4LjI3NjQ1MzcgQzQuMDk5NTA5MzgsMTguMjc2NDUzNyAtMy43MzAzNDkzNmUtMTQsMTQuMTc4MjMxMiAtMy43MzAzNDkzNmUtMTQsOS4xMzkyNzc5NiBDLTMuNzMwMzQ5MzZlLTE0LDQuMTAwMzI0NzEgNC4wOTk1MDkzOCwyLjQzMzYwODg3ZS0xMyA5LjEzODc1MjQ1LDIuNDMzNjA4ODdlLTEzIFoiIGlkPSJwYXRoLTEiPjwvcGF0aD4gICAgPC9kZWZzPiAgICA8ZyBpZD0iU2VhcmNoIiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4gICAgICAgIDxtYXNrIGlkPSJtYXNrLTIiIGZpbGw9IndoaXRlIj4gICAgICAgICAgICA8dXNlIHhsaW5rOmhyZWY9IiNwYXRoLTEiPjwvdXNlPiAgICAgICAgPC9tYXNrPiAgICAgICAgPHVzZSBpZD0iSWNvbnMvQWN0aW9ucy9TZWFyY2giIGZpbGw9IiM0OTRBNTIiIHhsaW5rOmhyZWY9IiNwYXRoLTEiPjwvdXNlPiAgICA8L2c+PC9zdmc+); background-position: center right 15px; background-repeat: no-repeat; height: 45px; padding: 0 0.7rem; } .header__search .hs-search-field--open .hs-search-field__input { border-bottom: none; border-radius: 6px 6px 0 0; max-width: 100%; } .header__search .hs-search-field--open .hs-search-field__suggestions { background-color: #FFF; border: 2px solid #D1D6DC; border-radius: 0 0 6px 6px; border-top-width: 1px; position: absolute; width: 100%; z-index: 10; } .header__search .hs-search-field__suggestions li { border-top: 1px solid #D1D6DC; font-size: 0.875rem; } .header__search .hs-search-field__suggestions li a { color: #494A52; padding: 0.35rem 0.7rem; text-decoration: none; transition: background-color 0.3s; } .header__search .hs-search-field__suggestions #results-for { display: none; } @media (min-width: 767px) { .header__search form { align-items: center; display: flex; flex-direction: row; } .header__search label { margin: 0 1rem 0 0; } .header__search .hs-search-field__input { width: auto; } } @media (max-width: 767px) { .header__search { border-top: 2px solid #CED4DB; order: 1; padding: 1.05rem; } } /* Language switcher */ .header__language-switcher { cursor: pointer; padding-right: 1.4rem; } .header__language-switcher .lang_switcher_class { position: static; } .header__language-switcher .lang_list_class { border: 2px solid; border-radius: 3px; box-shadow: 0 2px 9px 0 rgba(0, 0, 0, 0.2); display: block; left: calc(100% - 24px); opacity: 0; min-width: 100px; padding-top: 0; text-align: left; top: 100%; transition: opacity 0.3s; visibility: hidden; } .header__language-switcher:hover .lang_list_class, .header__language-switcher:focus .lang_list_class { opacity: 1; transition: opacity 0.3s; visibility: visible; } .header__language-switcher .lang_list_class:before { left: 70%; top: -25px; } .header__language-switcher .lang_list_class:after { left: 70%; top: -22px; } .header__language-switcher .lang_list_class.first-active::after { top: -22px; transition: 0.3s; } .header__language-switcher .lang_list_class li { border: none; font-size: 18px; padding: 0.35rem 0.7rem; } .header__language-switcher .lang_list_class li:first-child { border-radius: 6px 6px 0 0; border-top: none; } .header__language-switcher .lang_list_class li:last-child { border-bottom: none; border-radius: 0 0 6px 6px; } .header__language-switcher .lang_list_class li:hover { transition: background-color 0.3s; } .header__language-switcher--label { display: flex; position: relative; } .header__language-switcher--label-current { align-items: center; display: flex; font-size: 0.75rem; margin-bottom: 0.175rem; margin-left: 0.7rem; } .header__language-switcher--label-current:after { border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 6px solid #494A52; content: ""; display: block; height: 0px; margin-left: 0.7rem; margin-top: 0.175rem; width: 0px; } @media (max-width: 767px) { .header__language-switcher { border-top: 2px solid #CED4DB; padding-left: 1.05rem; padding-right: 0; } .header__language-switcher .lang_list_class { border: none; box-shadow: unset; display: block; left: 30px; opacity: 1; padding: 0 1.05rem; top: 0; visibility: visible; } .header__language-switcher .lang_list_class li { background-color: inherit; font-size: 0.917rem; } .header__language-switcher--label-current { display: none; } .header__language-switcher .globe_class { background-image: none; } .header__language-switcher .lang_list_class li:hover{ background-color: inherit; } .header__language-switcher .lang_list_class:before, .header__language-switcher .lang_list_class:after { content: none; } } /* Navigation */ #nav-toggle { display: none; } /* Mobile toggles */ @media (max-width: 767px) { .header__navigation, .header__search, .header__language-switcher { display: none; width: 100%; } .header__navigation.open, .header__search.open, .header__language-switcher.open { background-color: #F8FAFC; display: block; left: 0; min-height: calc(100vh - 115px); position: absolute; right: 0; top: 75px; z-index: 2; } .header__navigation--toggle, .header__search--toggle, .header__language-switcher--toggle, .header__close--toggle { cursor: pointer; margin: 0 5vw; position: relative; } .header__navigation--toggle.hide, .header__search--toggle.hide, .header__language-switcher--toggle.hide { display: none; } .header__navigation--toggle.open, .header__search--toggle.open, .header__language-switcher--toggle.open { display: block; margin-left: 0; margin-right: auto; } .header__navigation--toggle:after, .header__search--toggle:after, .header__language-switcher--toggle:after { display: none; font-size: 1.083rem; font-weight: 600; position: absolute; left: 40px; text-transform: uppercase; top: -10px; } .header__navigation--toggle.open:after, .header__search--toggle.open:after, .header__language-switcher--toggle.open:after { display: block; word-break: normal; } .header__navigation--toggle { background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48c3ZnIHdpZHRoPSIyNHB4IiBoZWlnaHQ9IjI0cHgiIHZpZXdCb3g9IjAgMCAyNCAxOSIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4gICAgICAgIDx0aXRsZT5oYW1idXJnZXI8L3RpdGxlPiAgICA8ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz4gICAgPGcgaWQ9ImhhbWJ1cmdlciIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+ICAgICAgICA8ZyBpZD0iR3JvdXAiIHN0cm9rZT0iIzQ5NEE1MiIgc3Ryb2tlLXdpZHRoPSIzIj4gICAgICAgICAgICA8cmVjdCBpZD0iUmVjdGFuZ2xlIiB4PSIxLjUiIHk9IjEuNSIgd2lkdGg9IjIxIiBoZWlnaHQ9IjEiIHJ4PSIwLjUiPjwvcmVjdD4gICAgICAgICAgICA8cmVjdCBpZD0iUmVjdGFuZ2xlLUNvcHktNCIgeD0iMS41IiB5PSI5LjUiIHdpZHRoPSIyMSIgaGVpZ2h0PSIxIiByeD0iMC41Ij48L3JlY3Q+ICAgICAgICAgICAgPHJlY3QgaWQ9IlJlY3RhbmdsZS1Db3B5LTUiIHg9IjEuNSIgeT0iMTcuNSIgd2lkdGg9IjIxIiBoZWlnaHQ9IjEiIHJ4PSIwLjUiPjwvcmVjdD4gICAgICAgIDwvZz4gICAgPC9nPjwvc3ZnPg==); background-size: cover; height: 25px; width: 25px; } .header__navigation--toggle:after { content: "Menu"; } .header__language-switcher--toggle { background-image: url(//static.hsappstatic.net/cos-LanguageSwitcher/static-1.1/img/globe.png); background-size: cover; height: 25px; width: 25px; } .header__language-switcher--toggle:after { content: "Language"; } .header__search--toggle { background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48c3ZnIHdpZHRoPSIyNHB4IiBoZWlnaHQ9IjI0cHgiIHZpZXdCb3g9IjAgMCAyNCAyNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4gICAgICAgIDx0aXRsZT5TZWFyY2g8L3RpdGxlPiAgICA8ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz4gICAgPGRlZnM+ICAgICAgICA8cGF0aCBkPSJNOS4xMzg2MTUzNCwxNS44OTI1Njg1IEM1LjQxMzk1NzQyLDE1Ljg5MjU2ODUgMi4zODM4ODUyNywxMi44NjM0NDc1IDIuMzgzODg1MjcsOS4xMzkwMDM3NiBDMi4zODM4ODUyNyw1LjQxNDU2MDA1IDUuNDEzOTU3NDIsMi4zODM4ODUyNyA5LjEzODYxNTM0LDIuMzgzODg1MjcgQzEyLjg2MzI3MzMsMi4zODM4ODUyNyAxNS44OTI1Njg1LDUuNDE0NTYwMDUgMTUuODkyNTY4NSw5LjEzOTAwMzc2IEMxNS44OTI1Njg1LDEyLjg2MzQ0NzUgMTIuODYzMjczMywxNS44OTI1Njg1IDkuMTM4NjE1MzQsMTUuODkyNTY4NSBNOS4xMzg3NTI0NSwyLjQzMzYwODg3ZS0xMyBDMTQuMTc3OTk1NSwyLjQzMzYwODg3ZS0xMyAxOC4yNzY0NTM3LDQuMTAwMzI0NzEgMTguMjc2NDUzNyw5LjEzOTI3Nzk2IEMxOC4yNzY0NTM3LDExLjIyOTgyMTEgMTcuNTcxMDE2OSwxMy4xNTg0NDM0IDE2LjM4NTYzMTMsMTQuNjk5NjY5NiBMMjMuNjUwODg4MSwyMS45NjUyMjY2IEMyNC4xMTYzNzA2LDIyLjQzMDcwOTIgMjQuMTE2MzcwNiwyMy4xODU0MDU1IDIzLjY1MDg4ODEsMjMuNjUwODg4MSBDMjMuMTg1NDA1NSwyNC4xMTYzNzA2IDIyLjQzMDcwOTIsMjQuMTE2MzcwNiAyMS45NjUyMjY2LDIzLjY1MDg4ODEgTDE0LjY5OTgxMzMsMTYuMzg1NDcxMyBDMTMuMTU4NDQwNSwxNy41NzA5NTA5IDExLjIyOTU3MzgsMTguMjc2NDUzNyA5LjEzODc1MjQ1LDE4LjI3NjQ1MzcgQzQuMDk5NTA5MzgsMTguMjc2NDUzNyAtMy43MzAzNDkzNmUtMTQsMTQuMTc4MjMxMiAtMy43MzAzNDkzNmUtMTQsOS4xMzkyNzc5NiBDLTMuNzMwMzQ5MzZlLTE0LDQuMTAwMzI0NzEgNC4wOTk1MDkzOCwyLjQzMzYwODg3ZS0xMyA5LjEzODc1MjQ1LDIuNDMzNjA4ODdlLTEzIFoiIGlkPSJwYXRoLTEiPjwvcGF0aD4gICAgPC9kZWZzPiAgICA8ZyBpZD0iU2VhcmNoIiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4gICAgICAgIDxtYXNrIGlkPSJtYXNrLTIiIGZpbGw9IndoaXRlIj4gICAgICAgICAgICA8dXNlIHhsaW5rOmhyZWY9IiNwYXRoLTEiPjwvdXNlPiAgICAgICAgPC9tYXNrPiAgICAgICAgPHVzZSBpZD0iSWNvbnMvQWN0aW9ucy9TZWFyY2giIGZpbGw9IiM0OTRBNTIiIHhsaW5rOmhyZWY9IiNwYXRoLTEiPjwvdXNlPiAgICA8L2c+PC9zdmc+);
	background-size: cover; height: 25px; width: 25px; } .header__search--toggle:after { content: "Search"; } .header__close--toggle { background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48c3ZnIHdpZHRoPSIyNHB4IiBoZWlnaHQ9IjE5cHgiIHZpZXdCb3g9IjAgMCAyNCAxOSIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4gICAgICAgIDx0aXRsZT5jbG9zZTwvdGl0bGU+ICAgIDxkZXNjPkNyZWF0ZWQgd2l0aCBTa2V0Y2guPC9kZXNjPiAgICA8ZyBpZD0iY2xvc2UiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPiAgICAgICAgPGcgaWQ9Ikdyb3VwIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgyLjAwMDAwMCwgLTEuMDAwMDAwKSIgc3Ryb2tlPSIjNDk0QTUyIiBzdHJva2Utd2lkdGg9IjMiPiAgICAgICAgICAgIDxyZWN0IGlkPSJSZWN0YW5nbGUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEwLjAwMDAwMCwgMTAuNTAwMDAwKSByb3RhdGUoLTQ1LjAwMDAwMCkgdHJhbnNsYXRlKC0xMC4wMDAwMDAsIC0xMC41MDAwMDApICIgeD0iLTAuNSIgeT0iMTAuNSIgd2lkdGg9IjIxIiBoZWlnaHQ9IjEiIHJ4PSIwLjUiPjwvcmVjdD4gICAgICAgICAgICA8cmVjdCBpZD0iUmVjdGFuZ2xlLUNvcHktNSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTAuMDAwMDAwLCAxMC41MDAwMDApIHJvdGF0ZSg0NS4wMDAwMDApIHRyYW5zbGF0ZSgtMTAuMDAwMDAwLCAtMTAuNTAwMDAwKSAiIHg9Ii0wLjUiIHk9IjEwLjUiIHdpZHRoPSIyMSIgaGVpZ2h0PSIxIiByeD0iMC41Ij48L3JlY3Q+ICAgICAgICA8L2c+ICAgIDwvZz48L3N2Zz4=); background-repeat: no-repeat; background-size: 110%; display: none; height: 25px; margin-right: 0; width: 25px; } .header__close--toggle.show { display: block; } } /* Menu and simple menu */ .hs-menu-wrapper ul { display: flex; flex-wrap: wrap; list-style: none; margin: 0; padding-left: 0; } /* Horizontal menu */ .hs-menu-wrapper.hs-menu-flow-horizontal .hs-menu-children-wrapper { flex-direction: column; } @media (max-width: 767px) { .hs-menu-wrapper.hs-menu-flow-horizontal ul { flex-direction: column; } } /* Vertical menu */ .hs-menu-wrapper.hs-menu-flow-vertical ul { flex-direction: column; } /* Flyouts */ .hs-menu-wrapper.hs-menu-flow-vertical.flyouts ul { display: inline-flex; } @media (max-width: 767px) { .hs-menu-wrapper.hs-menu-flow-vertical ul { display: flex; } } .hs-menu-wrapper.flyouts .hs-item-has-children { position: relative; } .hs-menu-wrapper.flyouts .hs-menu-children-wrapper { left: -9999px; opacity: 0; position: absolute; } .hs-menu-wrapper.flyouts .hs-menu-children-wrapper a { display: block; white-space: nowrap; } .hs-menu-wrapper.hs-menu-flow-horizontal.flyouts .hs-item-has-children:hover > .hs-menu-children-wrapper { left: 0; opacity: 1; top: 100%; } .hs-menu-wrapper.hs-menu-flow-vertical.flyouts .hs-item-has-children:hover > .hs-menu-children-wrapper { left: 100%; opacity: 1; top: 0; } @media (max-width: 767px) { .hs-menu-wrapper.flyouts .hs-menu-children-wrapper, .hs-menu-wrapper.hs-menu-flow-horizontal.flyouts .hs-item-has-children:hover > .hs-menu-children-wrapper, .hs-menu-wrapper.hs-menu-flow-vertical.flyouts .hs-item-has-children:hover > .hs-menu-children-wrapper { left: 0; opacity: 1; position: relative; top: auto; } } /* CTA, logo, and rich text images */ .hs_cos_wrapper_type_cta img, .hs_cos_wrapper_type_logo img, .hs_cos_wrapper_type_rich_text img { height: auto; max-width: 100%; } /* Utilities Helper classes with ability to override anything that comes before it */ /* For content that needs to be visually hidden but stay visible for screenreaders */ .show-for-sr { border: 0 !important; clip: rect(0, 0, 0, 0) !important; height: 1px !important; overflow: hidden !important; padding: 0 !important; position: absolute !important; white-space: nowrap !important; width: 1px !important; } @media (max-width: 767px) { .show-for-sr--mobile { border: 0 !important; clip: rect(0, 0, 0, 0) !important; height: 1px !important; overflow: hidden !important; padding: 0 !important; position: absolute !important; white-space: nowrap !important; width: 1px !important; } }