/**
 * Costumize Layout
 *
 * W. Nagy
 *
 */

html {
   width:100%;
   height:100%;
   }

@font-face {
    font-family: 'ppoe-font-emphasis';
    src: url('/font/gloria-hallelujah-v24-latin-regular.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
    font-display: swap; /* Sorgt für schnellere Ladezeiten */
}

@font-face {
    font-family: 'ppoe-font';
    src: url('/font/KumbhSans-VariableFont_YOPQ,wght.ttf') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap; /* Sorgt für schnellere Ladezeiten */
}

.fade-in-image {
  /* Startzustand: unsichtbar */
  opacity: 0; 
  
  /* Name der Animation, Dauer (2 Sekunden), Art des Verlaufs, bleibt am Ende sichtbar */
  animation: fadeIn 2s ease-in-out forwards;
}

/* Definition der Animation */
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

body, h1, h2, h3, h4, h5, h6 {
  font-family: ppoe-font,sans-serif;
  max-width:1024px;
  margin:auto;
}



h1,h2 a {
  color:#9d2632;
  font-family: ppoe-font,sans-serif;
}

a {
   text-decoration-line: underline;
}


h2, h3, h4, h5, h6 {
  color:#4D4F5A;
}

form {
   display:inline-block;
   }


.close-icon{
   position:absolute;
   top:16px;
   right:16px;
   width:40px;
   height:40px;
   }

.reload-icon{
   width:40px;
   height:40px;
   position:absolute;
   top:16px;
   right:60px;
   }

.close-icon::after {
   font-size:150%;
   font-weight:bold;
   content:"\1F5D9";
   }

.reload-icon::after {
   font-size:150%;
   font-weight:bold;
   content:"\27F3";
   }

.goback::after {
   content:"\25C1 Zurück";
   }

.edit-icon::after {
   content:"\25B7";
   }

.delete-icon::after {
   content:"\2715";
   }

.save-icon::after {
   content:"\2714";
   }



.vspacer-1{line-height:1px;}
.vspacer-2{line-height:2px;}
.vspacer-4{line-height:4px;}
.vspacer-8{line-height:8px;}
.vspacer-16{line-height:16px;}
.vspacer-32{line-height:32px;}
.vspacer-64{line-height:64px;}

.vspacertr-1{height:1px;}
.vspacertr-2{height:2px;}
.vspacertr-4{height:4px;}
.vspacertr-8{height:8px;}