/**
 * color-theme.css
 * @ GULA Theme
 *
 * Document & Code @copyright by SteckDesign
 * Changes by third parties are not permitted.
 * 
 */
 :root {

     --black: 0,0,0;
     --white: rgb(255,255,255);

    --sitefgcolor:           var( --sbgcolor-20 );
    --sitefgcolor_rgb:       255, 255, 255;
    --sitebgcolor:           var( --sbgcolor-75 );
    --site_link_color:       var( --sitefgcolor );
    --site_linkhover_color:  var( --white );
    --nav_linkcurrent_color: var( --white );
    --nav_bgcolor:           var( --sitebgcolor );
    --title_color:           var( --sbgcolor-15 );
    --selection_color:       var( --brightred );
    --ht_rgb_mediumgreen:    105,142,150; /* Table Background */
    --tablebg:               var( --sitefgcolor_rgb ); /* RGB ! */
    --tc_brightred:          222,53,76;
    --brightred:             #DE354C;

    --sitefgcolor_t005: color-mix(in oklab, var(--sitefgcolor), transparent 99.5% ); 
    --sitefgcolor_t01:  color-mix(in oklab, var(--sitefgcolor), transparent 99% ); 
    --sitefgcolor_t05:  color-mix(in oklab, var(--sitefgcolor), transparent 95% ); 
    --sitefgcolor_t10:  color-mix(in oklab, var(--sitefgcolor), transparent 90% ); 
    --sitefgcolor_t15:  color-mix(in oklab, var(--sitefgcolor), transparent 85% ); 
    --sitefgcolor_t20:  color-mix(in oklab, var(--sitefgcolor), transparent 80% ); 
    --sitefgcolor_t25:  color-mix(in oklab, var(--sitefgcolor), transparent 75% ); 
    --sitefgcolor_t30:  color-mix(in oklab, var(--sitefgcolor), transparent 70% ); 
    --sitefgcolor_t35:  color-mix(in oklab, var(--sitefgcolor), transparent 65% ); 
    --sitefgcolor_t40:  color-mix(in oklab, var(--sitefgcolor), transparent 60% ); 
    --sitefgcolor_t45:  color-mix(in oklab, var(--sitefgcolor), transparent 55% ); 
    --sitefgcolor_t50:  color-mix(in oklab, var(--sitefgcolor), transparent 50% ); 
    --sitefgcolor_t55:  color-mix(in oklab, var(--sitefgcolor), transparent 45% ); 
    --sitefgcolor_t60:  color-mix(in oklab, var(--sitefgcolor), transparent 40% ); 
    --sitefgcolor_t65:  color-mix(in oklab, var(--sitefgcolor), transparent 35% ); 
    --sitefgcolor_t70:  color-mix(in oklab, var(--sitefgcolor), transparent 30% ); 
    --sitefgcolor_t75:  color-mix(in oklab, var(--sitefgcolor), transparent 25% ); 
    --sitefgcolor_t80:  color-mix(in oklab, var(--sitefgcolor), transparent 20% ); 
    --sitefgcolor_t85:  color-mix(in oklab, var(--sitefgcolor), transparent 15% ); 
    --sitefgcolor_t90:  color-mix(in oklab, var(--sitefgcolor), transparent 10% ); 

    --sitebgcolor_t005: color-mix(in oklab, var(--sitebgcolor), transparent 99.5% ); 
    --sitebgcolor_t01:  color-mix(in oklab, var(--sitebgcolor), transparent 99% ); 
    --sitebgcolor_t05:  color-mix(in oklab, var(--sitebgcolor), transparent 95% ); 
    --sitebgcolor_t10:  color-mix(in oklab, var(--sitebgcolor), transparent 90% ); 
    --sitebgcolor_t15:  color-mix(in oklab, var(--sitebgcolor), transparent 85% ); 
    --sitebgcolor_t20:  color-mix(in oklab, var(--sitebgcolor), transparent 80% ); 
    --sitebgcolor_t25:  color-mix(in oklab, var(--sitebgcolor), transparent 75% ); 
    --sitebgcolor_t30:  color-mix(in oklab, var(--sitebgcolor), transparent 70% ); 
    --sitebgcolor_t35:  color-mix(in oklab, var(--sitebgcolor), transparent 65% ); 
    --sitebgcolor_t40:  color-mix(in oklab, var(--sitebgcolor), transparent 60% ); 
    --sitebgcolor_t45:  color-mix(in oklab, var(--sitebgcolor), transparent 55% ); 
    --sitebgcolor_t50:  color-mix(in oklab, var(--sitebgcolor), transparent 50% ); 
    --sitebgcolor_t55:  color-mix(in oklab, var(--sitebgcolor), transparent 45% ); 
    --sitebgcolor_t60:  color-mix(in oklab, var(--sitebgcolor), transparent 40% ); 
    --sitebgcolor_t65:  color-mix(in oklab, var(--sitebgcolor), transparent 35% ); 
    --sitebgcolor_t70:  color-mix(in oklab, var(--sitebgcolor), transparent 30% ); 
    --sitebgcolor_t75:  color-mix(in oklab, var(--sitebgcolor), transparent 25% ); 
    --sitebgcolor_t80:  color-mix(in oklab, var(--sitebgcolor), transparent 20% ); 
    --sitebgcolor_t85:  color-mix(in oklab, var(--sitebgcolor), transparent 15% ); 
    --sitebgcolor_t90:  color-mix(in oklab, var(--sitebgcolor), transparent 10% ); 

    
    --sbgcolor: #747c8b; 
        --sbgcolor-5:   color-mix(in oklab, var(--sbgcolor), white 90% ); 
        --sbgcolor-10:  color-mix(in oklab, var(--sbgcolor), white 80% ); 
        --sbgcolor-15:  color-mix(in oklab, var(--sbgcolor), white 70% );
        --sbgcolor-20:  color-mix(in oklab, var(--sbgcolor), white 60% ); 
        --sbgcolor-25:  color-mix(in oklab, var(--sbgcolor), white 50% );
        --sbgcolor-30:  color-mix(in oklab, var(--sbgcolor), white 40% ); 
        --sbgcolor-35:  color-mix(in oklab, var(--sbgcolor), white 30% );
        --sbgcolor-40:  color-mix(in oklab, var(--sbgcolor), white 20% );
        --sbgcolor-45:  color-mix(in oklab, var(--sbgcolor), white 10% );
        --sbgcolor-50:  var(--sbgcolor);
        --sbgcolor-55:  color-mix(in oklab, var(--sbgcolor), black 7% );
        --sbgcolor-60:  color-mix(in oklab, var(--sbgcolor), black 14% );
        --sbgcolor-65:  color-mix(in oklab, var(--sbgcolor), black 21% );
        --sbgcolor-70:  color-mix(in oklab, var(--sbgcolor), black 28% );
        --sbgcolor-75:  color-mix(in oklab, var(--sbgcolor), black 35% );
        --sbgcolor-80:  color-mix(in oklab, var(--sbgcolor), black 42% );
        --sbgcolor-85:  color-mix(in oklab, var(--sbgcolor), black 49% );
        --sbgcolor-90:  color-mix(in oklab, var(--sbgcolor), black 56% );
        --sbgcolor-95:  color-mix(in oklab, var(--sbgcolor), black 63% );
        --sbgcolor-100: color-mix(in oklab, var(--sbgcolor), black 70% );
    
    --black: #000000; 
        --black-5:   color-mix(in oklab, var(--black), white 95% ); 
        --black-10:  color-mix(in oklab, var(--black), white 90% ); 
        --black-15:  color-mix(in oklab, var(--black), white 85% );
        --black-20:  color-mix(in oklab, var(--black), white 80% ); 
        --black-25:  color-mix(in oklab, var(--black), white 75% );
        --black-30:  color-mix(in oklab, var(--black), white 70% ); 
        --black-35:  color-mix(in oklab, var(--black), white 65% );
        --black-40:  color-mix(in oklab, var(--black), white 60% );
        --black-45:  color-mix(in oklab, var(--black), white 55% );
        --black-50:  color-mix(in oklab, var(--black), white 50% );
        --black-55:  color-mix(in oklab, var(--black), white 45% );
        --black-60:  color-mix(in oklab, var(--black), white 40% );
        --black-65:  color-mix(in oklab, var(--black), white 35% );
        --black-70:  color-mix(in oklab, var(--black), white 30% );
        --black-75:  color-mix(in oklab, var(--black), white 25% );
        --black-80:  color-mix(in oklab, var(--black), white 20% );
        --black-85:  color-mix(in oklab, var(--black), white 15% );
        --black-90:  color-mix(in oklab, var(--black), white 10% );
        --black-95:  color-mix(in oklab, var(--black), white 5% );
        --black-100: color-mix(in oklab, var(--black), white 0% );
}

.theme_sitecolor    { color: var(--sitefgcolor); }
.bg-theme_sitecolor { background-color: var(--sitebgcolor); }
.black, .fg-black   { color: rgba( var(--black), 1.0); }
.white, .fg-white   { color: rgba( var(--white), 1.0); }
.bg-black           { background-color: rgba( var(--black), 1.0); }
.bg-white           { background-color: rgba( var(--white), 1.0); }
.tc-brightred       { color: rgba( var(--tc_brightred), 1.0); }
.bg-tc-brightred    { background-color: rgba( var(--tc_brightred), 1.0); }

.background     { color: var(--sbgcolor); }
.background-5   { color: var(--sbgcolor-5); }
.background-10  { color: var(--sbgcolor-10); }
.background-15  { color: var(--sbgcolor-15); }
.background-20  { color: var(--sbgcolor-20); }
.background-25  { color: var(--sbgcolor-25); }
.background-30  { color: var(--sbgcolor-30); }
.background-35  { color: var(--sbgcolor-35); }
.background-40  { color: var(--sbgcolor-40); }
.background-45  { color: var(--sbgcolor-45); }
.background-50  { color: var(--sbgcolor-50); }
.background-55  { color: var(--sbgcolor-55); }
.background-60  { color: var(--sbgcolor-60); }
.background-65  { color: var(--sbgcolor-65); }
.background-70  { color: var(--sbgcolor-70); }
.background-75  { color: var(--sbgcolor-75); }
.background-80  { color: var(--sbgcolor-80); }
.background-85  { color: var(--sbgcolor-85); }
.background-90  { color: var(--sbgcolor-90); }
.background-95  { color: var(--sbgcolor-95); }
.background-100 { color: var(--sbgcolor-100); }
.bg-background     { background-color: var(--sbgcolor); }
.bg-background-5   { background-color: var(--sbgcolor-5); }
.bg-background-10  { background-color: var(--sbgcolor-10); }
.bg-background-15  { background-color: var(--sbgcolor-15); }
.bg-background-20  { background-color: var(--sbgcolor-20); }
.bg-background-25  { background-color: var(--sbgcolor-25); }
.bg-background-30  { background-color: var(--sbgcolor-30); }
.bg-background-35  { background-color: var(--sbgcolor-35); }
.bg-background-40  { background-color: var(--sbgcolor-40); }
.bg-background-45  { background-color: var(--sbgcolor-45); }
.bg-background-50  { background-color: var(--sbgcolor-50); }
.bg-background-55  { background-color: var(--sbgcolor-55); }
.bg-background-60  { background-color: var(--sbgcolor-60); }
.bg-background-65  { background-color: var(--sbgcolor-65); }
.bg-background-70  { background-color: var(--sbgcolor-70); }
.bg-background-75  { background-color: var(--sbgcolor-75); }
.bg-background-80  { background-color: var(--sbgcolor-80); }
.bg-background-85  { background-color: var(--sbgcolor-85); }
.bg-background-90  { background-color: var(--sbgcolor-90); }
.bg-background-95  { background-color: var(--sbgcolor-95); }
.bg-background-100 { background-color: var(--sbgcolor-100); }

.black     { color: var(--black); }
.black-5   { color: var(--black-5); }
.black-10  { color: var(--black-10); }
.black-15  { color: var(--black-15); }
.black-20  { color: var(--black-20); }
.black-25  { color: var(--black-25); }
.black-30  { color: var(--black-30); }
.black-35  { color: var(--black-35); }
.black-40  { color: var(--black-40); }
.black-45  { color: var(--black-45); }
.black-50  { color: var(--black-50); }
.black-55  { color: var(--black-55); }
.black-60  { color: var(--black-60); }
.black-65  { color: var(--black-65); }
.black-70  { color: var(--black-70); }
.black-75  { color: var(--black-75); }
.black-80  { color: var(--black-80); }
.black-85  { color: var(--black-85); }
.black-90  { color: var(--black-90); }
.black-95  { color: var(--black-95); }
.black-100 { color: var(--black-100); }
.bg-black     { background-color: var(--black); }
.bg-black-5   { background-color: var(--black-5); }
.bg-black-10  { background-color: var(--black-10); }
.bg-black-15  { background-color: var(--black-15); }
.bg-black-20  { background-color: var(--black-20); }
.bg-black-25  { background-color: var(--black-25); }
.bg-black-30  { background-color: var(--black-30); }
.bg-black-35  { background-color: var(--black-35); }
.bg-black-40  { background-color: var(--black-40); }
.bg-black-45  { background-color: var(--black-45); }
.bg-black-50  { background-color: var(--black-50); }
.bg-black-55  { background-color: var(--black-55); }
.bg-black-60  { background-color: var(--black-60); }
.bg-black-65  { background-color: var(--black-65); }
.bg-black-70  { background-color: var(--black-70); }
.bg-black-75  { background-color: var(--black-75); }
.bg-black-80  { background-color: var(--black-80); }
.bg-black-85  { background-color: var(--black-85); }
.bg-black-90  { background-color: var(--black-90); }
.bg-black-95  { background-color: var(--black-95); }
.bg-black-100 { background-color: var(--black-100); }