:root {
    /*SPECIFIC*/
    /*borders*/
    --border-thin-color-light: 0.5vw solid var(--color-light);
    --border-thinner-color-light: 0.25vw solid var(--color-light);
    --border-thinner-color-dark: 0.25vw solid var(--color-dark);
    --border-thinnest-color-dark-dotted: 0.125vw dotted var(--color-dark);
    /*background*/
    --background-color-footer: var(--color-dark);
    --color-bg-quotation: var(--color-neutral-light);
    --color-bg-quote-attribution: var(--color-neutral-dark);
    /*images*/
    --img-gosafer-logo: url(~/resources/logo11-nobackground-obj-to-path.svg);
    /*--img-communitygroup: url(/graphics/teapot.png);*/
    --img-watch: url(/graphics/avcamera.png);
    --img-read: url(/graphics/book.png);
    --img-listen: url(/graphics/headphones.png);
    --img-links: url(/graphics/links.png);
    /*--img-grey-waves: var(url(/images/covid.jpg));*/
    --img-instalogo: url(/images/glyph-logo_May2016.png);
    --img-twitterlogo: url(/images/Twitter_Logo_WhiteOnBlue.png);
    --background-image: url(/images/RipplesTileFaintPoster75pcOpacity.png);
    /*--background-image-url-address-default: var(--img-grey-waves);*/
    /*header*/
    --logobox-bgcolor: black;
    --hdr-bgcolor: #ecb40e;
    --schbox-bgcolor: #ffe599;
    --schbox-color: #522f0c;
    /*footer*/
    --ftr-bgcolor: #ecb40e;
    --ftr-lnk-color: rgb(95,52,8);
    --ftr-lnk-emph-color: black;
    /*html anchors*/
    --color-lnk: blue;
    --color-lnk-capt: var(--color-lnk);
    --color-lnk-capt-contrast: var(--color-light);
    /*home page*/
    /*--hmpg-bg-img: url(/images/Cropped_Cat_and_Kitten_3.jpg);*/
    --hmpg-bg-img: url(/images/cat_and_kitten_background_image.svg);
    --hmpg-secap-color: white;
    --hmpg-sescap-color: white;
    --hmpg-btn-bgcolor: #965a1a;
    /*dropdown*/
    /*headline marquee*/
    --hdl-color: white;
    --hdl-bgcolor: rgb(66,41,13);
    /*message*/
    --fadeable-msg-color: white;
    /*topics*/
    --topic-cap-color: var(--color-dark);
    --topic-cap-emp-color: rgb(188, 188, 188);
    --topic-lnk-added-cap: var(--topic-cap-color);
    --topics-msg-bg-color: rgb(168,168,168);
    /*help section*/
    --help-pnl-color: #5f3408;
    --help-pnl-bgcolor: #f9e8b6;
    --help-item-color: rgb(11 83 148);
    /*collection dropdown*/
    --drdwn-pnl-bgcolor: rgb(249,232,182);
    --drdwn-category-color: rgb(116, 88, 60);
    --drdwn-category-bgcolor: rgb(249,232,182);
    --drdwn-item-color: rgb(116, 88, 60);
    --drdwn-item-emph-color: black;
    --drdwn-item-bgcolor: rgb(249,232,182);
    /*why panel*/
    --why-pnl-color: #5f3408;
    --why-pnl-bgcolor: #f9e8b6;
    /*text separator styles*/
    --h1-color: var(--color-dark);
    --h2-color: var(--color-dark);
    --h4-color: var(--color-dark);
    /*GENERAL*/
    /*background*/
    --gen-bg-img: none;
    --gen-bgcolor: rgb(150, 90, 26);
    /*anchor*/
    --color-lnk: var(--color-dark);
    /*table*/
    --th-bgcolor: rgb(150, 90, 26);
    /*COLORS*/
    /*corporate yellow theme*/
    --color-corp-strong: rgb(66,41,13);
    --color-corp-weak: rgb(255,229,153);
    --color-corp-weak-03opac: rgba(255,229,153,0.3);
    --color-corp-weak-06opac: rgba(255,229,153,0.6);
    --color-corp-weak-07opac: rgba(255,229,153,0.7);
    --color-corp-weak-08opac: rgba(255,229,153,0.8);
    --color-corp-strong-06opac: rgb(66,41,13, 0.6);
    /***/
    --color-blueprint-dark: rgb(19,15,89);
    --color-blueprint-darker-op07: rgba(12,75,119, 0.7);
    --color-cap: var(--color-dark);
    --color-reversed-out: white;
    --color-bright: #ccffff;
    --color-lightest: white;
    --color-light: lightblue;
    --color-neutral-light: lightgray;
    --color-neutral-dark: darkgray;
    --color-neutral-darker: #4A545B;
    --color-neutral-darkest: #424b51;
    --color-dark: rgb(65, 40, 8);
    --color-dark-half-faded: var(--color-dark);
    --color-dark-faded: rgb(146, 127, 108);
    --color-darker: #025668;
    --color-green: #43B592;
    --color-bright: rgb(253,191,9);
    --color-bright-faded: rgb(254,235,181);
    --color-contrast-bright: red;
    --color-darkest: black;
    --color-bdy-text: rgb(65, 40, 8);
    --body-ftr-rpt-color: var(--color-dark);
    --body-ftr-rpt-bg-color: var(--color-neutral-light);
    --color-pg-title: white;
    --color-external-lnk-trg: white;
    --color-bg-external-lnk-trg: rgb(236, 180, 14);
    --color-stark: black;
    --color-stark-reverse: white;
    --color-strong: rgb(66,41,13);
    --color-string-alt: rgb(6,23,168);
    --color-neutral: gray;
    --color-weak: lightblue;
    --color-alarm: red;
}

* {
    box-sizing: border-box;
}

body {
    /*background-color: var(--color-neutral-light);*/
    background-image: var(--background-image);
}

/*#article-fpg {
    background-image: url(/images/cat_and_kitten_background_image.svg);
    background-size: cover;
}*/

/*.home-page-body {
    background-image: var(--hmpg-bg-img);
    background-size: cover;
}
*/
/*#article-fpg::before {
    content: "";
    opacity: 0.75;
}
*/

#article-fpg {
    background-image: var(--hmpg-bg-img);
    background-size: cover;
    /*margin-top: -5vw;*/
}

/*#idn-helpme, #idn-helpme-sub {
    margin-top: 2vw;
    background-color: var(--color-alarm);
    color: var(--color-lightest);*/
    /*background-color: rgb(2, 87, 154);*/
    /*font: var(--font-fpg-level-01);
    letter-spacing: 0.5px;
}*/

#idn-helpme, #idn-helpme-sub {
    margin-top: 2vw;
    /*background-color: rgb(2, 87, 154);*/
    letter-spacing: 0.5px;
}

#idn-tell-me {
    display: inline-block;
    margin-top: calc(var(--height-small));
    background-color: var(--color-img-cat-dblue);
    font: var(--font-fpg-level-01);
    letter-spacing: 1px;
}

.dash {
    background-color: var(--color-img-cat-dblue);
    border: var(--border-thinner-color-dark);
    border-radius: 0.75vw 0 0 0.75vw;
    
}

.vspc {
    margin-top: 5vw;
    margin-bottom: 5vw;
}

.vspc-half {
    margin-top: 2.5vw;
    margin-bottom: 2.5vw;
}

.txt-dec-ul {
    background-color: var(--color-img-cat-dblue);
}


/*.faux-list-front-pg {
    background-color: var(--color-img-cat-dblue);
}*/
.emoticon-link {
    background-color: var(--color-img-cat-dblue);
    font: var(--font-level-03);
}

/*.home-page-section {
    background-color: rgb(2, 87, 154);
}

.sub-capt {
    background-color: rgb(2, 87, 154);
}
*/    
/*#emoticon-wrapper {
    margin-left: 0px;
    background-color: rgb(66,41,13);
    width: 43%;
}*/

/*From Uiverse.io by SelfMadeSystem*/ 
.frutiger-button {
    cursor: pointer;
    position: relative;
    padding: 2px;
    border-radius: 6px;
    border: 0;
    text-shadow: 1px 1px #000a;
    background: linear-gradient(#006caa, #00c3ff);
    /*top border*/
    /*background: linear-gradient(red, #00c3ff);*/
    box-shadow: 0px 4px 6px 0px #0008;
    transition: 0.3s all;
}

.frutiger-button:hover {
    /*box-shadow: 0px 6px 12px 0px #0009;*/
    box-shadow: 0px 6px 12px 0px red;
}

.frutiger-button:active {
    box-shadow: 0px 0px 0px 0px #0000;
}

.inner {
    position: relative;
    inset: 0px;
    /*padding: 1em;*/
    border-radius: 4px;
    /*                                                turquoise                                    dark green dark turq*/
    /*background: radial-gradient(circle at 50% 100%, #30f8f8 10%, #30f8f800 55%), linear-gradient(#00526a, #009dcd);*/
    background: radial-gradient(circle at 50% 100%, #ffb2b2 10%, #ffb2b200 55%), linear-gradient(#660000, red);
    overflow: hidden;
    transition: inherit;
}

.inner::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(-65deg, #0000 40%, #fff7 50%, #0000 70%);
    background-size: 200% 100%;
    background-repeat: no-repeat;
    /*animation: thing 3s ease infinite;*/
    animation: thing 3.75s ease infinite;
}

@keyframes thing {
    0% {
        background-position: 130%;
        opacity: 1;
    }

    to {
        background-position: -166%;
        opacity: 0;
    }
}

.top-white {
    position: absolute;
    border-radius: inherit;
    inset: 0 -8em;
    /*background: radial-gradient( circle at 50% -270%, #fff 45%, #fff6 60%, #fff0 60% );*/
    background: radial-gradient( circle at 50% -270%, deeppink 45%, #fff6 60%, #fff0 60% );
    transition: inherit;
}

.inner::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    transition: inherit;
    box-shadow: inset 0px 2px 8px -2px #0000;
}

.frutiger-button:active .inner::after {
    box-shadow: inset 0px 2px 8px -2px #000a;
}

.text {
    position: relative;
    z-index: 1;
    color: white;
    /*font-weight: 550;*/
    font: var(--font-fpg-level-01);
    transition: inherit;
}