/* TRANSITIONS */
.popout-button, .popout-switch { -webkit-transition: background 0.2s ease, color 0.2s ease, opacity 0.2s ease, border 0.2s ease;-moz-transition: background 0.2s ease, color 0.2s ease, opacity 0.2s ease, border 0.2s ease;-ms-transition: background 0.2s ease, color 0.2s ease, opacity 0.2s ease, border 0.2s ease;-o-transition: background 0.2s ease, color 0.2s ease, opacity 0.2s ease, border 0.2s ease;transition: background 0.2s ease, color 0.2s ease, opacity 0.2s ease, border 0.2s ease; }
.popout-switch .popout-options:after { -webkit-transition: transform 0.2s ease;-moz-transition: transform 0.2s ease;-ms-transition: transform 0.2s ease;-o-transition: transform 0.2s ease;transition: transform 0.2s ease; }
#popout .popout-outer { -webkit-transition: transform 0.4s ease;-moz-transition: transform 0.4s ease;-ms-transition: transform 0.4s ease;-o-transition: transform 0.4s ease;transition: transform 0.4s ease; }
#popout .popout-blocker { -webkit-transition: opacity 0.4s ease;-moz-transition: opacity 0.4s ease;-ms-transition: opacity 0.4s ease;-o-transition: opacity 0.4s ease;transition: opacity 0.4s ease; }

/* POPOUT TRIGGER */
#popout-trigger { position: fixed; left: 15px; bottom: 15px; z-index: 2000; pointer-events: none; }
#popout-trigger .popout-trigger-button { padding: 0; background: #ffffff; pointer-events: auto; width: 48px; height: 48px; border: 0; display: flex; align-items: center; justify-content: center; border-radius: 50%; color: #0e5070; box-shadow: 0 0 10px rgba(0,0,0,0.2); }
#popout-trigger .popout-trigger-button:hover, #popout-trigger .popout-trigger-button:focus { color: #0e5070; }
@media (max-width: 750px) {
    #popout-trigger { left: 5px; bottom: 5px; }
    #popout-trigger .popout-trigger-button { width: 40px; height: 40px; }
    #popout-trigger .popout-trigger-button svg { width: 22px; height: 22px; }
}

/* POPOUT */
#popout { position: fixed; top: 0; bottom: 0; left: 0; right: 0; z-index: 3000; display: none; }
#popout .popout-blocker { position: absolute; top: 0; bottom: 0; left: 0; right: 0; background: #000000; opacity: 0; }
#popout.open .popout-blocker { opacity: 0.8; }
#popout .popout-outer { position: absolute; top: 0; left: 0; bottom: 0; width: 500px; max-width: calc(100% - 30px); max-height: 100%; overflow: auto; background: #ffffff; -webkit-transform: translate3d(-100%,0,0);-moz-transform: translate3d(-100%,0,0);-ms-transform: translate3d(-100%,0,0);-o-transform: translate3d(-100%,0,0);transform: translate3d(-100%,0,0); }
#popout.open .popout-outer { -webkit-transform: translate3d(0,0,0);-moz-transform: translate3d(0,0,0);-ms-transform: translate3d(0,0,0);-o-transform: translate3d(0,0,0);transform: translate3d(0,0,0); }
#popout .popout-inner { padding: 60px 30px; }
#popout .popout-section:nth-of-type(n+2) { margin-top: 24px; padding-top: 24px; border-top: 1px solid #cccccc; }
@media (max-width: 750px) {
    #popout .popout-inner { padding: 40px 15px 60px; }
}

/* POPOUT BUTTON */
.popout-buttons { margin: 32px -4px -4px; }
.popout-button { margin: 4px; border-radius: 0; border: 0; font-size: 14px; color: #ffffff; background: #0e5070; text-transform: uppercase; display: inline-block; box-sizing: border-box; cursor: pointer; padding: 8px 12px; }
@media (max-width: 750px) {
    .popout-button { font-size: 14px; padding: 8px 12px; }
}

/* POPOUT SWITCH */
.popout-switch { margin-top: 32px; width: 180px;  background: #666666; border-radius: 5px; -webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none; }
.popout-switch:focus, .popout-switch:focus-within { background: #0e5070; }
.popout-switch .popout-options { font-size: 14px; line-height: 28px; text-transform: uppercase; font-weight: 700; padding: 8px 0; color: #ffffff; display: flex; width: 100%; position: relative; cursor: pointer; }
.popout-switch .popout-options:after { content: ''; position: absolute; top: 3px; bottom: 3px; left: 3px; width: calc(50% - 3px); background: #cccccc; border-radius: 5px; pointer-events: none; -webkit-transform: translate3d(0,0,0);-moz-transform: translate3d(0,0,0);-ms-transform: translate3d(0,0,0);-o-transform: translate3d(0,0,0);transform: translate3d(0,0,0); }
[data-analytics_storage="granted"] .popout-switch.popout-switch-analytics_storage .popout-options:after { -webkit-transform: translate3d(100%,0,0);-moz-transform: translate3d(100%,0,0);-ms-transform: translate3d(100%,0,0);-o-transform: translate3d(100%,0,0);transform: translate3d(100%,0,0); }
[data-ad_storage="granted"] .popout-switch.popout-switch-ad_storage .popout-options:after { -webkit-transform: translate3d(100%,0,0);-moz-transform: translate3d(100%,0,0);-ms-transform: translate3d(100%,0,0);-o-transform: translate3d(100%,0,0);transform: translate3d(100%,0,0); }
[data-ad_user_data="granted"] .popout-switch.popout-switch-ad_user_data .popout-options:after { -webkit-transform: translate3d(100%,0,0);-moz-transform: translate3d(100%,0,0);-ms-transform: translate3d(100%,0,0);-o-transform: translate3d(100%,0,0);transform: translate3d(100%,0,0); }
[data-ad_personalization="granted"] .popout-switch.popout-switch-ad_personalization .popout-options:after { -webkit-transform: translate3d(100%,0,0);-moz-transform: translate3d(100%,0,0);-ms-transform: translate3d(100%,0,0);-o-transform: translate3d(100%,0,0);transform: translate3d(100%,0,0); }
[data-personalization_storage="granted"] .popout-switch.popout-switch-personalization_storage .popout-options:after { -webkit-transform: translate3d(100%,0,0);-moz-transform: translate3d(100%,0,0);-ms-transform: translate3d(100%,0,0);-o-transform: translate3d(100%,0,0);transform: translate3d(100%,0,0); }
[data-functionality_storage="granted"] .popout-switch.popout-switch-functionality_storage .popout-options:after { -webkit-transform: translate3d(100%,0,0);-moz-transform: translate3d(100%,0,0);-ms-transform: translate3d(100%,0,0);-o-transform: translate3d(100%,0,0);transform: translate3d(100%,0,0); }
[data-security_storage="granted"] .popout-switch.popout-switch-security_storage .popout-options:after { -webkit-transform: translate3d(100%,0,0);-moz-transform: translate3d(100%,0,0);-ms-transform: translate3d(100%,0,0);-o-transform: translate3d(100%,0,0);transform: translate3d(100%,0,0); }
.popout-switch .popout-options .popout-option { width: 50%; text-align: center; }
.popout-toggle-input { position: absolute;opacity: 0;width: 100%;height: 100%; }
@media (max-width: 750px) {
    .popout-switch { width: 150px; }
    .popout-switch .popout-options { min-width: 1px; font-size: 14px; line-height: 24px; }
}

/* ACCESSIBILITY */
#popout .visuallyhidden { border: 0; clip: rect(0 0 0 0); -webkit-clip-path: inset(50%); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; white-space: nowrap; color: #000000; }

/* MISC */
#popout h4 { margin-top: 0; }