html[zontal-theme="dark"] {
    --zon-body-bg-color: #242222;
    --zon-body-bg: #1d1d1d;
    --zon-common-text-color: #dcdcdc;
    --zon-theme-color: #ff3814;
    --zon-div-color: #999;
    --zon-muted-color: #777;
    --zon-more-button-bg-color: #222;
    --zon-search-bg-color: rgb(255 255 255 / 8%);
    --zon-search-hover-color: #333;
    --zon-gmeta-bg-color: #222;
    --zon-border-color: #5a5a5a;
    --zon-overlay-bg-color: #000000af;
    --zon-cursor-color: #ff7b00;
    --zon-toggler-bg-color: #222;
    --zon-icon-color: #fff;
    --zon-dark-logo: block;
    --zon-light-logo: none;
    --zon-sidebar-shadow: 0px 0px 40px 0px #000;
    --zon-card-shadow: 0px 3px 10px #44444496;
    --zon-blog-social-button-bg-hover-color: #222;
    --zon-comment-input-b-color: #222;
}

html[zontal-theme="light"] {
    --zon-body-bg-color: #fff;
    --zon-body-bg: #f8f7f5;
    --zon-heading-color: #252a34;
    --zon-common-text-color: #6c6c6c;
    --zon-theme-color: #2563eb;
    --zon-div-color: #999;
    --zon-muted-color: #777;
    --zon-more-button-bg-color: #3b82f6;
    --zon-search-bg-color: #f4f4f4;
    --zon-search-hover-color: #3b82f6;
    --zon-gmeta-bg-color: #dcdcdc81;
    --zon-border-color: #dbdada;
    --zon-overlay-bg-color: #000000c5;
    --zon-cursor-color: #3b82f6;
    --zon-toggler-bg-color: #dcdcdc;
    --zon-icon-color: #111;
    --zon-dark-logo: none;
    --zon-light-logo: block;
    --zon-sidebar-shadow: 0px 0px 40px 0px #111;
    --zon-card-shadow: 0px 3px 10px #0000000A;
    --zon-blog-social-button-bg-hover-color: #dcdcdc;
    --zon-comment-input-b-color: #dcdcdc;
}

@font-face {
    font-family: "Fredoka";
    src: url("../fonts/Fredoka-Medium.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "Fredoka";
    src: url("../fonts/Fredoka-Regular.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "Fredoka";
    src: url("../fonts/Fredoka-SemiBold.ttf") format("truetype");
    font-weight: bold;
    font-style: normal;
}