@charset "utf-8";
/* CSS Document */
* { box-sizing: border-box;}

html {
    --bodyBg: #3E4149;
    --lightgrey: #555a65;
    --lightlightgrey:#CACACA;
    --anthracite: #27282D;
    --gold: #B17A50;
    --rosegold: #C99383; color: #C99383;
    --pink: #D8B2A7;
    --button_bg: #555A65;
    --button_hover: #B17A50;
    --black: #000000;
}

Body {
	font-family: "Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	font-size: 14px;
	line-height: 1.71429;
	font-weight: 400;
	letter-spacing: 0;
	color: var(--rosegold);
	background-color: var(--bodyBg);
	-webkit-text-size-adjust: none;
	-webkit-font-smoothing: subpixel-antialiased;
}

.text-primary, .text-secondary {
	font-family: "Mangaba", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    color: var(--rosegold);
}
.text-secondary-1 {
	font-family: "Mangaba", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	color: var(--lightlightgrey);
}

.wurfplanung {
    background-image:url(../images/vent_de_soie/Hunde/E54B8198Web.jpg);
}

.flex-container {
  display: flex;
  /*flex-direction:column;*/
  flex-wrap: wrap;
  /*width:28%;*/
  justify-content:space-evenly;
  align-content: stretch;
  overflow: auto;  
  flex: 1 1 90%;
  max-width: 100%;
}
    

    
.flex-container > div {
  width: 25%;
  border-width: 4px;
  border-line:2px;
  border-color: white;
  border-style: double;
}
.flex-container div img {
  width:80%;
}
.flex-container div span {
  width: 100px;
  font-size: 36px;
  line-height: 1.2;
  letter-spacing: 0.005em;
  font-family: "Mangaba", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  display: inline-block;
}

/* Responsive layout - makes a two column-layout instead of four columns */
@media (max-width: 800px) {
  .column, .flex-container {
    flex: 0 0 50%;
    max-width: 50%;
  }
}
/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media (max-width: 600px) {
  .column, .flex-container {
    flex: 0 0 100%;
    max-width: 100%;
  }
}

#dasRudel h2 { color: var(--lightlightgrey);  }


/*.rd-navbar-modern.rd-navbar-static .rd-nav-link {letter-spacing: 1em;}*/