@charset "utf-8"; /*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none} @font-face{font-family:"Neue Helvetica W01";font-style:normal;font-weight:100;src:url("/includes/cms/webfonts/cc0b18f1-39d1-4580-b602-5a15f141c052.eot?#iefix");src:url("/includes/cms/webfonts/cc0b18f1-39d1-4580-b602-5a15f141c052.eot") format("eot"),url("/includes/cms/webfonts/685c012e-b603-41bb-9f76-d7e1cab76f53.woff2") format("woff2"),url("/includes/cms/webfonts/0248a27d-0abf-4b74-a3c5-47a73e09098d.woff") format("woff"),url("/includes/cms/webfonts/47657cdc-7580-4429-a42b-88917e1ee633.ttf") format("truetype"),url("/includes/cms/webfonts/0cb85325-f0de-4961-88cd-36759752dddc.svg#0cb85325-f0de-4961-88cd-36759752dddc") format("svg");font-display:swap}@font-face{font-family:"Neue Helvetica W01";font-style:italic;font-weight:100;src:url("/includes/cms/webfonts/b74c519b-e2f4-426d-983e-73e6179fb1c3.eot?#iefix");src:url("/includes/cms/webfonts/b74c519b-e2f4-426d-983e-73e6179fb1c3.eot") format("eot"),url("/includes/cms/webfonts/176a80d2-cdc4-4f80-a617-24026f69062c.woff2") format("woff2"),url("/includes/cms/webfonts/8591aeba-737a-4116-9397-585c23ebe051.woff") format("woff"),url("/includes/cms/webfonts/e2fecb5c-a4e8-4326-99d3-04ccc5a2fe7b.ttf") format("truetype"),url("/includes/cms/webfonts/04afbdb8-b0c5-4f69-ad0a-d225e45f8882.svg#04afbdb8-b0c5-4f69-ad0a-d225e45f8882") format("svg");font-display:swap}@font-face{font-family:"Neue Helvetica W01";font-style:normal;font-weight:300;src:url("/includes/cms/webfonts/8827e223-8d96-4750-8b0c-8ef828fb1f0f.eot?#iefix");src:url("/includes/cms/webfonts/8827e223-8d96-4750-8b0c-8ef828fb1f0f.eot") format("eot"),url("/includes/cms/webfonts/0128d8b7-d00b-4315-8daa-970f97ecac64.woff2") format("woff2"),url("/includes/cms/webfonts/803af1a9-a09b-4de5-ba36-e3d228fb5bc4.woff") format("woff"),url("/includes/cms/webfonts/831880ae-4958-487d-bc2f-aa2c1a0636e7.ttf") format("truetype"),url("/includes/cms/webfonts/3513edb4-f4ad-4340-85e6-0cea8ca12237.svg#3513edb4-f4ad-4340-85e6-0cea8ca12237") format("svg");font-display:swap}@font-face{font-family:"Neue Helvetica W01";font-style:italic;font-weight:300;src:url("/includes/cms/webfonts/f58764aa-e314-4f4f-bcd5-2feb02b22e08.eot?#iefix");src:url("/includes/cms/webfonts/f58764aa-e314-4f4f-bcd5-2feb02b22e08.eot") format("eot"),url("/includes/cms/webfonts/6c334865-778f-4cb5-9b2e-cfdfb2d2c205.woff2") format("woff2"),url("/includes/cms/webfonts/ca10c83d-ebd5-4705-8f95-673919515083.woff") format("woff"),url("/includes/cms/webfonts/ab661d69-d776-4fbf-94fe-f7d2950ddc70.ttf") format("truetype"),url("/includes/cms/webfonts/72289c2d-620c-4c18-93d5-5938530db5e3.svg#72289c2d-620c-4c18-93d5-5938530db5e3") format("svg");font-display:swap}@font-face{font-family:"Neue Helvetica W01";font-style:normal;font-weight:400;src:url("/includes/cms/webfonts/285b0922-a3d2-4550-b29d-b4f74a9611e4.eot?#iefix");src:url("/includes/cms/webfonts/285b0922-a3d2-4550-b29d-b4f74a9611e4.eot") format("eot"),url("/includes/cms/webfonts/823e6839-53d8-41b9-a5a1-5f05833acd12.woff2") format("woff2"),url("/includes/cms/webfonts/92679273-9798-4d27-893b-d53dfd2bb4c7.woff") format("woff"),url("/includes/cms/webfonts/e4fb2994-44c3-40fe-bec7-9c4fa593b799.ttf") format("truetype"),url("/includes/cms/webfonts/ea22c7fc-8a36-484f-85e6-d014662a2273.svg#ea22c7fc-8a36-484f-85e6-d014662a2273") format("svg");font-display:swap}@font-face{font-family:"Neue Helvetica W01";font-style:italic;font-weight:400;src:url("/includes/cms/webfonts/cd36001a-de1e-4773-adcf-a6e589f0705a.eot?#iefix");src:url("/includes/cms/webfonts/cd36001a-de1e-4773-adcf-a6e589f0705a.eot") format("eot"),url("/includes/cms/webfonts/bcfc49d1-ee2f-4fcc-8322-99607f4a7007.woff2") format("woff2"),url("/includes/cms/webfonts/fd783951-0929-49f5-9cdd-5b34008bb362.woff") format("woff"),url("/includes/cms/webfonts/035a7d84-08c6-4e91-9dbc-a881c1d76333.ttf") format("truetype"),url("/includes/cms/webfonts/553e1a25-3907-46e7-9bec-d7b74e7e05eb.svg#553e1a25-3907-46e7-9bec-d7b74e7e05eb") format("svg");font-display:swap}@font-face{font-family:"Neue Helvetica W01";font-style:normal;font-weight:500;src:url("/includes/cms/webfonts/5abe98e8-3e80-4fd6-b27b-6ec4c6385461.eot?#iefix");src:url("/includes/cms/webfonts/5abe98e8-3e80-4fd6-b27b-6ec4c6385461.eot") format("eot"),url("/includes/cms/webfonts/c86f4d57-4caf-4c6f-9554-7926dd67e3f1.woff2") format("woff2"),url("/includes/cms/webfonts/92c69f6c-0185-4eb2-800e-1ee3947ca4dd.woff") format("woff"),url("/includes/cms/webfonts/e11c48d3-bed3-4b35-9d1e-1a5c7afe80e3.ttf") format("truetype"),url("/includes/cms/webfonts/394a4a67-cf1b-44ee-a02e-68dc9752d99e.svg#394a4a67-cf1b-44ee-a02e-68dc9752d99e") format("svg");font-display:swap}@font-face{font-family:"Neue Helvetica W01";font-style:normal;font-weight:700;src:url("/includes/cms/webfonts/e276fe3d-01c5-4575-99f1-3fc0780d5417.eot?#iefix");src:url("/includes/cms/webfonts/e276fe3d-01c5-4575-99f1-3fc0780d5417.eot") format("eot"),url("/includes/cms/webfonts/a61c00c6-86e7-4fa9-ac6b-476548df9cb8.woff2") format("woff2"),url("/includes/cms/webfonts/7fd00069-f615-471e-8089-b0bab013cfd9.woff") format("woff"),url("/includes/cms/webfonts/7c110d92-b5c8-416b-b5c6-5f1d6c3a720a.ttf") format("truetype"),url("/includes/cms/webfonts/ee27a720-58cd-465f-b85c-1a5b5bdee597.svg#ee27a720-58cd-465f-b85c-1a5b5bdee597") format("svg");font-display:swap}@font-face{font-family:"Neue Helvetica W01";font-style:italic;font-weight:700;src:url("/includes/cms/webfonts/21a97ece-dadb-4f5e-98d9-51ebcbd7ac41.eot?#iefix");src:url("/includes/cms/webfonts/21a97ece-dadb-4f5e-98d9-51ebcbd7ac41.eot") format("eot"),url("/includes/cms/webfonts/6a88d203-cbbc-42e9-b4b7-195631718870.woff2") format("woff2"),url("/includes/cms/webfonts/502de8c5-bac6-4ef6-9a65-4893fe147d51.woff") format("woff"),url("/includes/cms/webfonts/05b43b63-059e-407d-96d0-fa69d2eb6ec2.ttf") format("truetype"),url("/includes/cms/webfonts/440b047b-d7cc-44db-b119-817f01483587.svg#440b047b-d7cc-44db-b119-817f01483587") format("svg");font-display:swap} /************************************************************************************************** * Plugins styles */ /************************************************************************************************** * Custom plugins styles */ code {font-family: monospace, monospace;font-size: 1em;display: block;background: #fafae9;padding: 0.1em 1em;font-weight: bold; margin: 0.5em 0 0 0;border-bottom: solid 1px #dadada;} /* expand-toggle */ /* button.expand-toggle:after {content: "\f107";} */ /* button.expand-toggle.active:after { content: "\f106";} */ /* tab */ .tabs .tab-link {display: inline-block;background: #624963; color: #fff;padding: 0.25em 0.75em;} .tabs .tab-link.active {background: #fff;border: solid 1px #624963; border-bottom: none;color: #624963;} .tabs .tab-content {display: none;border-top: solid 1px #443247;margin-top: -1px;position: relative;} /* Modal */ .bayer-modal {display: none; position: fixed;z-index: 1; padding-top: 100px; left: 0;top: 0; width: 100%;height: 100%;overflow: auto;background-color: rgb(0, 0, 0); background-color: rgba(0, 0, 0, 0.4);} .bayer-modal .modal-body {background-color: #fefefe;margin: auto; border: 1px solid #888; width: 60%; max-width: 700px;min-width: 320px;} .bayer-modal .modal-title {margin: 0; padding: 15px; background: #fafafa;border-bottom: #eee 1px solid;} .bayer-modal .modal-content { text-align: center; padding: 20px;} .bayer-modal .modal-footer {height: 70px; background: #fbfbfb;border-top: #eee 1px solid;} .bayer-modal .modal-footer button {font-size: 12px;float: right;margin-right: 20px;} .bayer-modal .closeX {color: #aaaaaa; float: right;font-size: 28px;font-weight: bold; padding-right: 15px;} .bayer-modal .close:hover,.bayer-modal .close:focus {color: #ccc;text-decoration: none; cursor: pointer;} @media screen and (max-width: 450px) {.bayer-modal{padding-top:60px;height: 90%;}.bayer-modal .modal-body{width: 90%;}} /* loadingSpinner */ .loadingSpinner {display: none; z-index: 99999; position: absolute; top: 0; left: 0;width: 100%;height: 100%;background: rgba(0, 0, 0, 0.8);} .loadingSpinner .spinnerDiv {position: absolute;z-index: 2000000000;} .loadingSpinner .spinner {/* width: 100px;height: 100px; */ color: #ccc;-webkit-animation-name: spin;-webkit-animation-duration: 1500ms;-webkit-animation-iteration-count: infinite;-webkit-animation-timing-function: ease-in-out; -moz-animation-name: spin;-moz-animation-duration: 1500ms;-moz-animation-iteration-count: infinite;-moz-animation-timing-function: ease-in-out;-ms-animation-name: spin;-ms-animation-duration: 1500ms;-ms-animation-iteration-count: infinite;-ms-animation-timing-function: ease-in-out;animation-name: spin; animation-duration: 1500ms; animation-iteration-count: infinite;animation-timing-function: ease-in-out;} @-moz-keyframes spin {from {-moz-transform: rotate(0deg);}to {-moz-transform: rotate(720deg);}} @-webkit-keyframes spin {from {-webkit-transform: rotate(0deg);}to {-webkit-transform: rotate(720deg);}} @keyframes spin {from { transform: rotate(0deg);}to {transform: rotate(720deg);}} .loadingSpinner .progressbar-text { color: #fff;font-size: 16px;margin: -75px 50px;} /* tablesorter */ table.tablesorter thead tr .header {background-image: url(lib/images/sort_both.png);background-repeat: no-repeat; background-position: center right; cursor: pointer;padding-right: 30px; } table.tablesorter thead tr .headerSortUp { background-image: url(lib/images/sort_asc.png); } table.tablesorter thead tr .headerSortDown { background-image: url(lib/images/sort_desc.png); } /* sticky header table */ .floatThead-container{background:#fff;margin-top:-12px !important;} @media screen and (max-width: 1024px) {.floatThead-container{margin-top:-4px !important;}} /*sticky wide table*/ .sticky-wrap {overflow-x: auto;overflow-y: hidden;position: relative;margin: 3em 0;width: 100%;} .sticky-wrap .sticky-thead,.sticky-wrap .sticky-col,.sticky-wrap .sticky-intersect {opacity: 0;position: absolute;top: 0;left: 0;transition: all .125s ease-in-out;z-index: 50;width: auto;background: #fff;} .sticky-wrap .sticky-thead {box-shadow: 0 0.25em 0.1em -0.1em rgba(0,0,0,.125);z-index: 100;width: 100%;} .sticky-wrap .sticky-intersect {opacity: 1;/* z-index: 150; */} .sticky-wrap td,.sticky-wrap th {box-sizing: border-box;} .sticky-wrap.sticky-wide-table {overflow-y: auto;} /************************************************************************************************** * Default styles */ /* General element styling */ html { font: 400 100%/1.625 "Neue Helvetica W01",Arial,Roboto,sans-serif; color: #0d2a40; letter-spacing: 0.5px; font-style: normal; } body { min-width: 20em; margin-left: auto; margin-right: auto; } h1 { font-size: 2.5em; font-weight: 100; letter-spacing: 0.4px; line-height: 1; margin-bottom: 0.925em; color: #10384f; } h2 { font-size: 1.875em; font-weight: 300; letter-spacing: 0.4px; line-height: 1.333; margin-bottom: 0.5em; } h3 { font-size: 1.4375em; font-weight: 300; letter-spacing: 0.7px; line-height: 1.174; margin-bottom: 0.5em; } a { color: #0075A6; text-decoration: none; font-weight: 400; transition: opacity 0.3s ease 0s, color 0.3s ease 0s; } hr { margin-top: 30px; } a:hover, a:focus, a:active { text-decoration: underline; } a img { transition: opacity 0.2s 0s ease; } a:hover img, a:focus img, a:active img { opacity: 0.6; } img { display: block; max-width: 100%; height: auto; } code { font-weight: bold; } button, .button, input[type="button"], input[type="submit"] { cursor: pointer; background-color: #624963; color: #fff; border: none; text-transform: uppercase; font-size: 0.875em; text-decoration: none; padding: 1.5em 2em 1.5em 1.8em; font-weight: 700; font-style: italic; transition: background-color 0.3s ease 0s; margin: 1em 0; display: inline-block; line-height: 1; } button:hover, .button:hover, input[type="button"]:hover, input[type="submit"]:hover, button:focus, .button:focus, input[type="button"]:focus, input[type="submit"]:focus, button:active, .button:active, input[type="button"]:active, input[type="submit"]:active { text-decoration: none; } .icon-button { background: transparent; color: #0075A6; padding: 0; margin: 0; text-decoration: none; transition: color 0.2s ease; } .icon-button:after { margin: 0; font-size: 1.3em; font-size: 1.3rem; line-height: 0.6; } .icon-button:hover, .icon-button:focus, .icon-buttonactive { background: transparent; color: #443247; padding: 0; margin: 0; text-decoration: none; } .icon-button:hover:after, .icon-button:focus:after, .icon-button:active:after { margin: 0; } table { border-spacing: 0.5em 0; } table th { padding: 0.5em 0 0.4em; font-weight: 500; line-height: 1.25; border-bottom: solid 2px #89d329; } table td { padding: 0.5em 0 0.4em; border-bottom: 1px solid #cfd7dc; } form label { font-weight: 500; display: block; margin-top: 1.5em; } form fieldset { margin-top: 1.5em; } form legend { font-weight: 500; padding: 0 0.75em; } form input[type="text"], form input[type="email"], form input[type="number"], form input[type="tel"], form input[type="url"], form input[type="password"], form input[type="date"], form input[type="time"], form input[type="datatime"], form input[type="month"], form input[type="search"], form input[type="file"], form textarea { background: #fff;display: block;border: solid 1px #443247;padding: 0.5em 0.8em;width: 100%;box-sizing: border-box;max-width: 40em;} form input[type="text"]:disabled, form input[type="password"]:disabled, form textarea:disabled, form input[type="file"]:disabled { background: #eee; } form select { background: #fff; border: solid 1px #443247; padding: 0.25em 0.8em; width: 100%; max-width: 40em; } form select option { background: #fff; padding: 0.25em 0.8em; } form select:disabled, form select option:disabled { background: #eee; } :root form input[type="checkbox"] { position: absolute; left: -1000em; } /* move outside viewport */ :root form input[type="checkbox"] + label { cursor: pointer; margin-top: 0; font-weight: 300; line-height: 1.4; } :root form input[type="checkbox"] + label:before { content: "\f0c8"; font-family: "Font Awesome 5 Free"; font-weight: normal; font-size: 1.2em; line-height: 1.2; vertical-align: top; display: inline-block; width: 1.2em; } :root form input[type="checkbox"]:checked + label:before { content: "\f14a"; } :root form input[type="checkbox"]:disabled + label { color: #999; } :root form input[type="checkbox"]:disabled + label:before { color: #ccc; } :root form input[type="radio"] { position: absolute; left: -1000em; } /* move outside viewport */ :root form input[type="radio"] + label { cursor: pointer; margin-top: 0; font-weight: 300; line-height: 1.4; } :root form input[type="radio"] + label:before { content: "\f111"; font-family: "Font Awesome 5 Free"; font-weight: normal; font-size: 1.2em; line-height: 1.2; vertical-align: top; display: inline-block; width: 1.2em; } :root form input[type="radio"]:checked + label:before { content: "\f192"; } :root form input[type="radio"]:disabled + label { color: #999; } :root form input[type="radio"]:disabled + label:before { color: #ccc; } form ::-webkit-input-placeholder { color: #443247; opacity: 0.8; font-style: italic; font-weight: 100; } form :-moz-placeholder { color: #443247; opacity: 0.8; font-style: italic; font-weight: 100; } form ::-moz-placeholder { color: #443247; opacity: 0.8; font-style: italic; font-weight: 100; } form :-ms-input-placeholder { color: #443247; opacity: 0.8; font-style: italic; font-weight: 100; } form ::-ms-input-placeholder { color: #443247; opacity: 0.8; font-style: italic; font-weight: 100; } form :placeholder-shown { color: #443247; opacity: 0.8; font-style: italic; font-weight: 100; } /* Font awesome buttons*/ .button-fa, .button-fa:hover, .button-fa:active, .button-fa:focus {background-image:none !important; padding-right: 2em !important; padding-left: 2em !important; padding-top: 1.5em !important; } .button-fa:after{ content:""; } .button-fa i{ line-height: 0; vertical-align: middle; } .button-fa-left i{ padding-right: 0.5em; } .button-fa-right i{ padding-left: 0.5em; } .button-fa-icononly, .button-fa-icononly:hover, .button-fa-icononly:active, .button-fa-icononly:focus {color: #0075A6; background-color: white !important; margin:0; padding: 1em !important;} /* Custom styles */ .floatleft { float: left; } .floatright { float: right; } .layoutList{ list-style-type: none; margin: 0; padding: 0; } .aligncenter { text-align: center; } .td {display:table-cell;} .tr {display:table-row;} .table {display:table;} /* form */ label .required {color: red;} form label.error {margin-top:0; color: red;} form input.error,form textarea.error,form select.error {border-color: red;} /* table styles */ .tdcenter { text-align: center; } .tdleft { text-align: left; } .subtotalcell {border-bottom:solid 2px #89d329; border-top:solid 2px #89d329;background-color:#eef9e0;} /* .layoutTable {} */ .reporttable th {text-align:left;} /************************************************************************************************** * Helpers - default/global */ .hidden { display: none !important; } .visually-hidden { border: 0 !important; clip: rect(0 0 0 0) !important; height: 1px !important; margin: -1px !important; overflow: hidden !important; padding: 0 !important; position: absolute !important; width: 1px !important; } .grid { display: table; table-layout: fixed; width: 100%; } .grid > [class*="grid-col"] { display: table-cell; vertical-align: top; width: 8.333%; } .grid > .grid-col-2 { width: 16.667%; } .grid > .grid-col-3 { width: 25%; } .grid > .grid-col-4 { width: 33.333%; } .grid > .grid-col-5 { width: 41.667%; } .grid > .grid-col-6 { width: 50%; } .grid > .grid-col-7 { width: 58.333%; } .grid > .grid-col-8 { width: 66.667%; } .grid > .grid-col-9 { width: 75%; } .grid > .grid-col-10 { width: 83.333%; } .grid > .grid-col-11 { width: 91.667%; } .aspect-box { position: relative; width: 100%; } .aspect-box:before { content: ""; display: block; padding-top: 56.25%; } .aspect-box > :first-child { position: absolute; top: 0; left: 0; bottom: 0; right: 0; border: none; width: 100%; height: 100%; } .expand { display: none; } .expand.active, .no-js .expand { display: block; } .restrict { max-width: 80em; margin-left: auto; margin-right: auto; } .restrict-sub > * { max-width: 80em; margin-left: auto; margin-right: auto; } .no-restrict { max-width: none; } .stretch .outer { display: none; } form .note { margin-top: 0; font-size: 0.7em; color: #666; font-style: italic; } form .err-msg { margin: 0; color: darkred; font-weight: 400; } form .err-msg:before { content: "\f071"; font-family: "Font Awesome 5 Free"; font-weight: 900; margin-right: 0.5em; } form .msg { background: #fafafa; border: solid 1px #ccc; padding: 0.5em 1em 0.75em 5em; margin: 1em 0; border-left: none; border-right: none; color: #555; } form .msg .fa { float: left; margin-left: -1.4em; font-size: 3em; color: darkorange; margin-top: 0.15em; } form .msg p { margin: 0; } form .msg .title { font-size: 1.5em; color: darkorange; font-weight: 400; } form .msg-success { background: #fafafa; border: solid 1px #ccc; padding: 0.5em 1em 0.75em 5em; margin: 1em 0; border-left: none; border-right: none; color: #555; } form .msg-success .fa { float: left; margin-left: -1.4em; font-size: 3em; color: darkgreen; margin-top: 0.15em; } form .msg-success p { margin: 0; } form .msg-success .title { font-size: 1.5em; color: darkgreen; font-weight: 400; } form .msg-failure { background: #fafafa; border: solid 1px #ccc; padding: 0.5em 1em 0.75em 5em; margin: 1em 0; border-left: none; border-right: none; color: #555; } form .msg-failure .fa { float: left; margin-left: -1.4em; font-size: 3em; color: darkred; margin-top: 0.15em; } form .msg-failure p { margin: 0; } form .msg-failure .title { font-size: 1.5em; color: darkred; font-weight: 400; } .message { background: #fafafa; border: solid 1px #ccc; padding: 0.5em 1em 0.75em 5em; margin: 1em 0; border-left: none; border-right: none; color: #555; } .message .fa { float: left; margin-left: -1.4em; font-size: 3em; color: darkorange; margin-top: 0.15em; } .message p { margin: 0; } .message .title { font-size: 1.5em; color: darkorange; font-weight: 400; } .message.message-success .fa { color: darkgreen; } .message.message-success .title { color: darkgreen; } .message.message-failure .fa { color: darkred; } .message.message-failure .title { color: darkred; } /* Helpers - small size only - helpers are explicit for each size and non-cumulative */ @media screen and (max-width: 47.99em) { .hidden-s { display: none !important; } .grid-s { display: table; table-layout: fixed; width: 100%; } .grid-s > [class*="grid-col"] { display: table-cell; vertical-align: top; width: 8.333%; } .grid-s > .grid-col-2 { width: 16.667%; } .grid-s > .grid-col-3 { width: 25%; } .grid-s > .grid-col-4 { width: 33.333%; } .grid-s > .grid-col-5 { width: 41.667%; } .grid-s > .grid-col-6 { width: 50%; } .grid-s > .grid-col-7 { width: 58.333%; } .grid-s > .grid-col-8 { width: 66.667%; } .grid-s > .grid-col-9 { width: 75%; } .grid-s > .grid-col-10 { width: 83.333%; } .grid-s > .grid-col-11 { width: 91.667%; } .expand-s { display: none; } .expand-s.active, .no-js .expand-s { display: block; } } /* Helpers - medium size only - helpers are explicit for each size and non-cumulative */ @media screen and (min-width: 48em) and (max-width: 63.99em) { .hidden-m { display: none !important; } .grid-m { display: table; table-layout: fixed; width: 100%; } .grid-m > [class*="grid-col"] { display: table-cell; vertical-align: top; width: 8.333%; } .grid-m > .grid-col-2 { width: 16.667%; } .grid-m > .grid-col-3 { width: 25%; } .grid-m > .grid-col-4 { width: 33.333%; } .grid-m > .grid-col-5 { width: 41.667%; } .grid-m > .grid-col-6 { width: 50%; } .grid-m > .grid-col-7 { width: 58.333%; } .grid-m > .grid-col-8 { width: 66.667%; } .grid-m > .grid-col-9 { width: 75%; } .grid-m > .grid-col-10 { width: 83.333%; } .grid-m > .grid-col-11 { width: 91.667%; } .expand-m { display: none; } .expand-m.active, .no-js .expand-m { display: block; } } /* Helpers - large size only - helpers are explicit for each size and non-cumulative */ @media screen and (min-width: 64em) { .hidden-l { display: none !important; } .grid-l { display: table; table-layout: fixed; width: 100%; } .grid-l > [class*="grid-col"] { display: table-cell; vertical-align: top; width: 8.333%; } .grid-l > .grid-col-2 { width: 16.667%; } .grid-l > .grid-col-3 { width: 25%; } .grid-l > .grid-col-4 { width: 33.333%; } .grid-l > .grid-col-5 { width: 41.667%; } .grid-l > .grid-col-6 { width: 50%; } .grid-l > .grid-col-7 { width: 58.333%; } .grid-l > .grid-col-8 { width: 66.667%; } .grid-l > .grid-col-9 { width: 75%; } .grid-l > .grid-col-10 { width: 83.333%; } .grid-l > .grid-col-11 { width: 91.667%; } .expand-l { display: none; } .expand-l.active, .no-js .expand-l { display: block; } } /* Layout styles */ header .grid .grid-col { vertical-align: middle; width: 100%; } header .grid .site-name { display: none; } header .grid .bayer-logo { padding: 0.5em; width: 5em; box-sizing: border-box; } header .grid .bayer-logo img { width: 3em; height: auto; } header .grid .bayer-logo .sticky-logo { display: none; } header .grid .nav-button { width: 3.8125em; text-align: center; } header .grid .nav-button button { font-style: normal; font-weight: normal; padding: 0.8em 0.6em; color: #cfd7dc; transition: color 0.3s ease 0s; background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 16'%3E%3Cpath d='M5,1.2h21 M2.5,8.2H26 M0,15.2h26' style='stroke:%230d2a40;fill:none;stroke-width:1.5;'/%3E%3C/svg%3E") no-repeat center center; background-size: 1.6875em; width: 1.6875em; } header .grid .nav-button button.active { background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 26 26'%3E%3Cpath d='M1,1l24,24 M25,1L1,25' style='stroke:%230d2a40;fill:none;stroke-width:2;'/%3E%3C/svg%3E") no-repeat center center; } header .top-nav { background: #10384f; color: #fff; } header .top-nav ul { list-style-type: none; padding: 0; margin: 0; clear: both; border-top: solid 1px rgba(191,215,223,0.25); } header .top-nav ul ul { background: rgba(255,255,255,0.1); } header .top-nav li { padding: 0; border-top: solid 1px rgba(191,215,223,0.25); overflow: hidden; } header .top-nav li:first-child { border-top: none; } header .top-nav .section-title { margin: 0.8em; display: inline-block; } header .top-nav a { color: #fff; text-decoration: none; margin: 0.8em; display: inline-block; } header .top-nav a:hover, header .top-nav a:focus, header .top-nav a:active { color: #00bcff; } header .top-nav button { width: 2em; height: 2em; padding: 0; margin: 0.8em 1em 0.8em 0; font-style: normal; font-weight: normal; float: right; background: rgba(255,255,255,0.1); border-radius: 100%; } header .top-nav button:hover { background: rgba(255,255,255,0.2); } header .top-nav button:after { content: "\f107"; font-family: "Font Awesome 5 Free"; font-weight: 900; font-size: 2em; } header .top-nav button.active:after { content: "\f106"; } article { min-height: 10em ; padding: 0 1.5em 2em; } article button, article a.button { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='57' height='50' viewBox='0 0 68 60'%3E%3Cpolygon points='68,60 0,60 11,0 68,0' fill='%23443247' fill-opacity='1'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: top right; background-size: auto 100%; padding-right: 5.5em; transition: padding 0.3s ease 0s, background-color 0.3s ease 0s; } article button:after, article a.button:after { content: "\f105"; font-family: "Font Awesome 5 Free"; font-weight: 900; font-style: normal; font-size: 2em; line-height: 0.5; float: right; margin-right: -2em; transition: margin 0.3s ease 0s; } article button:hover, article a.button:hover { padding-left: 2.3em; padding-right: 5em; } article button:hover:after, article a.button:hover:after { margin-right: -1.5em; } article .error-msg { background: #ff3162; border: solid 2px #d30f4b; border-radius: 0.5em; color: white; margin: 1em 0; max-width: 30em; } article .error-msg .title { background: #d30f4b; margin: 0; text-align: center; padding: 0.5em; font-weight: 400; } article .error-msg .title > i { margin-right: 0.5em; } article .error-msg .msg { margin: 1em; } footer { background: #443247; color: #fff; font-weight: 300; overflow: hidden; max-width: 122.5em; margin: 0 auto; padding-bottom: 5em; } footer nav { padding: 0 2em; } footer h4 { font-size: 1.5625em; font-weight: 300; margin: 1.5em 0 0.5em; } footer ul { list-style-type: none; margin: 0; padding: 0; } footer a { color: #fff; font-weight: 300; opacity: 0.7; } footer a:hover, footer a:focus, footer a:active { opacity: 1; } footer nav > ul ul li { padding: 0.5em 0 0; } footer nav > ul ul li:before { content: "\f105"; font-family: "Font Awesome 5 Free"; font-weight: 900; font-size: 1.2em; line-height: 0.5em; margin-right: 0.5em; opacity: 0.7; } footer nav > ul ul ul { padding-left: 1em; } footer .footer-nav { background: #624963; overflow: hidden; padding: 0; position: relative; padding-bottom: 5em; } footer .footer-nav:after { content: ""; position: absolute; width: 100%; transform: skewY(-3deg); background: #443247; height: 10em; bottom: -6.8em; } footer .footer-nav > ul { max-width: 80em; margin: 0 auto; overflow: hidden; } footer .footer-nav > ul > li { float: left; padding: 0 2em; width: 20em; box-sizing: border-box; } footer .social { max-width: 80em; margin: 0 auto; text-align: center; } footer .social ul { width: auto; margin: 0 auto; } footer .social li { vertical-align: middle; width: auto !important; padding: 0 0.8em; } footer .social li:first-child { padding-left: 0; } footer .social li:last-child { padding-right: 0; } footer .social a { background: #ff3162; display: block; opacity: 1; font-size: 1.8em; width: 1.7em; } footer .social .facebook:hover, footer .social .facebook:focus, footer .social .facebook:active { background: #3b5998; } footer .social .twitter:hover, footer .social .twitter:focus, footer .social .twitter:active { background: #33ccff; } footer .social .youtube:hover, footer .social .youtube:focus, footer .social .youtube:active { background: #ff3333; } footer .social .linkedin:hover, footer .social .linkedin:focus, footer .social .linkedin:active { background: #4875b4; } footer .social .instagram:hover,footer .social .instagram:focus, footer .social .instagram:active { background-size: cover; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3CradialGradient id='SVGID_1_' cx='-252.4345' cy='-357.1085' r='47.0226' fx='-289.8003' fy='-340.1748' gradientTransform='matrix(0.7321 -0.65 -0.5339 -0.5847 16.3922 -351.7571)' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' style='stop-color:%23F9ED32'/%3E%3Cstop offset='0.6407' style='stop-color:%23EE2A7B'/%3E%3Cstop offset='1' style='stop-color:%23002AFF'/%3E%3C/radialGradient%3E%3Cpath id='insta' d='M0,0h68v68H0V0z' style='fill:url(%23SVGID_1_)'/%3E%3C/svg%3E"); } footer .social .rss:hover, footer .social .rss:focus, footer .social .rss:active { background: #ffa500; } footer .copyright nav { padding: 2em; margin: 0 auto; max-width: 20em; } footer .copyright nav ul { padding: 2em 0; border: 1px solid rgba(255,255,255,0.4); border-left: none; border-right: none; } footer .copyright nav li { padding: 0.5em 0 0; } footer .copyright nav li:first-child { padding: 0; } footer .copyright nav li:before { content: "\f105"; font-family: "Font Awesome 5 Free"; font-weight: 900; font-size: 1.2em; line-height: 0.5em; margin-right: 0.5em; opacity: 0.7; } footer .copyright p { max-width: 20em; margin: 0 auto 3em; font-size: 0.8em; text-align: center; } /* Module styles */ .corporate-container .inner .grid { width: auto; padding: 0; margin: 0; float: right; } .corporate-container .inner .grid-col { vertical-align: middle; width: auto; padding: 0.5em; background-color: #443247; white-space: nowrap; } .corporate-container .inner .grid-col a { color: #fff; font-size: 0.75em; font-weight: 400; } .corporate-container .inner .grid-col:first-child { text-align: right; background-color: #fff; padding-right: 1em; } .corporate-container .inner a { text-decoration: none; } .corporate-container .inner a:hover, .corporate-container .inner a:focus, .corporate-container .inner a:active { color: #ff3162; } .corporate-container .inner a.active { color: #00bcff !important; } .corporate-container img { display: inline-block; vertical-align: middle; } .corporate-container .outer { display: none; } .corporate-container .mega-menu { position: absolute; left: 0; right: 0; background: #443247; z-index: 2; padding: 0 2em 3em; display: none; box-shadow: 0 0.5em 1em rgba(0,0,0,0.5); } .corporate-container .mega-menu .grid-l { max-width: 80em; margin-left: auto; margin-right: auto; } .corporate-container .mega-menu .grid-col { vertical-align: top; background: #443247; } .corporate-container .mega-menu .business h2 { color: #fff; font-weight: 700; font-size: 1.5em; } .corporate-container .mega-menu .business a { color: #fff; font-size: 0.875em; } .corporate-container .mega-menu .business a img { display: block; width:100%; height: auto; } .corporate-container .mega-menu .business p { color: #fff; line-height: 1.3; font-size: 0.875em; } .corporate-container .mega-menu .business a + p + a { color: #66b512; font-weight: 700; font-style: italic; text-transform: uppercase; padding-left: 1.2em; background: transparent url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='15'%20height='22'%20viewBox='0%200%2015%2022'%3E%3Cpath%20d='M2,21.1l-1-0.2l4-20l1,0.2L2,21.1z%20M10,1.1L9,0.9l-4,20l1,0.2L10,1.1z%20M14,1.1l-1-0.2l-4,20l1,0.2L14,1.1z'%20style='fill:%2366b512'/%3E%3C/svg%3E") no-repeat top left; } .corporate-container .mega-menu .business .links { padding-top: 2em; } .corporate-container .mega-menu .business .links ul { list-style-type: none; margin: 0; padding: 0; } .corporate-container .mega-menu .business .links li { padding-left: 1.6em; } .corporate-container .mega-menu .business .links li:before { content: "\f105"; font-family: "Font Awesome 5 Free"; font-weight: 900; font-style: normal; font-size: 1.6em; line-height: 0.7; color: #ff3162; opacity: 0.7; float: left; margin: 0.1em 0.4em 0 -1em; } .corporate-container .mega-menu .locations .countries { padding-right: 1em; } .corporate-container .mega-menu .locations .countries h2 { color: #fff; font-size: 1.5625em; font-weight: 700; letter-spacing: 0.71px; } .corporate-container .mega-menu .locations .countries ul { border-top: solid 1px rgba(191, 215, 223, 0.25); margin: 0; padding: 0; list-style-type: none; max-height: 15em; overflow-y: auto; overflow-x: hidden; } .corporate-container .mega-menu .locations .countries ul li { border-bottom: solid 1px rgba(191, 215, 223, 0.25); } .corporate-container .mega-menu .locations .countries ul li button { background: transparent; text-transform: none; font-style: normal; font-size: 1.125em; font-weight: 300; display: block; margin: 0; padding: 1em 0.75em 1em 0; } .corporate-container .mega-menu .locations .countries ul li button:before { content: "\f105"; font-family: "Font Awesome 5 Free"; font-weight: 900 !important; font-style: normal; font-size: 1.6em; line-height: 0.7; color: #ff3162; font-weight: 300; opacity: 0.7; float: left; margin-right: 0.4em; } .corporate-container .mega-menu .locations .countries ul li:first-child button { font-weight: 700; } .corporate-container .mega-menu .locations .details { padding-left: 1em; padding-right: 1em; } .corporate-container .mega-menu .locations .details > div { max-height: 15em; overflow-y: auto; overflow-x: hidden; white-space: normal; } .corporate-container .mega-menu .locations .details .pacifier { color: #fff; font-size: 3em; display: none; } .corporate-container .mega-menu .locations .details .pacifier i { display: block; font-size: 2em; margin-bottom: 0.25em; } .corporate-container .mega-menu .locations .details.loading .pacifier { display: block; } .corporate-container .mega-menu .locations .details .detail-box { vertical-align: top; display: inline-block; color: #fff; width: 50%; padding: 0 2em 1em 0; box-sizing: border-box; } .corporate-container .mega-menu .locations .details .detail-box h3 { margin-top: 0; } .corporate-container .mega-menu .locations .details .detail-box a { color: #89d329; font-weight: 500; font-size: 1em; } .corporate-container .mega-menu .locations .details .detail-box:first-child + .detail-box + .detail-box { clear: left; } .corporate-container .mega-menu .locations .global-links { padding-left: 1em; padding-top: 1em; } .corporate-container .mega-menu .locations .global-links ul { list-style-type: none; margin: 0; padding: 0; } .corporate-container .mega-menu .locations .global-links li { padding-left: 1.6em; } .corporate-container .mega-menu .locations .global-links li:before { content: "\f105"; font-family: "Font Awesome 5 Free"; font-weight: 900 !important; font-style: normal; font-size: 1.6em; line-height: 0.7; color: #ff3162; font-weight: 300; opacity: 0.7; float: left; margin: 0.1em 0.4em 0 -1em; } .corporate-container .mega-menu .locations .global-links ul li a { color: #fff; } .corporate-container .mega-menu .locations .contact-us { background-color: #ff3162; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='57' height='50' viewBox='0 0 68 60'%3E%3Cpolygon points='68,60 0,60 11,0 68,0' fill='%23d30f4b' fill-opacity='1'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: top right; background-size: auto 100%; padding-right: 5.5em; transition: padding 0.3s ease 0s, background-color 0.3s ease 0s; } .corporate-container .mega-menu .locations .contact-us:after { content: "\f105"; font-family: "Font Awesome 5 Free"; font-weight: 900; font-style: normal; font-size: 2em; line-height: 0.5; float: right; margin-right: -2em; transition: margin 0.3s ease 0s; } .corporate-container .mega-menu .locations .contact-us:hover, .corporate-container .mega-menu .contact-us:focus { padding-left: 2.3em; padding-right: 5em; background-color: #d30f4b; } .corporate-container .mega-menu .locations .contact-us:hover:after, .corporate-container .mega-menu .contact-us:focus:after { margin-right: -1.5em; } .corporate-container .mega-menu .websites h2 { color: #fff; max-width: 42.667em; margin-left: auto; margin-right: auto; } .corporate-container .mega-menu .websites select::-ms-expand { display: none; } .corporate-container .mega-menu .websites select { -webkit-appearance: none; -moz-appearance: none; -o-appearance: none; appearance: none; background-position: 98% center; background-repeat: no-repeat; outline: none; border: none; border-radius: 0; box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); font-size: 1em; padding: 0.5em 0.75em; height: 3.125em; width: 100%; font-style: normal; font-weight: 400; color: #fff; background: #66b512 no-repeat right center; letter-spacing: 0.5px; margin-bottom: 1em; display: block; line-height: 1; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='50' viewBox='0 0 56 50'%3E%3Cpolygon points='56,50 0,50 11,0 56,0' style='opacity:0.4;fill:%23042;'/%3E%3Cpath d='M39.8,20.9l-8.5,8.5l-8.5-8.5' style='stroke:%23fff;stroke-width:2;fill:none;'/%3E%3C/svg%3E"); } .corporate-container .mega-menu .websites select option { color: #042; background-color: #fff; border-bottom: 1px solid #333; padding: 1.25em; } .corporate-container .mega-menu .websites .note { color: #fff; font-weight: 300; padding: 0.5em; } .corporate-container .mega-menu .websites .search input { height: 3.125em; width: 100%; box-sizing: border-box; border: none; padding: 1em; } .corporate-container .mega-menu .websites .search button { height: 3.125em; width: 3.5em; font-size: 1em; margin: 0; padding: 0; box-sizing: border-box; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='50' viewBox='0 0 56 50'%3E%3Cpolygon points='56,50 0,50 11,0 56,0' style='opacity:1;fill:%2366b512;'/%3E%3C/svg%3E"); background-color: #fff; } .corporate-container .mega-menu .websites .search button i { font-size: 2em; box-sizing: border-box; } .corporate-container .mega-menu .websites .search > .grid-col:first-child { width: 100%; } .corporate-container .mega-menu .websites .search > .grid-col:first-child + .grid-col { width: 3.5em; } .corporate-container .mega-menu .websites .search .count { color: #89D329; } .corporate-container .mega-menu .websites .search .pacifier { text-align: center; color: #fff; font-size: 2em; display: none; } .corporate-container .mega-menu .websites .search .pacifier i { font-size: 2em; margin-bottom: 0.2em; margin-right: 0.25em; vertical-align: middle; } .corporate-container .mega-menu .websites .search.loading .pacifier { display: block; } .corporate-container .mega-menu .websites .search .results { color: #fff; max-height: 20em; overflow-y: auto; } .corporate-container .mega-menu .websites .search .results ul { list-style-type: none; margin: 0 auto; padding: 0; max-width: 80em; } .corporate-container .mega-menu .websites .search .results li { padding-left: 1.5em; } .corporate-container .mega-menu .websites .search .results li:before { content: "\f105"; font-family: "Font Awesome 5 Free"; font-weight: 900; font-style: normal; font-size: 1.6em; line-height: 0.7; color: #89D329; font-weight: 300; opacity: 0.7; float: left; margin: 0.2em 0.4em 0 -1em; } .corporate-container .mega-menu .websites .search .results li a { color: #fff; font-weight: 700; display: block; } .corporate-container .mega-menu .websites .search .results li span { display: inline-block; vertical-align: top; margin-right: 2em; } .corporate-container .mega-menu .websites .search .results li p { font-weight: 300; } .corporate-container .mega-menu .close-mega-menu { background: #ff3162 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 18 18'%3E%3Cpath id='close' d='M18,1.3L16.7,0L9,7.7L1.3,0L0,1.3L7.7,9L0,16.7L1.3,18L9,10.3l7.7,7.7l1.3-1.3L10.3,9L18,1.3z' style='fill:rgb(255, 255, 255)'/%3E%3C/svg%3E") no-repeat center center; box-sizing: border-box; display: block; height: 2.5em; width: 2.5em; padding: 0.75em 0 0.75em 0.75em; position: absolute; right: 0; top: 0; } .corporate-container .mega-menu .close-mega-menu:hover, .corporate-container .mega-menu .close-mega-menu:focus { background-color: #d30f4b; } .sticky-full-width-wrapper { border-bottom: solid 1px rgba(13,42,64,0.2); } .sticky-full-width-wrapper > .outer { display: none; } .sticky header { position: fixed; z-index: 10000; top: 0; left: 0; right: 0; background: #fff; box-shadow: 0 1px 4px rgba(0,0,0,0.2); } .sticky header .bayer-logo { width: 3.5em; } .sticky header .bayer-logo img { width: 2.5em; } .sticky header .bayer-logo .sticky-logo { display: none; } .sticky header .corporate-container { display: none; } .sticky .sticky-full-width-wrapper { border-bottom: none; box-shadow: 0 0.5em 1em rgba(0,0,0,0.5); } .back-to-top { position: fixed; bottom: 0; right: 0; display: block; text-align: center; box-sizing: border-box; border: 0; color: #fff; font-size: 0.75em; letter-spacing: 1px; min-width: 4em; height: 4.2em; padding: 2em 0.2em 0 0; opacity: 0; transition: opacity 0.3s ease 0s, bottom 0.3s ease 0s; text-decoration: none; z-index: 4; transition: background-color 0.3s ease 0s; background: #ff3162 no-repeat 1em 1em; bottom: -4.2em; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='19' height='11' viewBox='0 0 19 11'%3E%3Cpolyline points='0.5,9.5 9.5,0.5 18.5,9.5' style='stroke:%23fff;stroke-width:1.5;fill:none;'/%3E%3C/svg%3E"); } .back-to-top:before { content: ""; display: block; position: absolute; background-color: #ff3162; top: 0; left: -5px; height: 100%; width: 15px; transform: skewX(-10deg); transition: background-color 0.3s ease 0s; } .back-to-top:hover, .back-to-top:focus, .back-to-top:active { text-decoration: none; background-color: #d30f4b; } .back-to-top:hover:before, .back-to-top:focus:before, .back-to-top:active:before { background-color: #d30f4b; } #cms-admin-bar { position: fixed; top: 0; right: 0; z-index: 999; background: #fff; border-radius: 1em; opacity: 0.25; line-height: 1; text-align: right; } #cms-admin-bar i { margin: 0.5em; } #cms-admin-bar p { background: #333; color: #fafafa; font-weight: bold; margin: 0; padding: 0.5em 0.25em; } #cms-admin-bar ul { list-style-type: none; padding: 0; margin: 0; } #cms-admin-bar ul li { padding: 0.25em; border-top: solid 1px #333; } #cms-admin-bar ul li:first-child { border: none; } #cms-admin-bar ul li span { float: right; padding-left: 2em; } #cms-admin-bar > div { display: none; text-align: left; font-size: 0.8em; } #cms-admin-bar:hover { opacity: 1; border-radius: 0; background: #fafafa; box-shadow: 0 0 1em 0.5em #333;} #cms-admin-bar:hover > div { display: block; } /************************************************************************************************** * Medium viewport styles - 768px at default font size */ @media screen and (min-width: 48em) { .corporate-container .mega-menu .business .grid-m > .grid-col:first-child { padding-right: 0.75em; } .corporate-container .mega-menu .business .grid-m > .grid-col:first-child + .grid-col { padding-left: 0.75em; } .corporate-container .mega-menu .websites .grid-m > .grid-col:first-child { padding-right: 0.5em; } .corporate-container .mega-menu .websites .grid-m > .grid-col:first-child + .grid-col { padding-left: 0.5em; } } /************************************************************************************************** * Large viewport styles - 1024px at default font size */ @media screen and (min-width: 64em) { html { font-weight: 300; } header { box-shadow: none; } header .grid .bayer-logo { width: 7.125em; } header .grid .bayer-logo img { width: 4.625em; height: auto; } header .grid .site-name { overflow: hidden; } header .grid .site-name + .grid-col { vertical-align: bottom; } header .site-header .title { font-size: 2em; margin: 0; font-weight: 900; } header .top-nav { background: transparent; font-weight: 300; } header .top-nav .menu { display: table; border-top: none; } header .top-nav .menu > li { display: table-cell; vertical-align: bottom; border-top: none; } header .top-nav .menu-toggle { display: block; width: 100%; height: auto; border-radius: 0; padding: 0.5em 1em; margin: 0; float: none; color: #0d2a40; text-transform: none; } header .top-nav .menu-toggle:after { content: " " !important; width: 1px; height: 1.75em; background-color: #d1e0e7; position: absolute; transform: rotate(12deg); margin-left: 1em;} header .top-nav .menu-toggle:hover, header .top-nav .menu-toggle:focus, header .top-nav .menu-toggle:active { color: #00bcff; } header .top-nav .menu-drop { display: none; position: absolute; z-index: 2; margin-left: 1em; width: 25em; font-size: 0.875em; font-weight: 300; background: transparent; } header .top-nav .menu-drop li { border-top: none; border-bottom: solid 1px rgba(191,215,223,0.25); } header .top-nav .menu-drop li:first-child { margin-top: 1.5em; } header .top-nav .menu-drop > li { overflow: visible; } header .top-nav .menu-drop a { display: block; margin: 0; padding: 0.5em 0; } header .top-nav .menu-drop a:hover { background: rgba(255,255,255,0.2); color: #89d329; } header .top-nav .menu-drop .has-indent > a:after { content: "\f105"; font-family: "Font Awesome 5 Free"; font-weight: 900; font-size: 2em; width: 1em; height: 1em; padding: 0; margin: -0.1em 0 0 0; font-style: normal; float: right; line-height: 1; text-align: center; } header .top-nav .menu-drop .indent-list { position: absolute; z-index: 3; top: 0; margin-left: 25em; width: 25em; padding-left: 2em; background: transparent; } header .top-nav .menu-bg { display: none; position: absolute; z-index: 1; left: 0; right: 0; min-height: 15em; background: #10384f; padding-bottom: 5em; box-sizing: content-box; box-shadow: 0 0.5em 1em #333; } main .left-nav { width: 17em !important; padding: 0 0 5em 1em; } main .left-nav + .grid-col { width: auto; } main .left-nav p { font-weight: 400; font-size: 1.3em; } main .left-nav ul { list-style-type: none; padding: 0; margin: 0; border-top: solid 1px rgba(13,42,64,0.2); } main .left-nav ul li { text-align: left; border-bottom: solid 1px rgba(13,42,64,0.2); overflow: hidden; } main .left-nav ul li a { display: block; text-decoration: none; font-weight: 300; color: #0d2a40; font-size: 0.9375em; padding: 0.6em 0 0.6em 0.6em; float: left; } main .left-nav ul li a:hover, main .left-nav ul li a:focus, main .left-nav ul li a:active { color: #ff3162; } main .left-nav ul li a + button { color: #0d2a40; width: 2em; height: 2em; padding: 0; margin: 0.6em 0 0; font-style: normal; font-weight: normal; float: right; border-radius: 100%; background: transparent; } main .left-nav ul li a + button:hover { background: rgba(13,42,64,0.2); } main .left-nav ul li a + button:after { content: "\f107"; font-family: "Font Awesome 5 Free"; font-weight: 900; font-size: 2em; } main .left-nav ul li a + button.active:after { content: "\f106"; } main .left-nav .indent-list { clear: left; } main .left-nav .indent-list a { padding-left: 1em; } main article .main-heading .login-status { text-align: right; } footer .copyright { margin: 3em auto; padding-top: 1.5em; max-width: 80em; } footer .copyright:before { content: " "; display: block; border-top: 1px solid rgba(255,255,255,0.4); margin: 0 0.8em; } footer .copyright nav { float: right; padding: 0; max-width: none; } footer .copyright nav ul { padding: 0; width: auto; border: none; } footer .copyright nav ul li, footer .copyright nav ul li:first-child { font-size: 0.8em; padding: 0.5em 1em; width: auto !important; } footer .copyright nav ul li:before { content: none; } footer .copyright nav ul li a { white-space: nowrap; opacity: 1; } footer .copyright p { float: left; padding: 0.5em 1em; } .sticky header { z-index: 10000; } .sticky header .grid-col { width: auto; display: table-cell; } .sticky header .bayer-logo { width: 3em; background: #0d3650; } .sticky header .bayer-logo img { display: none; } .sticky header .bayer-logo .sticky-logo { display: block; } .sticky header .site-name { width: 9em; padding-left: 1em; padding-right: 1em; background: #0d3650; position: relative; color: #fff; } .sticky header .site-name:after { content: " "; position: absolute; right: -0.5em; top: 0; height: 3em; width: 1em; transform: skewX(-11deg); background-color: #fff; } .sticky header .site-header { display: none; } .sticky .sticky-full-width-wrapper { z-index: 10000; display: table; width: 100%; table-layout: fixed; max-width: none; } .sticky .sticky-full-width-wrapper .outer { display: table-cell; width: auto; } .sticky .sticky-full-width-wrapper .inner { display: table-cell; width: 80em; } .sticky .sticky-full-width-wrapper .outer:first-child { background: #0d3650; } .corporate-container .inner .grid-col:first-child { padding-right: 2em; background-repeat: no-repeat; background-position: top right -2.5em; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='57' height='50' viewBox='0 0 68 60'%3E%3Cpolygon points='68,60 0,60 11,0 68,0' fill='%23443247' fill-opacity='1'/%3E%3C/svg%3E"); } .corporate-container .inner [class*="-link"]:after { content: "\f107"; font-family: "Font Awesome 5 Free"; font-weight: 900; margin-left: 0.5em; } .corporate-container .inner [class*="-link"].active:after { content: "\f106"; } .corporate-container .mega-menu .business h2 { font-weight: 300; font-size: 1.25em; } .corporate-container .mega-menu .business .grid-l > .grid-col-2:first-child { padding-right: 0.75em; } .corporate-container .mega-menu .business .grid-l > .grid-col-2:first-child + .grid-col-2 { padding-left: 0.75em; padding-right: 0.75em; } .corporate-container .mega-menu .business .grid-l > .grid-col-2:first-child + .grid-col-2 + .grid-col { padding-left: 0.75em; padding-top: 2em; } .corporate-container .mega-menu .locations .countries { width: 25%; } .corporate-container .mega-menu .locations .countries ul { max-height: 30em; } .corporate-container .mega-menu .locations .details { width: 50%; } .corporate-container .mega-menu .locations .details > div { margin-top: 4em; max-height: 30em; } .corporate-container .mega-menu .locations .global-links { width: 25%; padding-top: 4em; } .corporate-container .mega-menu .websites .grid-m > .grid-col:first-child { padding-right: 0; } .corporate-container .mega-menu .websites .grid-m > .grid-col:first-child + .grid-col { padding-left: 0; } .corporate-container .mega-menu .websites .grid-col-2 { padding-right: 0.5em; } .corporate-container .mega-menu .websites .grid-col-2 > .grid-m > .grid-col:first-child { padding-right: 0.5em; } .corporate-container .mega-menu .websites .grid-col-2 > .grid-m > .grid-col:first-child + .grid-col { padding-left: 0.5em; } .corporate-container .mega-menu .websites .grid-col-2 + .grid-col { padding-left: 0.5em; padding-right: 0.5em; } .corporate-container .mega-menu .websites select { margin-top: 0.4em; } .corporate-container .mega-menu .websites .note { padding-top: 0; padding-right: 0; } .corporate-container .mega-menu .websites .search .results li a { display: inline-block; vertical-align: top; width: 18em; margin-right: 2em; } } /************************************************************************************************** * Extra large viewport styles - 1280px at default font size */ @media screen and (min-width: 80em) { .stretch { display: table; width: 100%; table-layout: fixed; max-width: none; } .stretch .outer { display: table-cell; width: auto; } .stretch .inner { display: table-cell; width: 80em; } .corporate-container { max-width: none; } .corporate-container .stretch .inner + .outer { background: #443247; } } /************************************************************************************************** * Print styles */ @media print { .hidden-p { display: none !important; } .grid-p { display: table; table-layout: fixed; width: 100%; } .grid-p > [class*="grid-col"] { display: table-cell; vertical-align: top; width: 8.333%; } .grid-p > .grid-col-2 { width: 16.667%; } .grid-p > .grid-col-3 { width: 25%; } .grid-p > .grid-col-4 { width: 33.333%; } .grid-p > .grid-col-5 { width: 41.667%; } .grid-p > .grid-col-6 { width: 50%; } .grid-p > .grid-col-7 { width: 58.333%; } .grid-p > .grid-col-8 { width: 66.667%; } .grid-p > .grid-col-9 { width: 75%; } .grid-p > .grid-col-10 { width: 83.333%; } .grid-p > .grid-col-11 { width: 91.667%; } footer .copyright p { max-width: none; width: 100%; border-top: solid 1px rgba(13,42,64,0.2); } } /************************************************************************************************** * Workarounds, hacks and fixes */ main { display: block /* IE fix for max-width - TODO this should have been fixed by normalise and/or modernizr? */; }