@charset "UTF-8";
/***!  /media/templates/site/cassiopeia_cassiopeia_dafv/css/user.css?64b7b8  !***/

/* Grundsätzliche Template Farben und Einstellungen */

:root {

  /* War blau #213a8f grün #86bc25 */
    --cassiopeia-color-primary: #003e90;
    --cassiopeia-color-link: #89ba17;
    --cassiopeia-color-hover: #B3790E;
    --dafv-blue: #003e90;
    --dafv-green: #89ba17;
    --dafv-hover: #B3790E;

    
    --blue: #0d6efd;
    --indigo: #6610f2;
    --purple: #6f42c1;
    --pink: #d63384;
    --red: #dc3545;
    --orange: #fd7e14;
    --yellow: #ffc107;
    --green: #198754;
    --teal: #20c997;
    --cyan: #0dcaf0;
    --white: #fff;
    --gray: #6c757d;
    --gray-dark: #343a40;
    --gray-100: #f8f9fa;
    --gray-200: #e9ecef;
    --gray-300: #dee2e6;
    --gray-400: #ced4da;
    --gray-500: #adb5bd;
    --gray-600: #6c757d;
    --gray-700: #495057;
    --gray-800: #343a40;
    --gray-900: #212529;
    --primary: #0d6efd;
    --secondary: #6c757d;
    --success: #198754;
    --info: #0dcaf0;
    --warning: #ffc107;
    --danger: #dc3545;
    --light: #f8f9fa;
    --dark: #212529;
    --primary-rgb: 0, 62, 144;
    --secondary-rgb: 137, 186, 23;
    --success-rgb: 25, 135, 84;
    --info-rgb: 13, 202, 240;
    --warning-rgb: 255, 193, 7;
    --danger-rgb: 220, 53, 69;
    --light-rgb: 248, 249, 250;
    --dark-rgb: 33, 37, 41;
    --white-rgb: 255, 255, 255;
    --black-rgb: 0, 0, 0;
    --body-color-rgb: 33, 37, 41;
    --body-bg-rgb: 255, 255, 255;
  

  /* Carousel background für den Text über den Bildern 
  --cassiopeia-color-primary-rgb: 85,152,55; */
  
}

/* Hinweislabels */
em.highlight {
  border-radius: 4px 4px 4px 4px;
  font-style: normal;
  padding: 2px 5px;
  text-shadow: none;
}
em.highlight.red {
  background: none repeat scroll 0 0 #A62929;
  color: #FFF;
}
em.highlight.blue {
  background: none repeat scroll 0 0 #4B90B5;
  color: #FFF;
}
em.highlight.green {
  background: none repeat scroll 0 0 #89B223;
  color: #FFF;
}

/* Textboxen */
div.textbox {
  border-radius: 6px 6px 6px 6px;
  padding: 10px 10px 10px 20px;
  position: relative;
  margin-bottom: 1rem;
}

div.textbox.success {
  background: var(--success);
  color: #FFF;
}
div.textbox.info {
  background: var(--info);
  color: #FFF;
}
div.textbox.warning {
  background: var(--warning);
  color: #FFF;
}
div.textbox.danger {
  background: var(--danger);
  color: #FFF;
}
div.textbox.light {
  background: var(--light);
  color: var(--dafv-blue);
}
div.textbox.dark {
  background: var(--dark);
  color: #FFF;
}
/* background: linear-gradient(90deg, var(--dafv-blue) 0%, var(--dafv-green) 100%); */


.container-header {
  background-color: var(--dafv-blue);
  background-image: none;
}

.container-footer {
  background-color: var(--dafv-green);
  background-image: none;
}

/* fira-sans-regular - latin */
@font-face {src: url('https://www.dafv.de/media/templates/site/cassiopeia_cassiopeia_dafv/fonts/fira-sans-v16-latin-regular.eot'); src: url('https://www.dafv.de/media/templates/site/cassiopeia_cassiopeia_dafv/fonts/fira-sans-v16-latin-regular.eot#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('https://www.dafv.de/media/templates/site/cassiopeia_cassiopeia_dafv/fonts/fira-sans-v16-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('https://www.dafv.de/media/templates/site/cassiopeia_cassiopeia_dafv/fonts/fira-sans-v16-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('https://www.dafv.de/media/templates/site/cassiopeia_cassiopeia_dafv/fonts/fira-sans-v16-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('https://www.dafv.de/media/templates/site/cassiopeia_cassiopeia_dafv/fonts/fira-sans-v16-latin-regular.svg#FiraSans') format('svg'); font-display: swap; font-family: 'Fira Sans'; font-style: normal; font-weight: 400}


/* lato-regular - latin */
@font-face {src: url('https://www.dafv.de/media/templates/site/cassiopeia_cassiopeia_dafv/fonts/lato-v23-latin-regular.eot'); src: url('https://www.dafv.de/media/templates/site/cassiopeia_cassiopeia_dafv/fonts/lato-v23-latin-regular.eot#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('https://www.dafv.de/media/templates/site/cassiopeia_cassiopeia_dafv/fonts/lato-v23-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('https://www.dafv.de/media/templates/site/cassiopeia_cassiopeia_dafv/fonts/lato-v23-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('https://www.dafv.de/media/templates/site/cassiopeia_cassiopeia_dafv/fonts/lato-v23-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('https://www.dafv.de/media/templates/site/cassiopeia_cassiopeia_dafv/fonts/lato-v23-latin-regular.svg#Lato') format('svg'); font-display: swap; font-family: 'Lato'; font-style: normal; font-weight: 400}


/* poppins-regular - latin */
@font-face {src: url('https://www.dafv.de/media/templates/site/cassiopeia_cassiopeia_dafv/fonts/poppins-v20-latin-regular.eot'); src: url('https://www.dafv.de/media/templates/site/cassiopeia_cassiopeia_dafv/fonts/poppins-v20-latin-regular.eot#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('https://www.dafv.de/media/templates/site/cassiopeia_cassiopeia_dafv/fonts/poppins-v20-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('https://www.dafv.de/media/templates/site/cassiopeia_cassiopeia_dafv/fonts/poppins-v20-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('https://www.dafv.de/media/templates/site/cassiopeia_cassiopeia_dafv/fonts/poppins-v20-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('https://www.dafv.de/media/templates/site/cassiopeia_cassiopeia_dafv/fonts/poppins-v20-latin-regular.svg#Poppins') format('svg'); font-display: swap; font-family: 'Poppins'; font-style: normal; font-weight: 400}


h1, .h1,
h2,
.h2,
h3,
.h3,
h4,
.h4,
h5,
.h5,
h6,
.h6 {
  font-family: "Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-weight: 700;
}

body {
    font-family: "Lato" !important;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #383838;
    /* background: #efefef; */

}

/* Unterstreichung bei verlinkten Überschriften entfernen und silbentrennung aktivieren */
.item-title a{
 text-decoration: none;
  hyphens: auto;
}

/* Silbentrennung im Text aktivieren */
p { hyphens: auto; }

/* Silbentrennung auf allen Karten aktivieren */
.card { hyphens: auto; }

/* cards im container bottom-a umbrechen*/
.grid-child.container-bottom-a {
  flex: 1 content;
}

/* Module auf der Position bottom-a */
.bottom-a.card {
  background: #86bc25;
  text-align: center;
  color: white;
}

.bottom-a.card h3 {
  text-align: center;
  color: white;
}


.bottom-a.card button {
  display: block;
  margin: auto;
  cursor: pointer;
  outline: none;
  border: none;
  background-color: #213a8f;
  border-radius: 2px;
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--text);
  background-size: 100% 100%;
  margin-bottom: 15px;
}

/* Module auf der Position bottom-b */
.bottom-b.card {
  background: white;
  border: var(--card-border-width) solid var(--dafv-green);
}


.bottom-b.card h1 {
  color: #213a8f;
  font-weight: 100;
  font-size: 2rem;
}
.bottom-b.card h3 {
   color: gray-700;
  font-weight: 200;

}

/* Module auf der Position sidebar-right */

.sidebar-right h3 {
	color: #213a8f;
    text-align: center;
}



/*.carousel-caption {
	bottom: 1.25rem;
	color: #fff;
	left: 5%;
	padding-bottom: 1.25rem;
	padding-top: 1.25rem;
	position: absolute;
	right: 65%;
    top:15%;
    bottom:15%;
	text-align: center;
  background-color: rgba(var(--template-bg-dark-75), 0.75);}*/

.carousel-caption {
	bottom: 0.25rem;
	color: #fff;
	left: 15%;
	padding-bottom: 0rem;
	padding-top: 0rem;
	position: absolute;
	right: 15%;
  top:2%;
  bottom:70%;
  border-radius: 2rem;
	text-align: center;
  background-color: rgba(var(--template-bg-dark-75), 0.75);
}
  

.carousel-caption h1 {
  text-shadow:
    4px 4px 5px black,
    0 0 1rem var(--gray-800),
    0 0 0.4rem var(--gray-800);
  }

.carousel-caption h4 {
  text-shadow:
    4px 4px 5px black,
    0 0 1rem var(--gray-800),
    0 0 0.4rem var(--gray-800);
  }



/* VIDEO BANNER - see https://codepen.io/woluweb/pen/rNGROZj */
div.video-banner {
    display: grid;
    grid-template-areas: "hero";
    place-items: center;
    height: max(300px, calc(100vh - 152px)); /* viewport height minus the fixed height of menu header on current website, with a minimum of X pixels */
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.5);
}
div.video-banner > * {
    grid-area: hero; /* stacking all the child elements of the grid - could simply have set 1 / 1 / 2 / 2 instead of naming the area hero */
}
div.video-banner div.text {
    z-index: 1; /* to be sure that this is on top of the video */
    text-align: center;
    color: white;
    text-shadow: 2px 2px 5px black;
}
div.video-banner div.overlay {
    width: 100%;
    height: 100%;
    background-image: linear-gradient(120deg, var(--cassiopeia-color-link), var(--cassiopeia-color-hover));
    opacity: 0.7;
}
div.video-banner video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    overflow: hidden;
}