/*
Theme Name: Nikkon Child
Theme URI: https://augenblicke.ernst-suter.ch/ueber-mich/
Template: nikkon
Author: Ernst Suter
Author URI: http://augenblicke.ernst-suter.ch
Description: BLOG meiner Augenblicke
Tags: augenblicke,portfolio,galerien, foto,blog,kunst,fotografie,themenfotografie,kunstfotografie,kultur,informationen,design,premium,
Version: 10.5.2.1763380807
Updated: 2025-11-17 13:00:07

/*--- für die Sortierung zuständig für neue Browser foldergalerie BING 
.nikkon-side-social-round.onright a.social-icon {
    transition: all 0.3s ease-in-out;
}*/

/* ---------------------------------------------------------
   ROTER RAHMEN zum zeigen, dass CSS geladen wird
   --------------------------------------------------------- 
body {
  border: 10px solid red !important;
}
*/

/* kunst traum BLOG HG ändern */
body.postid-25674 {
background-image: url("https://augenblicke.ernst-suter.ch/wp-content/uploads/2025/09/background_traum-3-3600-scaled.jpg"); 
background-repeat: no-repeat; /* sorgt dafür, dass das Bild nicht wiederholt wird */
background-attachment: fixed; /* sorgt dafür, dass das Bild nicht mitscrollt */
}

/* jubi-BLOG-25 HG ändern */
body.postid-24704 {
background-image: url("https://augenblicke.ernst-suter.ch/wp-content/uploads/2025/05/hg_25-beige-verlauf-scaled.jpg"); 
background-repeat: no-repeat; /* sorgt dafür, dass das Bild nicht wiederholt wird */
background-attachment: fixed; /* sorgt dafür, dass das Bild nicht mitscrollt */
}

/* blog_12-25 HG ändern */
body.postid-26180 {
background-image: url("https://augenblicke.ernst-suter.ch/wp-content/uploads/2025/11/hg_blog12-25-2-scaled.jpg"); 
background-repeat: no-repeat; /* sorgt dafür, dass das Bild nicht wiederholt wird */
background-attachment: fixed; /* sorgt dafür, dass das Bild nicht mitscrollt */
}

/* art-basel-25 einzelner HG ändern */
body.postid-25224 {
background-image: url("https://augenblicke.ernst-suter.ch/bilder/hg - vor den toren der art-basel.jpg"); 
background-repeat: no-repeat; /* sorgt dafür, dass das Bild nicht wiederholt wird */
background-attachment: fixed; /* sorgt dafür, dass das Bild nicht mitscrollt */
}

/* art-basel-25 Handy HG entfernen */
@media only screen and (max-width: 768px) {
  .postid-25224 {
    background: none !important;
  }
}

/* ganz in weiss einzelner HG ändern */
body.postid-26051 {
background-image: url("https://augenblicke.ernst-suter.ch/bilder/hg-ganz in weiss.jpg"); 
background-repeat: no-repeat; /* sorgt dafür, dass das Bild nicht wiederholt wird */
background-attachment: fixed; /* sorgt dafür, dass das Bild nicht mitscrollt */
}
/* einzelne Beitrag Titel löschen */

/*  --------------------------------------------------------*/
/*    einzelne Beitrag Titel löschen */
/* ---------------------------------------------------------*/
.postid-25224 .entry-title,
.postid-26051 .entry-title,
.postid-14845 .entry-title,
.postid-26180 .entry-title,
.postid-24704 .entry-title,
.postid-25674 .entry-title {
display: none !important;
}


/*  --------------------------------------------------------*/
/* Seitentitel auf Seite 26622 & 2
mit REMOVE PAGE TITLE ausgeblendet */
/*  --------------------------------------------------------*/
/*--- # Typography */
body,
button,
input,
select,
textarea {
  color: #505050;
  font-size: 16px;
	font-family: Verdana;
  line-height: 1.5;
}

/* Footer Anpassung  */
.site-footer-bottom-bar {
  background: transparent 100%;
  border-top: 1px solid rgba(0, 0, 0, 0.6);
	color: #999;
		font-size: 18px;
	  font-weight: 530;
	  letter-spacing: 2px;
	  word-spacing: 1.9em;
		text-transform: uppercase;
}

/* Farbe einstellbar bei Themeeinstellung colors*/
.site-title {
    margin: 0;
    padding: 2px 0px 0px;
    font-size: 43px;
	  font-weight: 300;
	  letter-spacing: 7px;
	  word-spacing: 0.5em;
    text-transform: uppercase;
	  text-shadow: #999 0.16em 0.15em 0.16em;
}

/* font main-navigation */
.main-navigation {
	font-size:17px;
	letter-spacing: 2px;
}

/* --- h1 - Titel mit Schatten */
h1 {
    font-family: sans-serif;
    margin: 25px 0px 15px 0px;
    padding: 0 0 0px;
    font-size: 22.5px;
    line-height: 20px;
    font-weight: 500;
    text-transform: uppercase;
	  letter-spacing: 0.8px; 
    color: #000000;
	  text-transform: uppercase;
	  text-shadow: #aaa 0.15em 0.15em 0.16em;
}


/* --- h4 - untertitel mit Schatten */
h4 {
    font-family: sans-serif;
    margin: 20px 0px 15px 0px;
    padding: 0 0 0px;
    font-size: 18.5px;
    line-height: 20px;
    font-weight: 500;
    text-transform: uppercase;
	  letter-spacing: 0.8px; 
    color: #9d4f3d;
	  text-transform: uppercase;
	  text-shadow: #aaa 0.15em 0.15em 0.16em;
}

.ki  {
	font-size: 19px;
	color: #9d4f3d;
}

/* --- Site-Description mit Schatten */
.site-description {
    margin: 20px 0px 15px 0px;
    padding: 0 0 0px;
    font-size: 19px;
    line-height: 20px;
    font-weight: 500;
    text-transform: uppercase;
    color: #9d4f3d;
	  text-transform: uppercase;
	  text-shadow: #aaa 0.15em 0.15em 0.16em;
}

/* --- Seitentitel Blog bei Gutenberg Template ------------------ */
.entry-header .entry-title {
  margin: 10px 0px 20px;
	text-align: left;
	font-size: 28px;
	font-weight: 300;
  color: #000000; 
  text-shadow: #888888 0.15em 0.15em 0.16em
}

/* --- Seitentitel mit Schatten */
h3.entry-title {
	font-size: 25px;
	font-weight: 500;
  color: #1519a8; 
  text-shadow: #888888 0.15em 0.15em 0.16em
}

/* --- Bildbeschreibung */
.bildbeschreibung {
  font-size: 15px;
  color: #000000; 
}

/* --- Link */
.link {
  font-size: 15px;
  color: #0b1bb4; 
  text-decoration: underline green;
}

/* Titelbild Beitrag mit Schatten */
.schatten-titelbild {
box-shadow: 8px 8px 14px #999;
	border-radius: 15px;
}

/* --- alle Bilder abgerundet --- */
img {border-radius: 15px;}
/* --- Bilder mit Rahmen good news */
.img-good {
padding: 5px;
border-radius: 5px;
border-bottom: 2px solid #ababab;
border-right: 2px solid #ababab;
border-top: 2px solid #ababab;
border-left: 2px solid #ababab;
}

/* --- Bilder mit Rahmen allgemein */
.img {
border-color: #dcdcdc;
border-width: 2px;
border-style: solid;
}

/* --- Bilder ohne Rahmen class */
.ohne-border {
border-width: 0px;
border-style: none;
}
/* ----   li ul (menue) --- */
ul,
ol {
     margin-left: 3em;
}

ul {
    list-style: disc;
}

ol {
    list-style: decimal;
}

li > ul,
li > ol {
    margin-bottom: 0;
    margin-left: -1em;
}

/* ----   content breite --- */
.site-container {
  max-width: 95%;
  margin: 0 auto;
  padding: 0 0;
}

/* ---- Abstand Linie ----- */
.abstand-linie {
       	border: 0;
	height: 2px;
	background-image: linear-gradient(to right,
	rgba(0,0,0,0),
	rgba(0,0,0,0.75),
	rgba(0,0,0,0)); 
}

/* Blogliste Kategorien ausblenden */
.entry-footer {
display:none;
}

/* Bloglist Entry Meta komplett ausblenden für Single und Archive */
.entry-meta, .site-header.featured-image .site-featured-image .entry-header.has-discussion .entry-meta, .entry .entry-footer {display:none;}
/* Header Seite 2024 ausblenden */
.page-id-16551 header {display: none;
}

/* Blog vor- zurück von Nikkon */
@media screen and (max-width: 781px) {
    .wp-container-core-columns-layout-2.wp-container-core-columns-layout-2 {
        flex-wrap: nowrap !important;
    }
}
table   {
	border-left: 3px solid #000000;
	border-right: 0px none;
  border-bottom: 0px;
	border-top: 0px;
}

/* Accordion Auswahltitel*/
.accordi {
    text-transform: uppercase;
	 margin: 20px;
    padding: 0 0 2px;
    font-size: 15px;
    line-height: 16px;
    font-weight: 400;
    color: #2d52be;
}

/* Cover volle Breite bei Nikkon */
.fullwidth-img {
  width: 100vw;
  max-width: none;
  margin-left: calc(-50vw + 50%);
  display: block;
}

/* Back to Top Button mit Font Awesome Icon */
#back-to-top {
  position: fixed;         									 /* bleibt beim Scrollen fixiert */
  bottom: 40px;            									 /* Abstand vom unteren Rand */
  right: 20px;             									 /* Abstand vom rechten Rand */
  background: #888;         									/* Hintergrundfarbe des Kreises */
  width: 40px;             									 /* Breite des Kreises */
  height: 40px;             									/* Höhe des Kreises */
  border-radius: 50%;      									 /* macht den Button rund */
  box-shadow: 0 2px 6px rgba(0,0,0,0.3); 					/* Schatten */
  z-index: 9999;            									/* sorgt dafür, dass er über allem liegt */
  transition: background 0.3s, transform 0.2s; 					/* Animation */
  cursor: pointer;

  display: flex;            									/* Icon zentrieren */
  align-items: center;
  justify-content: center;
  color: #fff;             										 /* Icon-Farbe */
  font-size: 20px;         									 /* Icon-Größe */
}

/* Hover-Effekt */
#back-to-top:hover {
  background: #0000FF;         /* Farbe beim Überfahren */
  transform: scale(1.1);    		/* leichte Vergrößerung */
}

/* ---------------------------------------------------------
   CONTAINER FÜR ALLE ENGEL
   --------------------------------------------------------- */
.engel-container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;   /* Engel blockieren keine Klicks */
  z-index: 0;             /* hinter dem Inhalt */
}

/* ---------------------------------------------------------
   EINZELNER ENGEL
   --------------------------------------------------------- */
.engel {
  position: absolute;
  width: 120px;
  height: 120px;
  background-image: url('https://augenblicke.ernst-suter.ch/wp-content/uploads/2025/11/engel.png');
  background-size: contain;
  background-repeat: no-repeat;
  opacity: 0.9;

  /* Animation ERZWINGEN (Nikkon blockiert Animationen) */
  animation-name: schweben !important;
  animation-timing-function: linear !important;
  animation-iteration-count: infinite !important;

  will-change: transform;
}

/* ---------------------------------------------------------
   SCHWEBE-ANIMATION OHNE PAUSE
   Engel fliegen durchgehend von links nach rechts
   und erscheinen sofort wieder links.
   --------------------------------------------------------- */
@keyframes schweben {
  0% {
    transform: translateX(-10vw) translateY(0);
  }
  25% {
    transform: translateX(20vw) translateY(-2vh);
  }
  50% {
    transform: translateX(50vw) translateY(2vh);
  }
  75% {
    transform: translateX(80vw) translateY(-2vh);
  }
  100% {
    transform: translateX(110vw) translateY(0);
  }
}
