
/* 
    - Globale Gültigkeit -
    Definition aller verwendeten Farben.
*/

:root
{
/*
    --main-text-color: #666;
    --main-bg-color: #ececec;
    --main-outer-color: rgb(222,224,224);
    --main-container-color: rgb(255, 255, 255);
*/
    --outer-bg-color: rgb(222,224,224);

    --inner-bg-color: rgb(255, 255, 255);
    --inner-text-color: rgb(88, 88, 88);
    --inner-border-color: rgb(206, 206, 206);
    --inner-link-color: rgb(37, 131, 115);
    --inner-link-decoration: none;

    --color-green:rgb(55, 167, 148);
    --color-green-text:white;
    --color-green-link:white;
    --color-green-border:rgb(46, 139, 124);

    --color-coral:rgb(10, 118, 126);
    --color-coral-text:white;
    --color-coral-link:white;
    --color-coral-border:rgb(7, 94, 100);

    --color-blue:rgb(55, 113, 167);
    --color-blue-text:white;
    --color-blue-link:white;
    --color-blue-border:rgb(47, 95, 141);

    --color-red:rgb(226, 55, 25);
    --color-red-50:rgba(226, 55, 25, .5);
    --color-red-text:white;
    --color-red-link:white;
    --color-red-border:rgb(194, 48, 22);

    --color-orange:rgb(226, 132, 25);
    --color-orange-50:rgba(226, 132, 25, .5);
    --color-orange-text:white;
    --color-orange-link:white;
    --color-orange-border:rgb(192, 112, 21);

    --color-yellow:rgb(255,243,205);
    --color-yellow-50:rgba(255,243,205,.5);
    --color-yellow-text:var(--inner-text-color);
    --color-yellow-link:var(--inner-link-color);
    --color-yellow-border:rgb(219, 209, 177);

    --color-white:rgb(255, 255, 255);
    --color-white-50:rgba(255, 255, 255, .5);
    --color-white-text:var(--inner-text-color);
    --color-white-link:var(--inner-link-color);
    --color-white-border:rgb(224, 224, 224);

    --color-lightgray:rgb(240, 240, 240);
    --color-lightgray-50:rgba(240, 240, 240, .5);
    --color-lightgray-text:var(--inner-text-color);
    --color-lightgray-link:var(--inner-link-color);
    --color-lightgray-border:rgb(201, 200, 200);

    --color-gray:rgb(138, 138, 138);
    --color-gray-50:rgba(138, 138, 138, 0.5);
    --color-gray-text:white;
    --color-gray-link:white;
    --color-gray-border:rgb(110, 110, 110);

    --color-darkgray:rgb(34, 34, 39);
    --color-darkgray-50:rgba(34, 34, 39, 0.5);
    --color-darkgray-text:white;
    --color-darkgray-link:white;
    --color-darkgray-border:rgb(0, 0, 0);
}

html,body{
    color:var(--outer-text-color, var(--inner-text-color));
    background-color:var(--outer-bg-color, var(--inner-bg-color));
}
html a, body a{
    color:var(--outer-link-color, var(--inner-link-color));
    text-decoration:var(--outer-link-dekoration, var(--inner-link-decoration));
}
.container{
    color:var(--inner-text-color);
    background-color:var(--inner-bg-color);
}
.container a{
    color:var(--inner-link-color);
    text-decoration:var(--inner-link-decoration);
}
a[role=link]{
    position: relative;
    display: inline-block;
    box-shadow: 0px 1px 0px 0px var(--inner-link-color);
}
/* .container a:hover { transform: scale(1.02); } */

.no-link-decoration{
    box-shadow: 0px 0px 0px 0px var(--inner-link-color)!important;
    text-decoration:none!important;
    border:0!important;
}
a.dropdown-item{
    color:var(--inner-text-color);
}

/* Link dekorationen für gewisse Elemente ausblenden */
/* a[role=button],a.navbar-brand, a.nav-link, a.dropdown-item{
    display:inline;
    color:var(--inner-text-color);
    text-decoration:none!important;
    box-shadow:none;
} */

/* Link animation (thick underline) */
.animated-links a {
    transition: box-shadow 0.2s linear;
}
.animated-links a:hover {
    box-shadow: 0px 3px 0px 0px var(--inner-link-color);
}
.no-animated-links a, .no-animated-links a:hover {
    box-shadow:none!important;
}

.btn{
    background-color:#DEE0E0;
    border-color:#DEE0E0;
    color:rgb(235, 235, 235);
}
.btn:hover{
    background-color:#DEE0E0;
    border-color:white!important;
    color:white!important;
}

.bg{
    background-color:var(--inner-bg-color)!important;
    color:var(--inner-text-color)!important; 
    border-color:var(--inner-border-color)!important;
}
.bg a{
    color:var(--inner-link-color);
}
.bg-coral{
    --inner-bg-color:var(--color-coral);
    --inner-text-color: var(--color-coral-text);
    --inner-link-color: var(--color-coral-link);
    --inner-border-color: var(--color-coral-border);
}
.bg-gray{
    --inner-bg-color:var(--color-gray);
    --inner-text-color: var(--color-gray-text);
    --inner-link-color: var(--color-gray-link);
    --inner-border-color: var(--color-gray-border);
}
.bg-gray-50{
    --inner-bg-color:var(--color-gray-50);
    --inner-text-color: var(--color-gray-50-text);
    --inner-link-color: var(--color-gray-50-link);
    --inner-border-color: var(--color-gray-50-border);
}
.bg-lightgray{
    --inner-bg-color:var(--color-lightgray);
    --inner-text-color: var(--color-lightgray-text);
    --inner-link-color: var(--color-lightgray-link);
    --inner-border-color: var(--color-lightgray-border);
}
.bg-lightgray-50{
    --inner-bg-color:var(--color-lightgray-50);
    --inner-text-color: var(--color-lightgray-50-text);
    --inner-link-color: var(--color-lightgray-50-link);
    --inner-border-color: var(--color-lightgray-50-border);
}
.bg-green{
    --inner-bg-color:var(--color-green);
    --inner-text-color: var(--color-green-text);
    --inner-link-color: var(--color-green-link);
    --inner-border-color: var(--color-green-border);
}
.bg-blue{
    --inner-bg-color:var(--color-blue);
    --inner-text-color: var(--color-blue-text);
    --inner-link-color: var(--color-blue-link);
    --inner-border-color: var(--color-blue-border);
}
.bg-red{
    --inner-bg-color:var(--color-red);
    --inner-text-color: var(--color-red-text);
    --inner-link-color: var(--color-red-link);
    --inner-border-color: var(--color-red-border);
}
.bg-orange{
    --inner-bg-color:var(--color-orange);
    --inner-text-color: var(--color-orange-text);
    --inner-link-color: var(--color-orange-link);
    --inner-border-color: var(--color-orange-border);
}
.bg-yellow{
    --inner-bg-color:var(--color-yellow);
    --inner-text-color: var(--color-yellow-text);
    --inner-link-color: var(--color-yellow-link);
    --inner-border-color: var(--color-yellow-border);
}

/*
.btn-default{background-color:#DEE0E0;border-color:#DEE0E0;color:white!important;}
.btn-default:hover{color:white;}


.bg-footer,.bg-footer *{background-color:#16191E!important; color:white;}
*/
/* Content Bereich 1 
#website-contents{}
*/
/* Außen 
#website-contents .content-outer{}
#website-contents .content-outer .btn-default{background-color:#DEE0E0;border-color:#DEE0E0;color:white;}
#website-contents .content-outer .btn-default:hover{color:white;}
*/
/* Innen 
#website-contents .content-inner{}
html,body,#website-contents .content-inner .btn-default{background-color:#DEE0E0;border-color:#DEE0E0;color:white;}
#website-contents .content-inner .btn-default:hover{color:white;}
*/

/*
.bg-red{background-color:red!important;}
.bg-red-xs{background-color:red!important;}
.bg-red-sm{background-color:red!important;}
.bg-red-md{background-color:red!important;}
.bg-red-lg{background-color:red!important;}
.bg-red-dark{background-color:red!important;}
.bg-red-dark-xs{background-color:red!important;}
.bg-red-dark-sm{background-color:red!important;}
.bg-red-dark-md{background-color:red!important;}
.bg-red-dark-lg{background-color:red!important;}
.bg-red-light{background-color:red!important;}
.bg-red-light-xs{background-color:red!important;}
.bg-red-light-sm{background-color:red!important;}
.bg-red-light-md{background-color:red!important;}
.bg-red-light-lg{background-color:red!important;}
.text-red{color:red!important;}
.text-red-xs{color:red!important;}
.text-red-sm{color:red!important;}
.text-red-md{color:red!important;}
.text-red-lg{color:red!important;}
.text-red-dark{color:red!important;}
.text-red-dark-xs{color:red!important;}
.text-red-dark-sm{color:red!important;}
.text-red-dark-md{color:red!important;}
.text-red-dark-lg{color:red!important;}
.text-red-light{color:red!important;}
.text-red-light-xs{color:red!important;}
.text-red-light-sm{color:red!important;}
.text-red-light-md{color:red!important;}
.text-red-light-lg{color:red!important;}
.border-red{border-color:red!important;}
.border-red-xs{border-color:red!important;}
.border-red-sm{border-color:red!important;}
.border-red-md{border-color:red!important;}
.border-red-lg{border-color:red!important;}
.border-red-dark{border-color:red!important;}
.border-red-dark-xs{border-color:red!important;}
.border-red-dark-sm{border-color:red!important;}
.border-red-dark-md{border-color:red!important;}
.border-red-dark-lg{border-color:red!important;}
.border-red-light{border-color:red!important;}
.border-red-light-xs{border-color:red!important;}
.border-red-light-sm{border-color:red!important;}
.border-red-light-md{border-color:red!important;}
.border-red-light-lg{border-color:red!important;}



.border-green{
    border-color:rgb(0, 71, 0);
}
.text-white{
    color:white!important;
}
*/
/* content */
/*
.content{background-color:#FFFFFF;color:#333333;border-color:#DFDFDF;}
a.content,.content a{color:#DEE0E0;}
a:hover.content,.content a:hover{color:#DEE0E0;}
.content.btn,.content .btn{background-color:#DEE0E0;color:#FFFFFF}
a.content,.content a{color:#DEE0E0;}
a:hover.content,.content a:hover{color:#DEE0E0;}
.content-bg{background-color:#FFFFFF;}
.content-text{color:#FFFFFF;}
a.content-a, .content-a a{color:#FFFFFF;}
a:hover.content-a:hover,.content-a a:hover{color:#FFFFFF;}
.content-border{border-color:#FFFFFF;}
.content-btn{background-color:#FFFFFF;color:#FFFFFF}
.content-bg{background-color:#333333;}
.content-i-text{color:#333333;}
a.content-i-a,.content-i-a a{color:#DEE0E0;}
a:hover.content-i-a:hover,.content-i-a:hover a:hover{color:#DEE0E0;}
.content-i-border{border-color:#DFDFDF;}
.content-i-btn{background-color:#DEE0E0;color:#FFFFFF}
*/
/* content-outer */
/*
.content-outer{background-color:#DEE0E0;color:#FFFFFF;border-color:#FFFFFF;}
a.content-outer,.content-outer a{color:#EEEEEE;}
a:hover.content-outer,.content-outer a:hover{color:#EFEFEF;}
.content-outer.btn,.content-outer .btn{background-color:#FFFFFF;color:#333333}
a.content-outer,.content-outer a{color:#EEEEEE;}
a:hover.content-outer,.content-outer a:hover{color:#EFEFEF;}
.content-outer-bg{background-color:#DEE0E0;}
.content-outer-text{color:#DEE0E0;}
a.content-outer-a, .content-outer-a a{color:#DEE0E0;}
a:hover.content-outer-a:hover,.content-outer-a a:hover{color:#DEE0E0;}
.content-outer-border{border-color:#DEE0E0;}
.content-outer-btn{background-color:#DEE0E0;color:#DEE0E0}
.content-outer-bg{background-color:#FFFFFF;}
.content-outer-i-text{color:#FFFFFF;}
a.content-outer-i-a,.content-outer-i-a a{color:#EEEEEE;}
a:hover.content-outer-i-a:hover,.content-outer-i-a:hover a:hover{color:#EFEFEF;}
.content-outer-i-border{border-color:#FFFFFF;}
.content-outer-i-btn{background-color:#FFFFFF;color:#333333}
*/
/* content-inner */
/*
.content-inner{background-color:#FFFFFF;color:#666;border-color:#DFDFDF;}
a.content-inner,.content-inner a{color:#DEE0E0;}
a:hover.content-inner,.content-inner a:hover{color:#DEE0E0;}
.content-inner.btn,.content-inner .btn{background-color:#DEE0E0;color:#FFFFFF}
a.content-inner,.content-inner a{color:#DEE0E0;}
a:hover.content-inner,.content-inner a:hover{color:#DEE0E0;}
.content-inner-bg{background-color:#FFFFFF;}
.content-inner-text{color:#FFFFFF;}
a.content-inner-a, .content-inner-a a{color:#FFFFFF;}
a:hover.content-inner-a:hover,.content-inner-a a:hover{color:#FFFFFF;}
.content-inner-border{border-color:#FFFFFF;}
.content-inner-btn{background-color:#FFFFFF;color:#FFFFFF}
.content-inner-bg{background-color:#333333;}
.content-inner-i-text{color:#333333;}
a.content-inner-i-a,.content-inner-i-a a{color:#DEE0E0;}
a:hover.content-inner-i-a:hover,.content-inner-i-a:hover a:hover{color:#DEE0E0;}
.content-inner-i-border{border-color:#DFDFDF;}
.content-inner-i-btn{background-color:#DEE0E0;color:#FFFFFF}
*/
/* element */
/*
.element{background-color:#F2F2F2;color:#333333;border-color:#DFDFDF;}
a.element,.element a{color:#DEE0E0;}
a:hover.element,.element a:hover{color:#DEE0E0;}
.element.btn,.element .btn{background-color:#DEE0E0;color:#FFFFFF}
a.element,.element a{color:#DEE0E0;}
a:hover.element,.element a:hover{color:#DEE0E0;}
.element-bg{background-color:#F2F2F2;}
.element-text{color:#F2F2F2;}
a.element-a, .element-a a{color:#F2F2F2;}
a:hover.element-a:hover,.element-a a:hover{color:#F2F2F2;}
.element-border{border-color:#F2F2F2;}
.element-btn{background-color:#F2F2F2;color:#F2F2F2}
.element-bg{background-color:#333333;}
.element-i-text{color:#333333;}
a.element-i-a,.element-i-a a{color:#DEE0E0;}
a:hover.element-i-a:hover,.element-i-a:hover a:hover{color:#DEE0E0;}
.element-i-border{border-color:#DFDFDF;}
.element-i-btn{background-color:#DEE0E0;color:#FFFFFF}
*/