:root {
    --bs-primary-rgb: 145, 53, 188;
    --bs-primary: rgb(var(--bs-primary-rgb));
    
    --bs-primary-hover-rgb: 200, 153, 2211;
    --bs-primary-hover: rgba(var(--bs-primary-hover-rgb),1);

    --bs-primary-active-rgb:  200, 153, 221;
    --bs-primary-active: rgba(var(--bs-primary-active-rgb),1);
	
	--bs-secondary-rgb: 48, 227, 202;
    --bs-secondary: rgb(var(--bs-secondary-rgb));
    
    --bs-secondary-hover-rgb: 6, 97, 121;
    --bs-secondary-hover: rgba(var(--bs-secondary-hover-rgb),1);

    --bs-secondary-active-rgb:  6, 97, 121;
    --bs-secondary-active: rgba(var(--bs-secondary-active-rgb),1);

    --bs-danger-rgb: 226, 6, 18;
    --bs-danger: rgb(var(--bs-danger-rgb));
    
    --bs-success-rgb: 103, 123, 88;
    --bs-success: rgb(var(--bs-success-rgb));
    
    --bs-success-hover: rgba(var(--bs-success-rgb), .5);
    
    --bs-info-rgb: 54, 81, 158;
    --bs-info: rgb(var(--bs-info-rgb));
    
    --bs-info-hover: rgba(var(--bs-info-rgb), .5);

    --bs-border-color: rgba(var(--bs-primary-rgb), .6);
    
    --bs-link-color: var(--bs-primary);
    --bs-link-hover-color: var(--bs-primary-hover);
    --bs-link-color-rgb: var(--bs-primary-rgb);
    --bs-link-decoration: none;
    --bs-link-hover-color-rgb: var(--bs-primary-hover-rgb);
    
    --bs-font-sans-serif: "Calibri", system-ui, sans-serif;
	--bs-body-color: var(--bs-primary);
    
    
}
@media (min-width: 1640px) {
    :root{
        --bs-nav-link-font-size: 1.125rem;
        --bs-body-font-size: 1.125rem;
    }
}

h1,h2,h3,.card-title,.h1,.h2,.h3, .navbar-brand {
	font-family: "Cascadia Code", system-ui, sans-serif;
	font-weight: 400;
	
}
h1, .h1 {
	font-size: 2.5rem;
	font-weight: 700;
}
.card-title, .navbar-brand {
	font-size: 1.25rem;
	font-weight: 700;
}
.pagination {
    --bs-pagination-padding-x: 0.75rem;
    --bs-pagination-padding-y: 0.375rem;
    --bs-pagination-font-size: 1rem;
    --bs-pagination-color: var(--bs-link-color);
    --bs-pagination-bg: transparent;
    --bs-pagination-border-width: 1px;
    --bs-pagination-border-color: var(--bs-primary);
    --bs-pagination-border-radius: 0.375rem;
    --bs-pagination-hover-color: #fff;
    --bs-pagination-hover-bg: var(--bs-primary-hover);
    --bs-pagination-hover-border-color: var(--bs-primary-hover);
    --bs-pagination-focus-color: var(--bs-link-hover-color);
    --bs-pagination-focus-bg: #e9ecef;
    --bs-pagination-focus-box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
    --bs-pagination-active-color: #fff;
    --bs-pagination-active-bg: var(--bs-primary);
    --bs-pagination-active-border-color: var(--bs-primary);
    --bs-pagination-disabled-color: #dee2e6;
    --bs-pagination-disabled-bg: transparent;
    --bs-pagination-disabled-border-color: #dee2e6;
}
.btn-primary {
    --bs-btn-color: #fff;
    --bs-btn-bg:  var(--bs-primary);
    --bs-btn-border-color: var(--bs-primary);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--bs-primary-hover);
    --bs-btn-hover-border-color: var(--bs-primary-hover);
    --bs-btn-focus-shadow-rgb: 49,132,253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--bs-primary-active);
    --bs-btn-active-border-color: var(--bs-primary-active);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--grau);
    --bs-btn-disabled-border-color: var(--grau);
}
.btn-outline-primary {
    --bs-btn-color: var(--bs-primary);
    --bs-btn-border-color: var(--bs-primary);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--bs-primary);
    --bs-btn-hover-border-color: var(--bs-primary);
    --bs-btn-focus-shadow-rgb: 13, 110, 253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--bs-primary);
    --bs-btn-active-border-color: var(--bs-primary);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: var(--bs-primary);
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: var(--bs-primary);
    --bs-gradient: none;
}
.btn-secondary {
    --bs-btn-color: #fff;
    --bs-btn-bg:  var(--bs-secondary);
    --bs-btn-border-color: var(--bs-secondary);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--bs-secondary-hover);
    --bs-btn-hover-border-color: var(--bs-secondary-hover);
    --bs-btn-focus-shadow-rgb: 49,132,253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--bs-secondary-active);
    --bs-btn-active-border-color: var(--bs-secondary-active);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--grau);
    --bs-btn-disabled-border-color: var(--grau);
}
.btn-success {
    --bs-btn-color: #fff;
    --bs-btn-bg:  var(--bs-success);
    --bs-btn-border-color: var(--bs-success);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--bs-success-hover);
    --bs-btn-hover-border-color: var(--bs-success-hover);
    --bs-btn-focus-shadow-rgb: 49,132,253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--bs-success-active);
    --bs-btn-active-border-color: var(--bs-success-active);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--grau);
    --bs-btn-disabled-border-color: var(--grau);
}
.btn-info {
    --bs-btn-color: #fff;
    --bs-btn-bg:  var(--bs-info);
    --bs-btn-border-color: var(--bs-info);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--bs-info-hover);
    --bs-btn-hover-border-color: var(--bs-info-hover);
    --bs-btn-focus-shadow-rgb: 49,132,253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--bs-info-active);
    --bs-btn-active-border-color: var(--bs-info-active);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--grau);
    --bs-btn-disabled-border-color: var(--grau);
}
.btn-danger {
    --bs-btn-color: #fff;
    --bs-btn-bg:  var(--bs-danger);
    --bs-btn-border-color: var(--bs-danger);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--bs-red);
    --bs-btn-hover-border-color: var(--bs-red);
    --bs-btn-focus-shadow-rgb: 49,132,253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--bs-red);
    --bs-btn-active-border-color: var(--bs-red);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--grau);
    --bs-btn-disabled-border-color: var(--grau);
}
.border-5 {
    border-width: 1rem !important;
}
.bg-gradient-1 {
	background-image: linear-gradient(to bottom right, #a16ae8, #9135bc);
      
}

@media(min-width:1200px){
    .top-xl-50 {
        top: 50%
    }
}

@font-face {
  font-display: swap; 
  font-family: 'Amatic SC';
  font-style: normal;
  font-weight: 400;
  src: url('../font/amatic-sc-v26-latin-regular.woff2') format('woff2'); 
}

@font-face {
  font-display: swap;
  font-family: 'Amatic SC';
  font-style: normal;
  font-weight: 700;
  src: url('../font/amatic-sc-v26-latin-700.woff2') format('woff2'); 
}

/* cascadia-code-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Cascadia Code';
  font-style: normal;
  font-weight: 300;
  src: url('../font/cascadia-code-v2-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* cascadia-code-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Cascadia Code';
  font-style: normal;
  font-weight: 400;
  src: url('../font/cascadia-code-v2-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* cascadia-code-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Cascadia Code';
  font-style: normal;
  font-weight: 500;
  src: url('../font/cascadia-code-v2-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* cascadia-code-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Cascadia Code';
  font-style: normal;
  font-weight: 700;
  src: url('../font/cascadia-code-v2-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}