/**
 * CookiesConsentJS 1.1
 * oxterisk@protonmail.com
 * oxterisk@proton.me
 */

@import url('https://fonts.googleapis.com/css2?family=Open+Sans&display=swap');

.cc-window {
    background-color: var(--windowBg, #fff);
    box-sizing: border-box;
    padding: var(--windowPadding, 24px);
    z-index: 99999;
    border: var(--windowBorder, 0);
    overflow: auto;
    filter: drop-shadow(0px 1px 3px rgba(60,64,67,.3));
}

.cc-window *,
.cc-modal-window * {
    font-family: var(--fontFamily, 'Open Sans',Arial,sans-serif);
}

.cc-window.cc-content-right {
    text-align: right;
}

.cc-window.cc-content-left {
    text-align: left;
}

.cc-window.cc-content-center {
    text-align: center;
}

/* Position */

.cc-window.cc-pos-top,
.cc-window.cc-pos-top-left,
.cc-window.cc-pos-top-right,
.cc-window.cc-pos-bottom,
.cc-window.cc-pos-bottom-left,
.cc-window.cc-pos-bottom-right,
.cc-window.cc-pos-bottom-center,
.cc-window.cc-pos-top-center,
#cc-btn-dismiss {
    position: fixed;
}

.cc-window.cc-pos-top {
    --windowMarginTop: 0;
    top: var(--windowMarginTop);
    left: 0;
    width: 100%;
}

.cc-window.cc-pos-top-center {
    top: var(--windowMarginTop, 24px);
    left:0;
    right:0;
    margin-left: auto;
    margin-right: auto;
}

.cc-window.cc-pos-top-left,
.cc-window.cc-pos-top-right,
.cc-window.cc-pos-bottom-left,
.cc-window.cc-pos-bottom-right,
.cc-window.cc-pos-bottom-center,
.cc-window.cc-pos-top-center {
    border-radius: var(--windowRadius, 24px);
    width: var(--windowWidth, 500px);
}

.cc-window.cc-pos-top-left,
.cc-window.cc-pos-top-right,
#cc-btn-dismiss.cc-pos-top-right,
#cc-btn-dismiss.cc-pos-top-left {
    top: var(--windowMarginTop, 24px);
}

.cc-window.cc-pos-top-left,
#cc-btn-dismiss.cc-pos-top-left {
    left: var(--windowMarginLeft, 48px);
}

.cc-window.cc-pos-top-right,
#cc-btn-dismiss.cc-pos-top-right {
    right: var(--windowMarginRight, 48px);
}

.cc-window.cc-pos-bottom {
    --windowMarginBottom: 0;
    bottom: var(--windowMarginBottom);
    left: 0;
    width: 100%;
}

.cc-window.cc-pos-bottom-center {
    bottom: var(--windowMarginBottom, 24px);
    left:0;
    right:0;
    margin-left: auto;
    margin-right: auto;
}

.cc-window.cc-pos-bottom-left,
.cc-window.cc-pos-bottom-right,
#cc-btn-dismiss.cc-pos-bottom-left,
#cc-btn-dismiss.cc-pos-bottom-right {
    bottom: var(--windowMarginBottom, 24px);
}

.cc-window.cc-pos-bottom-left,
#cc-btn-dismiss.cc-pos-bottom-left {
    left: var(--windowMarginLeft, 48px);
}

.cc-window.cc-pos-bottom-right,
#cc-btn-dismiss.cc-pos-bottom-right {
    right: var(--windowMarginRight, 24px);
}

/* Content */

.cc-window .cc-window-title {
    font-size: var(--titleFontSize, 16px);
    font-weight: var(--titleFontWeight, 600);
    color: var(--titleTextColor, #001D35);
    padding: var(--titlePadding, 24px 24px 0 24px);
    margin-bottom: 1rem;
}

.cc-window .cc-window-message {
    padding: var(--messagePadding, 8px 24px 24px 24px);
    line-height: var(--messageLineHeight, 1.2rem);
}

.cc-window .cc-window-message,
.cc-window .cc-window-message a,
.cc-window .cc-window-message p {
    font-size: var(--messageFontSize, 14px);
    font-weight: var(--messageFontWeight, 400);
    color: var(--messageTextColor, #000);
    line-height: var(--messageLineHeight, 1.2rem);
}
.cc-window .cc-window-message p {
    padding: 0 0 .5rem 0;
}

.cc-window .cc-window-message a,
.cc-window .cc-window-message a:hover,
.cc-window .cc-window-message a:visited {
    color: var(--messageLinkColor, #01579B);
    text-decoration: var(--messageLinkDecoration, underline);
    font-weight: var(--messageLinkFontWeight, 600);
}

/* Settings */

#cc-window-settings .cc-window-settings-header {
    margin-bottom: 2rem;
}

#cc-window-settings .cc-window-settings-footer {
    margin-top: 2rem;
}

#cc-window-settings .cc-window-settings-cookie {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    border-bottom: 2px solid var(--settingsSeparatorColor, #eee);
    gap: 3rem;
    padding: 16px 0;
}

#cc-window-settings .cc-window-settings-cookie .cc-window-settings-cookie-content {
    width: 100%;
}

#cc-window-settings .cc-window-settings-cookie .cc-window-settings-cookie-title {
    font-size: var(--settingsTitleSize, 14px);
    font-weight: var(--settingsTitleWidth, 600);
    margin-bottom: .5rem;
    user-select: none;
}

#cc-window-settings .cc-window-settings-cookie .cc-window-settings-cookie-title-dropdown {
    cursor: pointer;
    display: flex;
    gap: 1rem;
}

#cc-window-settings .cc-window-settings-cookie .cc-window-settings-cookie-desc {
    width: 100%;
}

#cc-window-settings .cc-window-settings-cookie .cc-window-settings-cookie-desc * {
    font-size: var(--settingsFontSize, 14px);
}

#cc-window-settings .cc-window-settings-cookie .cc-window-settings-cookie-desc p {
    margin-bottom: .5rem;
}

/* Buttons */

.cc-window .cc-window-buttons,
.cc-modal-window .cc-window-settings-buttons {
    text-align: var(--buttonsAlign, right);
    padding: var(--buttonsPadding, 0 16px 16px 0);
}

.cc-window .cc-window-buttons button,
.cc-modal-window .cc-window-settings-buttons button {
    display: initial !important;
    font-size: var(--btnFontSize, 14px);
    font-weight: var(--btnFontWeight, 600);
    margin: var(--btnMargin, 24px 2px 0 2px);
    padding: var(--btnPadding, 6px 12px);
    border-radius: var(--btnRadius, 50px);
    cursor: pointer;
    outline: none;
    letter-spacing: 0.010714em;
}

.cc-window .cc-window-buttons button.cc-btn-accept {
    background-color: var(--btnAcceptBg, #388E3C);
    color: var(--btnAcceptTextColor, #ffffff);
    border: var(--btnAcceptBorder, 0);
}

.cc-window .cc-window-buttons button.cc-btn-accept:hover {
    background-color: var(--btnAcceptBgHover, #1B5E20);
}

.cc-window .cc-window-buttons button.cc-btn-reject {
    background-color: var(--btnRejectBg, transparent);
    color: var(--btnRejectTextColor, #C62828);
    border: var(--btnRejectBorder, 0);
}

.cc-window .cc-window-buttons button.cc-btn-reject:hover {
    background-color: var(--btnRejectBgHover, #FFEBEE);
}

.cc-window .cc-window-buttons button.cc-btn-info {
    background-color: var(--btnInfoBg, transparent);
    color: var(--btnInfoTextColor, #424242);
    border: var(--btnInfoBorder, 0);
}

.cc-window .cc-window-buttons button.cc-btn-info:hover {
    background-color: var(--btnInfoBgHover, #E0E0E0);
}

.cc-window .cc-window-buttons button.cc-btn-settings {
    background-color: var(--btnSettingsBg, #9E9E9E);
    color: var(--btnSettingsTextColor, #ffffff);
    border: var(--btnSettingsBorder, 0);
}

.cc-window .cc-window-buttons button.cc-btn-settings:hover {
    background-color: var(--btnSettingsBgHover, #424242);
}

.cc-window-settings-buttons button.cc-btn-settings-select {
    background-color: var(--btnSettingsSelectBg, transparent);
    color: var(--btnSettingsSelectTextColor, #424242);
    border: var(--btnSettingsSelectBorder, 0);
}

.cc-window-settings-buttons button.cc-btn-settings-select:hover {
    background-color: var(--btnSettingsSelectBgHover, #E0E0E0);
}

.cc-window-settings-buttons button.cc-btn-settings-accept {
    background-color: var(--btnSettingsAcceptBg, #388E3C);
    color: var(--btnSettingsAcceptTextColor, #ffffff);
    border: var(--btnSettingsAcceptBorder, 0);
}

.cc-window-settings-buttons button.cc-btn-settings-accept:hover {
    background-color: var(--btnSettingsAcceptBgHover, #1B5E20);
}

#cc-btn-dismiss {
    font-family: var(--fontFamily, 'Open Sans',Arial,sans-serif);
    background-color: var(--btnDismissBg, #ddd);
    color: var(--btnDismissTextColor, #000);
    border: var(--btnDismissBorder, 0);
    font-size: var(--btnDismissFontSize, 14px);
    font-weight: var(--btnDismissFontWeight, 400);
    margin: 2rem .3rem 0 .3rem;
    padding: var(--btnDismissPadding, 12px 16px);
    border-radius: var(--btnDismissRadius, 24px);
    cursor: pointer;
    outline: none;
    z-index: 99999;
    filter: drop-shadow(0px 1px 3px rgba(60,64,67,.3));
    opacity: .5;
}

#cc-btn-dismiss:hover {
    opacity: 1;
}

/* Modal https://www.w3schools.com/howto/howto_css_modals.asp */

/* The Modal (background) */
.cc-modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 99999; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content/Box */
.cc-modal-window {
    background-color: var(--popupBg, #fff);
    color: var(--popupTextColor, #333);
    margin: 10vh auto; /* 15% from the top and centered */
    border: var(--windowBorder, 0);
    filter: drop-shadow(0px 1px 3px rgba(60,64,67,.3));
    /*width: 80%;*/
    width: var(--popupWidth, 600px);
    border-radius: var(--popupRadius, 24px);
    padding: var(--windowPadding, 24px);
}

.cc-modal-content {
    color: var(--popupTextColor, #001D35);
    padding: var(--titlePadding, 0 24px 24px 24px);
    font-size: var(--messageFontSize, 14px);
    font-weight: var(--messageFontWeight, 400);
    line-height: var(--messageLineHeight, 1.2rem);
    margin-top: 24px;
    margin-bottom: 24px
}



.cc-modal-window .cc-modal-content h2 {
    font-size: var(--titleFontSize, 16px);
    font-weight: var(--titleFontWeight, 600);
    color: var(--titleTextColor, #001D35);
    margin-bottom: 1rem;
}

.cc-modal-window .cc-modal-content p {
    padding: 0 0 .5rem 0;
    font-size: var(--messageFontSize, 14px);
    line-height: var(--messageLineHeight, 1.2rem);
}

/* Switch https://www.w3schools.com/howto/howto_css_switch.asp */
.cc-modal-window .cc-modal-content .switch {
    position: relative;
    display: inline-block;
    width: 44px;
    height: 26px;
}

.cc-modal-window .cc-modal-content .switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.cc-modal-window .cc-modal-content .slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #C62828;
    -webkit-transition: .4s;
    transition: .4s;
}

.cc-modal-window .cc-modal-content .slider:before {
    position: absolute;
    content: "";
    height: 18px;
    width: 18px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
}

.cc-modal-window .cc-modal-content input:checked+.slider {
    background-color: #1b5e20;
}

.cc-modal-window .cc-modal-content input:disabled+.slider {
    background-color: #ccc;
}

.cc-modal-window .cc-modal-content input:checked+.slider:before {
    -webkit-transform: translateX(18px);
    -ms-transform: translateX(18px);
    transform: translateX(18px);
}

.cc-modal-window .cc-modal-content .slider.round {
    border-radius: 34px;
}

.cc-modal-window .cc-modal-content .slider.round:before {
    border-radius: 50%;
}

/* The Close Button */
.cc-modal-close {
    color: var(--btnCloseColor, #aaa);
    padding: 0 12px 12px 0;
    text-align: right;
    font-size: 22px;
    font-weight: bold;
}

.cc-modal-close:hover,
.cc-modal-close:focus {
    color: var(--btnCloseColorHover, #000);
    text-decoration: none;
    cursor: pointer;
}

@media screen and (max-width: 768px) {
    .cc-window.cc-pos-top-left,
    .cc-window.cc-pos-top-right,
    .cc-window.cc-pos-bottom-left,
    .cc-window.cc-pos-bottom-right,
    .cc-window.cc-pos-bottom-center,
    .cc-window.cc-pos-top-center {
        width: 100%;
        min-width: 100%;
        left: 0;
        right: 0;
        border-radius: 0;
    }
    .cc-window.cc-pos-top-left,
    .cc-window.cc-pos-top-right,
    .cc-window.cc-pos-top-center {
        top: 0;
        --windowMarginTop: 0;
    }
    .cc-window.cc-pos-bottom-left,
    .cc-window.cc-pos-bottom-right,
    .cc-window.cc-pos-bottom-center {
        bottom: 0;
        --windowMarginBottom: 0;
    }
    .cc-modal-window {
        margin: 0;
        padding: 0;
        width: 100%;
        border-radius: 0;
    }
}

/* Animations */

@keyframes cc-window-animation-in-top {
    from { top: -80vh; visibility: visible; }
    to { top: var(--windowMarginTop, 24px); visibility: visible; }
}

@keyframes cc-window-animation-out-top {
    from { top: var(--windowMarginTop, 24px); }
    to { top: -120vh; }
}

@keyframes cc-window-animation-in-bottom {
    from { bottom: -80vh; visibility: visible; }
    to { bottom: var(--windowMarginBottom, 24px); visibility: visible; }
}

@keyframes cc-window-animation-out-bottom {
    from { bottom: var(--windowMarginBottom, 24px); }
    to { bottom: -120vh; }
}

.cc-window.cc-animation-in.cc-pos-top,
.cc-window.cc-animation-in.cc-pos-top-left,
.cc-window.cc-animation-in.cc-pos-top-right,
.cc-window.cc-animation-in.cc-pos-top-center {
    animation-name: cc-window-animation-in-top;
    visibility: hidden;
    animation-duration: var(--animationDuration, 1s);
    animation-delay: var(--animationDelay, .1s);
    animation-timing-function: ease-out;
    animation-fill-mode: forwards;
}

.cc-window.cc-animation-out.cc-pos-top,
.cc-window.cc-animation-out.cc-pos-top-left,
.cc-window.cc-animation-out.cc-pos-top-right,
.cc-window.cc-animation-out.cc-pos-top-center {
    animation-name: cc-window-animation-out-top;
    animation-duration: var(--animationDuration, 1s);
    animation-timing-function: ease-out;
    animation-fill-mode: forwards;
}

.cc-window.cc-animation-in.cc-pos-bottom,
.cc-window.cc-animation-in.cc-pos-bottom-left,
.cc-window.cc-animation-in.cc-pos-bottom-right,
.cc-window.cc-animation-in.cc-pos-bottom-center {
    animation-name: cc-window-animation-in-bottom;
    visibility: hidden;
    animation-duration: var(--animationDuration, 1s);
    animation-delay: var(--animationDelay, .1s);
    animation-timing-function: ease-out;
    animation-fill-mode: forwards;
}

.cc-window.cc-animation-out.cc-pos-bottom,
.cc-window.cc-animation-out.cc-pos-bottom-left,
.cc-window.cc-animation-out.cc-pos-bottom-right,
.cc-window.cc-animation-out.cc-pos-bottom-center {
    animation-name: cc-window-animation-out-bottom;
    animation-duration: var(--animationDuration, 1s);
    animation-timing-function: ease-out;
    animation-fill-mode: forwards;
}
