/* individuelle CSS-Einstellungen fuer Colette Nussbaum
------------------------------------------------------- */

@font-face {
  font-family: 'American_Dreams'; /* eigener Name */
  src: url('../fonts/American_Dreams_Demo/American_Dreams_Demo.otf') format('opentype'); /* Fallback, besser woff2 oder woff */
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'Marbre_Sans'; /* eigener Name */
  src: url('../fonts/Marbre-Sans/Marbre-Sans.ttf.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'Roboto_Condensed'; /* eigener Name */
  src: url('../fonts/Roboto_Condensed/RobotoCondensed-Regular.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'Elegant_Typewriter'; /* eigener Name */
  src: url('../fonts/ELEGANT-TYPEWRITER1/ELEGANT-TYPEWRITER1.ttf.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'TeX_Gyre_Pagella'; /* eigener Name */
  src: url('../fonts/TeX-Gyre-Pagella/texgyrepagella-regular.otf') format('opentype');
  font-weight: normal;
  font-style: normal;
}

html {
    scroll-behavior: smooth; /* Für sanftes Scrollen */
}

body {
	background-color: rgb(23, 7, 7) !important;
	color: rgb(146, 146, 146);
	font-family: 'Roboto_Condensed', Arial, sans-serif !important;
}

.first-container {
	margin-top: 80px;
}

a:link, a:visited, a:hover, a:active {
	color: rgb(146, 146, 146);
	text-decoration: none;
}

.parallax-container {
    position: relative;
    width: 100%;
    height: 100vh;
    overflow: hidden;
	z-index: -1;
}

.parallax-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    transform: translateY(0);
    will-change: transform;
}

/* height: 100%; */
/* object-fit: cover; */

.hero {
    width: 100%;
    height: 100vh;
    background-size: cover;
    background-position: center;
}

.titel {
	text-align: center;
	color: rgb(253, 205, 70);
	font-family: 'Marbre_Sans', Arial, sans-serif !important;
	font-size: clamp(35px, 10vw, 90px);
}

.subtitel {
	color: rgb(146, 146, 146);
	/*font-family: 'Marbre_Sans', Arial, sans-serif !important;*/
	/*font-size: clamp(20px, 7vw, 30px);*/
	font-size: 16px;
	text-transform: uppercase;
}

#schauspielerin_saengerin_stimme {
	background-color: rgb(253, 205, 70);
	color: rgb(23, 7, 7);
	font-family: 'Elegant_Typewriter', Arial, sans-serif !important;
	font-size: clamp(30px, 10vw, 45px);
}

#zitat_start {
	color: rgb(239, 238, 230);
	font-family: 'TeX_Gyre_Pagella', Arial, sans-serif !important;
	font-size: 16px;
}

#button_start_mehr {
	border-radius: 0 !important;
	border-style: solid;
	border-width: 2px !important;
	border-color: #ffffff !important;
	background-color: #000000;
	color: #ffffff !important;
	font-family: American_Dreams, Arial, sans-serif !important;
	font-size: 24px;
	text-decoration: none;
	padding:10px;
}

#biographie-untertitel {
	text-align: center;
	color: rgb(239, 238, 230);
	font-family: 'TeX_Gyre_Pagella', Arial, sans-serif !important;
	font-weight: bold;
}

#biographie {
	color: rgb(239, 238, 230);
	font-family: 'TeX_Gyre_Pagella', Arial, sans-serif !important;
}

.titel-steckbrief {
	color: #000000;
	font-family: 'Marbre_Sans', Arial, sans-serif !important;
	font-size: clamp(17px, 5vw, 45px);
}
#steckbrief {
	color: rgb(0, 0, 0);
	font-family: 'Roboto_Condensed', Arial, sans-serif !important;
}

.titel-ausbildung {
	color: rgb(255, 255, 255);
	font-family: 'Marbre_Sans', Arial, sans-serif !important;
	font-size: clamp(17px, 5vw, 45px);
}

#ausbildung {
	color: rgb(255, 255, 255);
	font-family: 'Roboto_Condensed', Arial, sans-serif !important;
}

.titel-auszeichnungen {
	color: rgb(0, 0, 0);
	font-family: 'Marbre_Sans', Arial, sans-serif !important;
	font-size: clamp(17px, 5vw, 45px);
}

#auszeichnungen {
	background-color: #FFDE8E;;
	color: rgb(0, 0, 0);
	font-family: 'Roboto_Condensed', Arial, sans-serif !important;
}

#sedcard_zum_download {
	color: rgb(239, 238, 230);
	font-family: 'Elegant_Typewriter', Arial, sans-serif !important;
	font-size: 18px;
}

#kontakt_zitat {
	color: rgb(239, 238, 230);
	font-family: 'TeX_Gyre_Pagella', Arial, sans-serif !important;
	font-size: 20px;
}

#kontakt_mitglied {
	color: rgb(239, 238, 230);
	font-family: 'Elegant_Typewriter', Arial, sans-serif !important;
	font-size: 18px;
}

#kontakt_links {
	color: rgb(239, 238, 230);
	font-family: 'Elegant_Typewriter', Arial, sans-serif !important;
	font-size: 16px;
}

.card {
	background-color: rgb(23, 7, 7) !important;
}

.card-body {
	padding-top: 0px !important;
}

.card-title {
	text-transform:uppercase;
	color: rgb(239, 238, 230);
	font-family: 'Roboto_Condensed', Arial, sans-serif !important;
}

.card-text {
	/*text-transform:uppercase;*/
	color: rgb(239, 238, 230);
	font-family: 'Roboto_Condensed', Arial, sans-serif !important;
}


.navbar {
	background-color: rgb(23, 7, 7) !important;
	color: rgb(146, 146, 146) !important;
	font-family: 'Elegant_Typewriter', Arial, sans-serif !important;
	font-weight: normal;
	/*text-transform:uppercase;*/
	font-size: 16px;
}

#colette_nussbaum_menu {
	font-family: 'Marbre_Sans', Arial, sans-serif !important;
	text-transform: none;
	font-weight: normal;
	text-transform:uppercase;
	font-size: 24px;
}

#de_menu {
	color: #ffffff;
}

.navbar-brand {
	color: rgb(146, 146, 146) !important;
	font-family: 'Marbre_Sans', Arial, sans-serif !important;
}

.nav-link {
	color: rgb(146, 146, 146) !important;
}
.nav-link.active {
	color: #929292 !important;
}
.nav-link.hover {
	color: #582E15 !important;
}

.navbar-toggler-icon {
    filter: invert(100%); /* Macht die Linien weiß, wenn der Hintergrund dunkel ist */
}

.produktionen-subnav {
	text-transform:uppercase;
}

.bildbeschriftung {
	color: #ffffff;
}

[id] {
    scroll-margin-top: 80px; /* Höhe deiner Navbar */
}

.footer {
	background-color: rgb(23, 7, 7) !important;
	color: rgb(146, 146, 146) !important;
	/*font-family: 'Elegant_Typewriter', Arial, sans-serif !important;*/
	font-weight: normal;
	/*text-transform:uppercase;*/
	font-size: 16px;
}

.footer > .container > a {
	text-decoration: none;
}