@charset "utf-8";  

/* 
CSS Document HPK - Layout 21 
Definition Farbschema 
Gelb - Header Footer Dark
*/

.bg-gradient-dark-translucent {
    background: linear-gradient(180deg, rgb(222 148 0) 0%, rgb(11 15 25) 100%) !important;
}

section.bg-primary {
    --si-bg-opacity: 1;
    background-color: rgb(49 49 49) !important;
}

section .card.bg-primary {
    background-color: rgb(49 49 49) !important;
}

.bg-primary .link-typ2:hover {
    color: var(--si-light) !important;
}

/**********************************************/
/***************** Header, Navbar ************/
/********************************************/

header.navbar-sticky,
header.navbar-sticky.bg-light {
    background-color: var(--si-dark) !important;
    border: 1px solid var(--si-dark-border-subtle) !important;
}

header.navbar-sticky .nav-link {
    color: rgba(var(--si-light-rgb), 0.85) !important;
}
header.navbar-sticky .nav-link:hover,
header.navbar-sticky .nav-link:focus {
    color: var(--si-primary-hover) !important;
}
header.navbar-sticky .nav-link.active {
    color: var(--si-primary-active) !important;
}

header.navbar-sticky .dropdown-menu {
    background-color: #222222 !important;
    border: 1px solid var(--si-dark-border-subtle) !important;
}

header.navbar-sticky .dropdown-item {
    color: rgba(var(--si-light-rgb), 0.85) !important;
    background-color: transparent !important;
}
header.navbar-sticky .dropdown-item:hover,
header.navbar-sticky .dropdown-item:focus {
    color: var(--si-primary-hover) !important;
    background-color: rgba(var(--si-light-rgb), 0.05) !important;
}
header.navbar-sticky .dropdown-item.active {
    color: var(--si-primary-active) !important;
    background-color: rgba(var(--si-light-rgb), 0.1) !important;
}
header.navbar-sticky .dropdown-divider {
    background-color: rgba(var(--si-light-rgb), 0.14) !important;
}
header.navbar-sticky .dropdown-header {
    color: var(--si-light) !important;
}

header.navbar-sticky .navbar-toggler {
    border: 0px solid var(--si-dark-border-subtle) !important;
    background-color: transparent !important;
}

header.navbar-sticky .navbar-toggler-icon,
header.navbar-sticky .navbar-toggler-icon::before,
header.navbar-sticky .navbar-toggler-icon::after {
    background-color: rgba(var(--si-light-rgb), 0.85) !important;
    background-image: none !important;
}

header.navbar-sticky .navbar-brand {
    color: var(--si-light) !important;
}
header.navbar-sticky .navbar-brand:hover {
    color: var(--si-light) !important;
}

#navbarCollapse3 hr {
    margin: 0 0;
    border: 0;
    border-top: 1px solid var(--si-dark-border-subtle) !important;
    opacity: 1;
}


/**********************************************/
/***************** Default, Light ************/
/********************************************/

:root,
[data-bs-theme=light] {
	
	--si-blue: #0d6efd;
	--si-indigo: #6610f2;
	--si-purple: #6f42c1;
	--si-pink: #d63384;
	--si-red: #dc3545;
	--si-orange: #fd7e14;
	--si-yellow: #ffc107;
	--si-green: #198754;
	--si-teal: #20c997;
	--si-cyan: #0dcaf0;
	--si-black: #000;
	--si-white: #fff;
	--si-gray: #999999;
	--si-gray-dark: #3a3a3a;
	--si-gray-100: #f9f9f9;
	--si-gray-200: #f2f2f2;
	--si-gray-300: #e8e8e8;
	--si-gray-400: #d9d9d9;
	--si-gray-500: #b8b8b8;
	--si-gray-600: #999999;
	--si-gray-700: #565656;
	--si-gray-800: #3a3a3a;
	--si-gray-900: #1b1b1b;	

	--si-success: #adeeeb;          
	--si-success-hover: #990000;
	--si-success-active: #800000;

	--si-info: #4c82f7;
	--si-info-hover: #990000;
	--si-info-active: #800000;

	--si-warning: #ffba08;
	--si-warning-hover: #ff6666;
	--si-warning-active: #ff4d4d;

	--si-danger: #e60000;
	--si-danger-hover: #cc0000;
	--si-danger-active: #990000;

	--si-light: #fff;
	--si-light-hover: #f2f2f2;
	--si-light-active: #e6e6e6;

	--si-dark: #1b1b1b;
	--si-dark-hover: #333;
	--si-dark-active: #660000;
	
	/* Hauptfarben */

	--si-primary: #e49500;
	--si-primary-hover: #ffaa1a;
	--si-primary-active: #b37500;
	--si-primary-light: #ffe099;

	--si-secondary: #dddee1;
	--si-secondary-hover: #d2d3d6;
	--si-secondary-active: #a8a8a8;
	--si-secondary-bg-light: #eff0f3;	

	--si-primary-rgb: 228, 149, 0;
	--si-secondary-rgb: 221, 222, 225;

	--si-primary-text-emphasis: #e49500;
	--si-secondary-text-emphasis: #cccccc;

	--si-primary-border-subtle: #ffe099;
	--si-secondary-border-subtle: #cccccc;

	--si-gradient-1: #e49500;
	--si-gradient-2: #ffaa1a;
	--si-gradient-3: #ffe099;

	--si-primary-bg-subtle: #fff8e0;
	--si-secondary-bg-subtle: #f5f5f5;

	--si-code-color: #e49500;
	--si-highlight-color: #ffaa1a;
	--si-highlight-bg: #fff0cc;
	--si-heading-link-hover-color: #e49500;
	--si-heading-link-color: #000;

	--si-heading-color2: var(--si-light);
	--si-body-color2: rgba(255, 255, 255, 0.8);
	--si-secondary-bg2: rgba(255, 255, 255, .04);
	--si-card-border-color2: rgba(255, 255, 255, .15);
	--si-primary2: var(--si-primary-hover);
	--si-primary-hover2: var(--si-primary-active);
	--si-primary-active2: var(--si-primary-active);
	
  	--si-success-rgb: 173, 238, 235;
  	--si-info-rgb: 76, 130, 247;
  	--si-warning-rgb: 255, 186, 8;
  	--si-danger-rgb: 239, 68, 68;
	--si-light-rgb: 255, 255, 255;
	--si-dark-rgb: 27, 27, 27;
	
	--si-success-text-emphasis: #83E5E1;
	--si-info-text-emphasis: #1B60F5;
	--si-warning-text-emphasis: #D49900;
	--si-danger-text-emphasis: #EB1515;
	--si-light-text-emphasis: #565656;
	--si-dark-text-emphasis: #1B1B1B;
	
	--si-success-bg-subtle: #F7FDFD;
	--si-info-bg-subtle: #EDF2FE;
	--si-warning-bg-subtle: #FFF8E6;
	--si-danger-bg-subtle: #FDECEC;
	--si-light-bg-subtle: #fff;
	--si-dark-bg-subtle: #EDEDED;
	
	--si-success-border-subtle: #EAFBFA;
	--si-info-border-subtle: #D2E0FD;
	--si-warning-border-subtle: #FFEEC1;
	--si-danger-border-subtle: #FBD0D0;
	--si-light-border-subtle: #cccccc;
	--si-dark-border-subtle: #333333;

	--si-body-color: #555555;
	--si-body-color-rgb: 0, 0, 0;
	--si-body-bg: #fff;
	--si-body-bg-rgb: 85, 85, 85;

	--si-link-color: var(--si-primary);
	--si-link-color-rgb: var(--si-primary-rgb);
	--si-link-hover-color: #ffaa1a;
	--si-link-hover-color-rgb: 255, 170, 26;

	--si-nav-link-color: var(--si-dark);
	--si-nav-link-hover-color: var(--si-primary);
	--si-nav-link-disabled-color: rgba(0,0,0,0.4);

	--si-dropdown-link-hover-color: var(--si-light);
	--si-dropdown-link-hover-bg: var(--si-primary);
	--si-dropdown-link-active-color: var(--si-light);
	--si-dropdown-link-active-bg: var(--si-primary-active);
	--si-dropdown-link-disabled-color: rgba(0,0,0,0.4);

	--si-btn-primary-color: var(--si-light);
	--si-btn-primary-bg: var(--si-primary);
	--si-btn-primary-border: var(--si-primary);
	--si-btn-primary-hover-bg: var(--si-primary-hover);
	--si-btn-primary-hover-border: var(--si-primary-hover);
	--si-btn-primary-active-bg: var(--si-primary-active);
	--si-btn-primary-active-border: var(--si-primary-active);
	--si-btn-primary-disabled-bg: rgba(228, 149, 0, 0.5);
	--si-btn-primary-disabled-border: rgba(228, 149, 0, 0.5);

	--si-btn-secondary-color: var(--si-dark);
	--si-btn-secondary-bg: var(--si-secondary);
	--si-btn-secondary-border: var(--si-secondary);
	--si-btn-secondary-hover-bg: var(--si-secondary-hover);
	--si-btn-secondary-hover-border: var(--si-secondary-hover);
	--si-btn-secondary-active-bg: var(--si-secondary-active);
	--si-btn-secondary-active-border: var(--si-secondary-active);
	--si-btn-secondary-disabled-bg: rgba(221, 222, 225, 0.5);
	--si-btn-secondary-disabled-border: rgba(221, 222, 225, 0.5);

	--si-bx-search-color: #666666;	
}

/**********************************************/
/**************** Footer Dark ****************/
/********************************************/

#Menu.bg-secondary {
  background-color: #222222 !important;
}

#Menu .card {
    background-color: rgba(255, 255, 255, .07);
    color: #ffffff;
    --si-border-color: rgba(255, 255, 255, 0.14)
}


#Menu .card a {
    color: #ffffff;
}

#Menu .card a:hover {
    color: #dddddd;
}

#Menu .card .btn-outline-primary {
    color: #ffffff;
    border-color: #ffffff;
}

#Menu .card .btn-outline-primary:hover {
    background-color: #ffffff;
    color: #111111;
}

footer.footer {

  --si-body-bg: #111111;
  --si-body-color: rgba(255, 255, 255, 1);

  --si-gray-600: rgba(255, 255, 255, 0.55);
  --si-gray-700: rgba(255, 255, 255, 0.75);
  --si-gray-800: rgba(255, 255, 255, 0.9);

  --si-secondary-bg: rgba(255, 255, 255, 0.07);
  --si-secondary-bg-subtle: #2b2b2e;

  background-color: var(--si-body-bg);
  color: var(--si-body-color);
}

footer.footer .text-dark {
  color: var(--si-body-color) !important;
}

footer.footer a,
footer.footer .nav-link {
  color: var(--si-gray-800);
}

footer.footer a:hover,
footer.footer .nav-link:hover {
  color: var(--si-link-hover-color);
}

footer.footer .btn-primary:hover {
    color: var(--si-btn-primary-color);
}

footer.footer h6,
footer.footer h6 a {
  color: rgba(255, 255, 255, 0.9);
}

footer.footer.bg-secondary {
  background-color: #222222 !important;
}

footer.footer .btn-secondary {
  background-color: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.08);
  color: #ffffff;
}

footer.footer .text-muted {
  color: rgba(255, 255, 255, 0.55) !important;
}

footer.footer hr {
  border-color: rgba(255, 255, 255, 0.1);
}


/**********************************************/
/***************** Dark **********************/
/********************************************/

[data-bs-theme=dark] {
	
	color-scheme: dark;	
	
	--si-gray-600: rgba(255, 255, 255, .5);
	--si-gray-700: rgba(255, 255, 255, .7);
	--si-gray-800: rgba(255, 255, 255, .85);
	--si-gray-900: #fff;
	--si-secondary-bg: rgba(255, 255, 255, .07);
	--si-heading-link-color: rgba(255, 255, 255, 0.85);
	--si-heading-link-hover-color: var(--si-primary-hover);
	--si-code-color: #ffaa1a;
		
	--si-body-color: rgba(255, 255, 255, 0.9);
	--si-body-color-rgb: 255, 255, 255;
	--si-body-bg: #111111;
	--si-body-bg-rgb: 26, 26, 26;

	--si-primary-text-emphasis: #ffcc66;
	--si-secondary-text-emphasis: #ff8080;
	--si-success-text-emphasis: #66ffff;
	--si-info-text-emphasis: #4d8dff;
	--si-warning-text-emphasis: #ffcc66;
	--si-danger-text-emphasis: #ff4d4d;
	--si-light-text-emphasis: #ffe6e6;
	--si-dark-text-emphasis: #d95c1b;;

	--si-primary-bg-subtle: #2b2100;
	--si-secondary-bg-subtle: #2b2b2e;
	--si-success-bg-subtle: #660000;
	--si-info-bg-subtle: #800000;
	--si-warning-bg-subtle: #993333;
	--si-danger-bg-subtle: #b30000;
	--si-light-bg-subtle: #260000;
	--si-dark-bg-subtle: #0d0000;

	--si-primary-border-subtle: #ffcc66;
	--si-secondary-border-subtle: #ff9999;
	--si-success-border-subtle: #ff3333;
	--si-info-border-subtle: #ff4d4d;
	--si-warning-border-subtle: #ff8080;
	--si-danger-border-subtle: #ff0000;
	--si-light-border-subtle: #ff9999;
	--si-dark-border-subtle: #660000

	--si-link-color: #ffcc66;
	--si-link-hover-color: #ffdd88;
	--si-link-color-rgb: 255, 204, 102;
	--si-link-hover-color-rgb: 255, 221, 136;

	--si-btn-primary-color: var(--si-light);
	--si-btn-primary-bg: var(--si-primary);
	--si-btn-primary-border: var(--si-primary);
	--si-btn-primary-hover-bg: var(--si-primary-hover);
	--si-btn-primary-hover-border: var(--si-primary-hover);
	--si-btn-primary-active-bg: var(--si-primary-active);
	--si-btn-primary-active-border: var(--si-primary-active);
	--si-btn-primary-disabled-bg: var(--si-primary);
	--si-btn-primary-disabled-border: var(--si-primary);	

	--si-bx-search-color: #b3b3b3;

	--si-heading-color2: var(--si-light);
	--si-body-color2: rgba(255, 255, 255, 0.9);
	--si-secondary-bg2: rgba(255, 255, 255, .04);
}