/*** Allgemein ***/
.pink {
  color: #ff74e0;
}

body {
  font-size: 0.95rem;
  color: #555454;
  font-family: Verdana, Geneva, Tahoma, sans-serif;
}

.adresszeile {
  text-align: right;
  font-size: 0.8rem;
}

#corona {
  background-color: #ff74e0;
  padding: 14px;
  border: dotted;
  text-align: center;
  border-radius: 1.3rem;
}

.babypause {
  color: #fff;
  font-size: 0.9rem;
}

/*** Linkleiste Start ***/
ul.start li {
  list-style-type: none;
  /**font-size: 15px;**/
  /*margin-bottom: 40px;*/

  margin-bottom: 30px;
  /*padding-left: 10px;*/
  padding: 2px 10px 4px 10px;
}

/* Seitenmenü auf Handy mittig*/

@media (max-width: 460px) {
  .colstart {
    margin-left: -20px;
    text-align: center;
  }
}

ul.start li:hover {
  background-color: #faecf7;
}

ul.start li a.active,
ul.start li a:hover {
  color: #ff74e0;
}

ul.start li a {
  text-decoration: none;
}

a.active,
a:hover {
  color: #ff74e0 !important;
}

/*** Navigation ***/
.nav-link.active,
.nav-link:hover {
  color: #ff74e0 !important;
}

/*** Card ***/

@media (min-width: 1024px) .col-sm-4 {
  flex: 0 0 auto;
  width: 33.3333333333%;
}

.card-image {
  height: 400px;
  background-size: cover;
  background-position: center;
}

.card-body {
  border: 0;
}
@media (min-width: 991px) .container, .container-md, .container-sm {
  max-width: 720px;
}

/*** Beadcrumb ***/

a {
  color: gray !important;
}

.nav-item.active,
.nav-item:hover {
  color: #ff74e0 !important;
}

/*** Kontaktformular iframe Höhe ***/
/*** iframe ***/

.framecf iframe {
  width: 100%;
  height: 640px;
}

@media (max-width: 800px) {
  .framecf iframe {
    width: 100%;
    min-height: 1100px;
  }
}

/*** info start ***/

.infotext {
  font-size: 0.75rem;
  /*font-style: italic;*/
}

/*** Adresszeile ***/
.adresszeile {
  color: #7c7b7b !important;
}

/** Kontaktformular **/
#content fieldset.referenzen {
  padding: 20px 5px 5px 5px;
  border: 3px solid #b5d3d5;
  margin-bottom: 10px;
}

#content fieldset.referenzen legend {
  padding-bottom: 5px;
  margin-top: 5px;
}

#content ul li {
  margin-left: 50px;
}

/*** Bildergalerie ***/

/* BASIC STYLES
–––––––––––––––––––––––––––––––––––––––––––––––––– */
:root {
  --lightbox: #242424;
}

/*** body {
  margin: 24px 0 48px;
  font: 20px / 28px "Marck Script", cursive;
}
 **+/
/* IMAGE GRID STYLES
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.image-grid figure {
  margin-bottom: 0;
}

.image-grid img {
  box-shadow: 0 1rem 1rem rgba(0, 0, 0, 0.15);
  transition: box-shadow 0.2s;
}

.image-grid a:hover img {
  box-shadow: 0 1rem 1rem rgba(0, 0, 0, 0.35);
}

/* LIGHTBOX STYLES
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.lightbox-modal .modal-content {
  background: var(--lightbox);
}

.lightbox-modal .btn-close {
  position: absolute;
  top: 20px;
  right: 18px;
  font-size: 1.2rem;
  z-index: 10;
}

.lightbox-modal .modal-body {
  display: flex;
  align-items: center;
  padding: 0;
  text-align: center;
}

.lightbox-modal img {
  width: auto;
  max-height: 100vh;
  max-width: 100%;
}

.lightbox-modal .carousel-caption {
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(36, 36, 36, 0.75);
}

.lightbox-modal .carousel-control-prev,
.lightbox-modal .carousel-control-next {
  top: 50%;
  bottom: auto;
  transform: translateY(-50%);
  width: auto;
}

.lightbox-modal .carousel-control-prev {
  left: 10px;
}

.lightbox-modal .carousel-control-next {
  right: 10px;
}

div .pfeil {
  position: relative;
  margin-bottom: 50px;
  margin-right: 50px;
}

/*
hr{

  border: 0;
  
  height: 5px;
  
  background-image: linear-gradient(to right,
  
  rgba(0,0,0,0),
  
  rgba(0,0,0,0,75),
  
  rgba(0,0,0,0)) !important;
  
  }
  */

/* Slogen-Größe  */
span.slogan {
  font-size: small !important;
}

/*impressumbild im Content ausblenden für Handy*/

@media (max-width: 780px) {
  .impressumbild {
    display: none;
  }
}

.babyrosa {
  background-color: #faecf7;
}

@media (max-width: 780px) {
  .babyrosa {
    border-radius: 0rem !important;
  }
}

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

a {
  text-decoration: underline;
  text-decoration-line: underline;
  text-decoration-thickness: initial;
  text-decoration-style: initial;
  text-decoration-color: initial;
}

/* Zusatznavigation */
div .babyrosa a:hover {
  /*background-color: rgb(240, 240, 240);*/
  text-decoration: underline rgb(207, 206, 206);
  text-decoration-thickness: 3px;
  text-underline-offset: 0.5em;
}