body {
 background-image: url("images/hintergrund_infopage_hell.jpg");
 background-repeat: no-repeat;
 background-color: #d5deda;
 background-size: 100%;
}

@font-face {font-family: "Calendas-Plus";
  src: url("Calendas-Plus.woff2") format("woff2"), /* chrome、firefox */
  url("Calendas-Plus.woff") format("woff"), /* chrome、firefox */
  url("Calendas-Plus.ttf") format("truetype"); /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
}

#map {
  height: 50%;
  min-height: 300px;
  max-height: 650px;
  width: 80%;
  min-width: 300px;
  max-width: 650px;
  border: 2px solid;
  padding: 10px;
  margin-right: 3.33333%;
  box-shadow: 5px 10px #0f725c;
  box-sizing: border-box;
  margin: 10px;
}

#locationbox {
  float: left;
  width: 30%;
  min-width: 350px;
  border: 2px solid;
  padding: 10px;
  margin-right: 3.33333%;
  box-shadow: 5px 10px #0f725c;
  box-sizing: border-box;
  margin: 10px;
  background-color: #d5deda;

}

#infotextbox {
  float: center;
  width: 80%;
  min-width: 500px;
  max-width: 650px;
  border: 2px solid;
  padding: 20px;
  margin-right: 3.33333%;
  box-shadow: 5px 10px #0f725c;
  box-sizing: border-box;
  margin: 10px;
 background-color: #d5deda;

}

#fontdesign{
	font-size: 1em;
	color: #0f725c;
	font-family: 'Calendas-Plus';
	font-weight: 600; 
    text-shadow: 1px 1px 0px #bf8260, 
                 2px 2px 0px #e6d7cf;
}

.container{
	position: relative;
}

.heart {
  position:relative;
  width: 33%;
  min-width: 200px;
  max-width: 300px;
  aspect-ratio: 1;
  border-image: radial-gradient(#ff5c00 69%,#0000 70%) 84.5% fill/100%;
  clip-path: polygon(-41% 0,50% 91%, 141% 0);
  text-align: center;
  margin:auto;
  z-index:1;
}
.heartinside {
  position: absolute;
  top: 10%;
  width: 100%;
  margin:auto;
  z-index:2;
}

@media	only screen and (-webkit-min-device-pixel-ratio: 1.3),
	only screen and (-o-min-device-pixel-ratio: 13/10),
	only screen and (min-resolution: 120dpi)
	{
.heartinside h3{
  font-size: 2em;	
}
	}

.heartinside h3{
  font-size: 1.3em;	
}