#user-consent{
    --page-color: #ffffff;
    --text-color: #000000;
    --button-color: #ff6e01;
    --button-text-desktop: 20px;
    --button-text-mobile: 15px;
    --group-border: #ff6e01;
    --group-toggle: #ff6e01;
    --group-providers: #6c757d;
    --group-header-desktop: 20px;
    --group-header-mobile: 18px;
    --group-text-desktop: 16px;
    --group-text-mobile: 14px;
    --text-desktop: 19px;
    --text-mobile: 14px;
    --zindex: 9997;
    --font-family: ;
}
#user-consent { color: var(--text-color); position: fixed; top: 0; z-index: var(--zindex); font-family: var(--font-family); } #user-consent a { color: var(--text-color); font-size: var(--text-desktop); text-decoration: underline; font-family: var(--font-family); } #user-consent .backing { position: fixed; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; z-index: 9998; display: none; } #user-consent .backing.fade { background-color: #000; opacity: 0.65; } #user-consent .backing.blur { -webkit-backdrop-filter: blur(7px); backdrop-filter: blur(7px); background-color: #00000087; } #user-consent .page { position: fixed; padding: 30px; background-color: var(--page-color); z-index: 9999; right: 0; left: 0; bottom: 10px; margin-right: 10px; margin-left: 10px; display: none; border-radius: 10px; } #user-consent .page h2 { color: var(--text-color); font-family: var(--font-family); margin-bottom: 20px; } #user-consent .page .main-container { max-width: 1200px; margin-left: auto; margin-right: auto; position: relative; display: flex; flex-direction: row; align-items: center; gap: 20px; } #user-consent .page .content-container { } #user-consent .page.main .close-consent { position: absolute; top: 10px; right: 10px; cursor: pointer; display: none; color:var(--text-color); font-size: 20px; } #user-consent .secondary { display: none; max-height: 90%; flex-direction: column; } #user-consent .secondary .content-scroll { flex-grow: 1; overflow-x: auto; padding-right: 15px; } #user-consent .secondary .header, #user-consent .secondary .messaging, #user-consent .toggles { max-width: 1000px; margin-left: auto; margin-right: auto; } #user-consent .secondary .messaging { margin-bottom: 35px; } #user-consent .toggle-set .switch, #user-consent .toggle-set h4 { margin: 10px 3px; display: inline-block; font-size: var(--group-header-desktop); font-family: var(--font-family); } #user-consent .messaging { font-size: var(--text-desktop); } #user-consent .messaging p { font-size: var(--text-desktop); font-family: var(--font-family); } #user-consent .controls { text-align: center; } #user-consent button { padding: calc(var(--button-text-desktop) / 2); width: 210px; font-size: var(--button-text-desktop); border: 3px solid var(--button-color); border-radius: 5px; display: unset; cursor: pointer; font-family: var(--font-family); } #user-consent button.solid { background-color: var(--button-color); color: #fff; } #user-consent button.hollow { background-color: Transparent; background-repeat: no-repeat; color: var(--button-color); } #user-consent button.rejectall { display: none; } #user-consent .toggle-set { position: relative; text-align: left; background: #fff; border-radius: 5px; padding: 0 10px 10px; margin-top: 10px; border: solid 1px var(--group-border); } #user-consent .toggle-set p { display: inline-block; margin: 5px 3px; font-size: var(--group-text-desktop); } #user-consent .toggle-set .switch { position: absolute; width: calc(var(--group-header-desktop) * 2); height: var(--group-header-desktop); right: 10px; } #user-consent .toggle-set .switch input { opacity: 0; width: 0; height: 0; } #user-consent .toggle-set .switch:has(input[value=necessary]) { display: none; } .toggle-set .slider { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: #ccc; -webkit-transition: 0.4s; transition: 0.4s; border-radius: 34px; height: var(--group-header-desktop); } #user-consent .toggle-set .slider:after { background-color: transparent; } #user-consent .toggle-set .slider:before { position: absolute; content: ""; height: calc(var(--group-header-desktop) - 4px); width: calc(var(--group-header-desktop) - 4px); left: 2px; bottom: 2px; background-color: var(--text-color); -webkit-transition: 0.4s; transition: 0.4s; border-radius: 50%; } input:checked + .slider { background-color: var(--group-toggle); } input:focus + .slider { box-shadow: 0 0 1px var(--text-color); } input:checked + .slider:before { -webkit-transform: translateX(var(--group-header-desktop)); -ms-transform: translateX(var(--group-header-desktop)); transform: translateX(var(--group-header-desktop)); } #user-consent .partner-section-title { cursor: pointer; margin-bottom: -2px; background: var(--group-providers); padding: 3px 10px; border-radius: 5px; color: #fff; } #user-consent .partner-list { max-height: 0; overflow: hidden; padding: 0; background: #fff; border-radius: 0 0 5px 5px; transition: max-height 0.75s ease-out, padding 1s ease-out; } #user-consent .partner-list.open { transition: max-height 0.75s ease-in, padding 0.25s ease-in; padding: 5px 0 15px 5px; max-height: 300px; } #user-consent .partner .partner-name { display: inline-block; vertical-align: middle; } #user-consent .partner .partner-logo { height: 15px; width: 15px; display: inline-block; margin-left: 10px; vertical-align: middle; } #user-consent .partner .partner-link { display: inline-block; color: var(--text-color); font-size: var(--group-text-desktop); } #user-consent .partner .partner-link-icon { display: inline-block; height: 13px; fill: #27282d; margin-left: 3px; } #user-consent .associated-partner-title { margin-bottom: 0.2em; } .user-consent-footer-link { cursor: pointer; } @media only screen and (max-width: 705px) { #user-consent .page { margin: 10px; padding: 20px; } #user-consent .page h2 { text-align: center; } #user-consent .secondary { bottom: 0; } #user-consent .page .content-container { width: 100%; } #user-consent .page .main-container { flex-direction: column; } #user-consent button { font-size: var(--button-text-mobile); margin-top: 15px; margin-right: 10px; width: 100%; } #user-consent .messaging, #user-consent .messaging p { font-size: var(--text-mobile); } #user-consent .controls { width: 100%; } #user-consent .toggle-set h4 { font-size: var(--group-header-mobile); } #user-consent .toggle-set p { font-size: var(--group-text-mobile); } #user-consent .partner .partner-link { font-size: var(--group-text-mobile); } #user-consent button { padding: calc(var(--button-text-mobile) / 2); } .toggle-set .slider { height: var(--group-header-mobile); } input:checked + .slider:before { -webkit-transform: translateX(var(--group-header-mobile)); -ms-transform: translateX(var(--group-header-mobile)); transform: translateX(var(--group-header-mobile)); } #user-consent .toggle-set .slider:before { height: calc(var(--group-header-mobile) - 4px); width: calc(var(--group-header-mobile) - 4px); } #user-consent .toggle-set .switch { width: calc(var(--group-header-mobile) * 2); } #user-consent a { font-size: var(--text-mobile); } } @media only screen and (min-width: 706px) { #user-consent .main .controls { flex-shrink: 2; } #user-consent .secondary .controls button { margin-right: 15px; } #user-consent .toggle-set, #user-consent button.hollow { margin-top: 15px; } }