:root {
    --html-bg: #1c1c1c;
    --font-fg: #f1f3f4;
    --fg: #BABCBE;

    --search-bg: #161616;
    --search-bg-input: #333333;
    --search-bg-input-border: #3C4043;
    --search-select: #282828;

    --border: #303134;

    --link: #8ab4f8;
    --link-visited: #c58af9;

    --snip-border: #303134;
    --snip-background: #282828;
    --snip-text: #f1f3f4;

    --settings-border: #5f6368;
    --button: #333333;

    --footer-bg: #161616;
    --footer-font: #999da2;

    --highlight: #bcc0c3;

    --blue: #8ab4f8;

    --green: #31b06e;

    --search-button: #BABCBE;
    
    --image-view: #161616;
    --image-view-titlebar: #161616;
    --view-image-color: #000000;
    --image-select: #303030;
    --fff: #fff;

    --publish-info: #7f869e;
    
    color-scheme: dark;
}

.calc-btn:hover {
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);
}

.calc-btn-2:hover {
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);
}

.calc-btn-2 {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
    transition: all 0.3s cubic-bezier(.25, .8, .25, 1);
}

.calc-btn {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
    transition: all 0.3s cubic-bezier(.25, .8, .25, 1);
}

.calc {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
}

.view-image-search {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
    transition: all 0.3s cubic-bezier(.25, .8, .25, 1);
}

.view-image-search:hover {
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);
}