.cc-window { opacity: 1; transition: opacity 1s ease 0s; } .cc-window.cc-invisible { opacity: 0; } .cc-animate.cc-revoke { transition: transform 1s ease 0s; } .cc-animate.cc-revoke.cc-top { transform: translateY(-2em); } .cc-animate.cc-revoke.cc-bottom { transform: translateY(2em); } .cc-animate.cc-revoke.cc-active.cc-bottom, .cc-animate.cc-revoke.cc-active.cc-top, .cc-revoke:hover { transform: translateY(0px); } .cc-grower { max-height: 0; overflow: hidden; transition: max-height 1s ease 0s; } .cc-link, .cc-revoke:hover { text-decoration: underline; } .cc-revoke, .cc-window { box-sizing: border-box; display: flex; flex-wrap: nowrap; font-family: Helvetica,Calibri,Arial,sans-serif; font-size: 16px; line-height: 1.5em; overflow: hidden; position: fixed; z-index: 9999; } .cc-window.cc-static { position: static; } .cc-window.cc-floating { flex-direction: column; max-width: 24em; padding: 2em; } .cc-window.cc-banner { flex-direction: row; padding: 1em 1.8em; width: 100%; } .cc-revoke { padding: 0.5em; } .cc-header { font-size: 18px; font-weight: 700; } .cc-btn, .cc-close, .cc-link, .cc-revoke { cursor: pointer; } .cc-link { display: inline-block; opacity: 0.8; padding: 0.2em; } .cc-link:hover { opacity: 1; } .cc-link:active, .cc-link:visited { color: initial; } .cc-btn { border-style: solid; border-width: 2px; display: block; font-size: 0.9em; font-weight: 700; padding: 0.4em 0.8em; text-align: center; white-space: nowrap; } .cc-banner .cc-btn:last-child { min-width: 140px; } .cc-highlight .cc-btn:first-child { background-color: transparent; border-color: transparent; } .cc-highlight .cc-btn:first-child:focus, .cc-highlight .cc-btn:first-child:hover { background-color: transparent; text-decoration: underline; } .cc-close { display: block; font-size: 1.6em; line-height: 0.75; opacity: 0.9; position: absolute; right: 0.5em; top: 0.5em; } .cc-close:focus, .cc-close:hover { opacity: 1; } .cc-revoke.cc-top { border-bottom-left-radius: 0.5em; border-bottom-right-radius: 0.5em; left: 3em; top: 0; } .cc-revoke.cc-bottom { border-top-left-radius: 0.5em; border-top-right-radius: 0.5em; bottom: 0; left: 3em; } .cc-revoke.cc-left { left: 3em; right: unset; } .cc-revoke.cc-right { left: unset; right: 3em; } .cc-top { top: 1em; } .cc-left { left: 1em; } .cc-right { right: 1em; } .cc-bottom { bottom: 1em; } .cc-floating > .cc-link { margin-bottom: 1em; } .cc-floating .cc-message { display: block; margin-bottom: 1em; } .cc-window.cc-floating .cc-compliance { flex: 1 1 0; } .cc-window.cc-banner { align-items: center; } .cc-banner.cc-top { left: 0; right: 0; top: 0; } .cc-banner.cc-bottom { bottom: 0; left: 0; right: 0; } .cc-banner .cc-message { flex: 1 1 0; } .cc-compliance { align-content: space-between; align-items: center; display: flex; } .cc-compliance > .cc-btn { flex: 1 1 0; } .cc-btn + .cc-btn { margin-left: 0.5em; } @media print { .cc-revoke, .cc-window { display: none; } } @media screen and (max-width: 900px) { .cc-btn { white-space: normal; } } @media screen and (max-width: 414px) and (orientation: portrait), screen and (max-width: 736px) and (orientation: landscape) { .cc-window.cc-top { top: 0; } .cc-window.cc-bottom { bottom: 0; } .cc-window.cc-banner, .cc-window.cc-left, .cc-window.cc-right { left: 0; right: 0; } .cc-window.cc-banner { flex-direction: column; } .cc-window.cc-banner .cc-compliance { flex: 1 1 0; } .cc-window.cc-floating { max-width: none; } .cc-window .cc-message { margin-bottom: 1em; } .cc-window.cc-banner { align-items: unset; } } .cc-floating.cc-theme-classic { border-radius: 5px; padding: 1.2em; } .cc-floating.cc-type-info.cc-theme-classic .cc-compliance { display: inline; flex: 0 0 auto; text-align: center; } .cc-theme-classic .cc-btn { border-radius: 5px; } .cc-theme-classic .cc-btn:last-child { min-width: 140px; } .cc-floating.cc-type-info.cc-theme-classic .cc-btn { display: inline-block; } .cc-theme-edgeless.cc-window { padding: 0; } .cc-floating.cc-theme-edgeless .cc-message { margin: 2em 2em 1.5em; } .cc-banner.cc-theme-edgeless .cc-btn { height: 100%; margin: 0; padding: 0.8em 1.8em; } .cc-banner.cc-theme-edgeless .cc-message { margin-left: 1em; } .cc-floating.cc-theme-edgeless .cc-btn + .cc-btn { margin-left: 0; }