/* default plugin styles */
#ccc #ccc-icon.ccc-icon--no-outline:focus {
    outline: 3px solid #171919;
}

#ccc #ccc-icon.ccc-icon--no-outline:hover #triangle path {
    fill: #171919;
}

#ccc #ccc-icon.ccc-icon--no-outline:focus #triangle path {
    fill: #fd0;
}

#ccc #ccc-icon.ccc-icon--no-outline:focus #star path {
    fill: #171919;
}

#ccc .ccc-notify-button:focus,
#ccc .ccc-content--dark .ccc-button-solid:focus {
    background-color: #171919;
    border-color: #fd0 !important;
    outline: 3px solid transparent;
    -webkit-box-shadow: inset 0 0 0 1px #fd0;
    box-shadow: inset 0 0 0 1px #fd0;
    color: #fff;
}

#ccc .ccc-notify-button:hover,
#ccc .ccc-content--dark .ccc-button-solid:hover {
    background-color: #171919;
}

#ccc .ccc-content--light .ccc-notify-button:hover {
    background-color: #333;
}

#ccc .ccc-content--light .ccc-notify-button:hover span,
#ccc .ccc-content--light .ccc-notify-button:focus span,
#ccc .ccc-content--dark .ccc-notify-button:hover span,
#ccc .ccc-content--dark .ccc-notify-button:focus span,
#ccc .ccc-content--dark .ccc-button-solid:focus span,
#ccc .ccc-content--dark .ccc-button-solid:hover span {
    color: #fff;
    background-color: transparent;
}

#ccc .checkbox-toggle--dark .checkbox-toggle-toggle,
#ccc .checkbox-toggle--light .checkbox-toggle-toggle {
    background-color: #fff !important;
}

#ccc .checkbox-toggle--checkbox,
#ccc .checkbox-toggle {
    right: auto;
    left: 0;
}

#ccc .checkbox-toggle--checkbox label {
    width: 42px !important;
    height: 42px !important;
    margin-bottom: 0;
}

#ccc .checkbox-toggle-input {
    cursor: pointer;
}

#ccc .checkbox-toggle--checkbox.checkbox-toggle--dark {
    border-color: #000 !important;
    border-width: 3px !important;
}

#ccc .checkbox-toggle--dark .checkbox-toggle-toggle {
    background-color: #fff !important;
}

#ccc .checkbox-toggle--checkbox input:checked~.checkbox-toggle-toggle:after {
    left: 16px !important;
    width: 10px !important;
    height: 25px !important; 
    border-color: #000 !important;
}

#ccc .checkbox-toggle--slider:focus-within,
#ccc .checkbox-toggle--checkbox:focus-within {
    background-color: #171919;;
    border-color: #fd0 !important;
    outline: 3px solid transparent;
    -webkit-box-shadow: inset 0 0 0 1px #fd0;
    box-shadow: inset 0 0 0 1px #fd0;
}

#ccc .checkbox-toggle--slider .checkbox-toggle-on,
#ccc .checkbox-toggle--slider .checkbox-toggle-off {
    opacity: 1 !important;
    color: #fff !important;
}

.ccc-link:focus,
#ccc a:focus {
    outline: 3px solid transparent;
    color: #0b0c0c !important;;
    background-color: #fd0;
    -webkit-box-shadow: 0 -2px #fd0,0 4px #0b0c0c;
    box-shadow: 0 -2px #fd0,0 4px #0b0c0c;
    text-decoration: none;
}

#ccc a:focus svg path {
    fill: #0b0c0c;
}

#ccc {
    font-size: inherit !important;
    line-height: inherit !important;
}

#ccc h3.optional-cookie-header {
    padding: .5rem 0 1rem 55px;
}

@media screen and (max-width:768px) {

    #ccc {
        position: absolute !important;
        top: 0 !important;
    }

    #ccc-module,
    #ccc-content,
    .ccc-panel {
        position: relative !important;
    }

    #ccc-content {
        overflow: visible !important;
    }

    #ccc-module.ccc-module--slideout {
        max-width: 100% !important;
        width: 100% !important;
    }
    
    #ccc-content,
    #ccc-title, .ccc-title {
        padding: 0 !important;
    }

    .ccc-panel {
        top: auto !important;
        left: auto !important;
        right: auto !important;
        position: relative;
        padding: 15px;
    }    
}