/*
 Theme Name:   GeneratePress Child
 Theme URI:    https://generatepress.com
 Description:  Default GeneratePress child theme
 Author:       Tom Usborne
 Author URI:   https://tomusborne.com
 Template:     generatepress
 Version:      0.1
*/
/*Barrierefreiheit*/
/*Tastatureingabe*/
*:focus:not(:focus-visible) {
    outline: none;}
*:focus-visible {
outline: 3px !important; outline-style: solid !important; outline-color: grey !important; color: black !important; background-color: #f0f0f0; border-radius: 0px !important;}

/*Navigation angepasst*/
.main-navigation .main-nav ul li a, .site-info a {position: relative; z-index: 10;}
.site-branding, .main-navigation {z-index: 100;}
	
.main-nav li {margin-right: 8px;}
.main-navigation .main-nav ul li a {padding-bottom: 2px; border-radius: 5px;}
.icon-search {margin-top: 10px; margin-right: 6px;}
@media(max-width: 768px){.icon-search {margin-right: 70px; margin-bottom: 24px; font-size: 1.4rem;}}

/*Header / Footer Abstände schick*/
@media (min-width: 769px){
.main-title {margin-top: 20px !important;}
.menu-toggle {margin-left: -130px; margin-top: 7px;}
	body {--gp-slideout-width:50vw;}}

/*Burger-Menu größer bei kleineren Bildschirmen*/.main-navigation .menu-toggle {font-size: 1.6rem;}

/*Angeheftete Navigation*/
.main-navigation.navigation-stick.has-sticky-branding {color: white!important; background: #2b2a33; opacity: 0.8; padding-top: 3px; padding-right: 0px; padding-left: 10px; padding-bottom: 3px;}
.main-navigation.sticky-navigation-transition .main-nav > ul > li > a:hover {color: white !important;}
.main-navigation.sticky-navigation-transition .main-nav > ul > li > a {color: white !important; background: none;}
.main-navigation.has-sticky-branding.navigation-stick .menu-toggle {padding-top: 8px; color: white; font-size: 1.6rem;}
@media (min-width: 1200px){
	p.main-title a {min-width: 150px; display: flex;}}
/*Ende angeheftete Navigation*/

/*Handy Navigation Typo mehr Luft*/	
	#generate-slideout-menu .slideout-menu li {margin-top: 50px; margin-left: 50px; padding-left: 5px;}

/*Überschriften zu Mengentext ausrichten*/
@media (min-width: 1200px){
h1 {margin-left: -5px;}
	h2 {margin-left: -3x;}}
.buttons {margin-left: -0px; font-family: Poppins;}

/*Blog-Styling*/
.page-header {z-index: 30;}
.term-ingas-blog {display: none;}
.gb-query-page-numbers-d522cd75 .page-numbers {padding-right: 1.37em!important; padding-left: 1.37em!important; border-radius: 100%; border-color: grey; border-width: 2px;}
.gb-query-page-numbers-d494ee7d .page-numbers {padding-right: 1.37em!important; padding-left: 1.37em!important; border-radius: 100%; border-color: grey; border-width: 2px;}

/*Manche Bilder grau (violett-Stich rausgezogen*/
.grayscale {
    -webkit-filter: grayscale(0.7);
    filter: grayscale(0.7);}

/*Schreib mir Aufforderung vorm Footer Bilder je nach Breite ausblenden*/
@media (min-width:768px) and (max-width: 1280px){
	.bildinga {display: none;}
	.bildingawidth {width: 25vw;}}
@media (min-width:768px) and (max-width: 1024px){
	.bildingawidth {width: 33vw;}}
/*Über mich Bildreihe sw ausgeblenden bei kleineren Ansichten*/
@media (min-width:1024px) and (max-width: 1280px){
	.bildreihe {display: none;}}
/*Ende Abstände schick*/

/*Text bunt*/
.site-description, .fade-in-color {
  background-clip: text;
  background-image: linear-gradient(to right, rgba(93, 88, 142,1) 0%, rgba(250,0,193,1) 100%);}
.copyright-bar {
  background-clip: text;
  background-image: linear-gradient(to right, rgba(93, 88, 142,1) 0%, rgba(250,0,193,1) 100%);
	color:#bbb;}
/*End Text bunt*/

/*Fade in Text-Effekt*/
.fade-in-text {
  animation: fadeIn 3s;
	-webkit-animation: fadeIn 3s;
  -moz-animation: fadeIn 3s;
  -o-animation: fadeIn 3s;
  -ms-animation: fadeIn 3s;}
@keyframes fadeIn {
  0% {opacity: 0;}
  100% {opacity: 1;}}	
@-moz-keyframes fadeIn {
  0% { opacity: 0; }
  100% {opacity: 1;}}
@-webkit-keyframes fadeIn {
  0% {opacity: 0;}
  100% { opacity: 1;}}
@-o-keyframes fadeIn {
  0% {opacity: 0;}
  100% {opacity: 1;}}
@-ms-keyframes fadeIn {
  0% {opacity: 0;}
  100% {opacity: 1;}
}/*End Fade in Text*/

/*Drehung Icons bei Hover*/
@keyframes rotating {
	0% {rotate: 0;}
	100% {rotate: 1turn;}}
.drehung .gb-icon:hover {
	animation: rotating 0.8s ease-in-out;} 
.page-numbers:hover {
	animation: rotating 0.8s ease-in-out;} 
.generate-back-to-top:hover {
	animation: rotating 1s ease-in-out;}
.navigation-branding img:hover {
	animation: rotating 1.2s ease-in-out;}
/*End Drehung bei hover*/

/*Dinge schräg stellen*/
.rotate {transform: rotate(15deg);}
.rotate2 {transform: rotate(270deg);}

/*Regenbogen in Button*/
@media (min-width: 350px) {
  .btn {position: relative;
    z-index: 1; /* Text über das ::before-Pseudoelement bringen */

    &::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      height: 100%;
      width: 5px; /* Startbreite */
      background: linear-gradient(to right, grey 6px, rgba(93, 88, 142, 1) 0%, rgba(250, 0, 193, 1) 100%);
      transition: all 0.85s cubic-bezier(0.68, -0.55, 0.265, 1.55);
      border-radius: 50px;
      z-index: -1; /* Hintergrund hinter den Text */
    }

    &:hover::before {
      width: 100%; /* Breite auf 100% erhöhen */
      background: linear-gradient(to right, rgba(93, 88, 142, 1) 0%, rgba(250, 0, 193, 1) 100%);
      opacity: 0.7;
    }}

  /* Regenbogen Navigation */
  .btn2 {
    position: relative;
    z-index: 1; /* Text über das ::before-Pseudoelement bringen */

    &::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      height: 100%;
      width: 3px; /* Startbreite */
      background: linear-gradient(to right, grey 5px, rgba(93, 88, 142, 1) 0%, rgba(250, 0, 193, 1) 100%);
      transition: all 0.85s cubic-bezier(0.68, -0.55, 0.265, 1.55);
      border-radius: 50px;
      z-index: -1; /* Hintergrund hinter den Text */
    }

    &:hover::before {
      width: 100%; /* Breite auf 100% erhöhen */
      background: linear-gradient(to right, rgba(93, 88, 142, 1) 0%, rgba(250, 0, 193, 1) 100%);
      opacity: 0.7;
    }}}

/*Unterstrichene Links im Mengentext*/
.btn3 {
	position: relative;
    z-index: 1; /* Text über das ::before-Pseudoelement bringen */
	&::before{
		transition: all 0.85s cubic-bezier(0.68, -0.55, 0.265, 1.55);
		content: '';
		height: 20%;
		background: grey;
		position: absolute;
		margin-top: 1.1em;
		top: 0;
		left: 0;
		z-index: -1; /* Hintergrund hinter den Text */
	}
		 		
	&::before{
		border-radius: 50px;
		width: 0px;
		background: linear-gradient(to right, grey 5px, rgba(93, 88, 142,1) 0%, rgba(250,0,193,1) 100%);}
	
	&:hover{
		&::before{
		background: linear-gradient(to right, rgba(93, 88, 142,1) 0%, rgba(250,0,193,1) 100%);
		width: 100%;
		opacity: 0.7;
		z-index 0 !important;}
		}}

/*Social Media grau bei hover*/
	.gb-icon a:hover {border-radius: 30px; color: white !important; background-color: #f0f0f0 !important;}

/*keine Verschiebungen rechts links über den sichtbaren Bereich hinaus*/
body {overflow-x: hidden;}

/*neue Lightbox von WordPress (im Bildwidget) Background dunkel*/
.wp-lightbox-overlay .scrim {background-color: #2b2a33 !important; opacity: 0.8;}

/*Automatische Silbentrennung im Mengentext*/
p {
   -moz-hyphens: auto;
   -o-hyphens: auto;
   -webkit-hyphens: auto;
   -ms-hyphens: auto;
   hyphens: auto;}

/* LISTENPUNKTE in CD Farbe, Listen linksbündig ausrichten*/
ul li::marker, 
ol li::marker  {
  color: #2b2a33; text-align: right;}

ul li {text-align: left;}
.site-content li {margin-left: -30px;}
/*End LISTENPUNKTE*/

/*SCROLLBALKEN anpassen*/
/* width */
::-webkit-scrollbar {
  width: 15px;
}
/* Track */
::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px grey;
  border-radius: 0px;
}
/* Handle */
::-webkit-scrollbar-thumb {
  background: #fff;
  border-radius: 0px;
}
/*Scrollbar Firefox CD-Farbe*/
* {scrollbar-color: #fff #2b2a33;}

/*Back-to-top rund*/
.generate-back-to-top {
    border-radius: 100%;
	line-height: 45px;
	width: 45px;
	z-index: 99;
	!important;}

/*Back-to-top mobil*/
@media(max-width:768px) {
	.generate-back-to-top {margin-bottom: -15px; margin-right: -15px;}
	.inside-site-info {padding-left: 20px; padding-right: 19px; padding-bottom: 30px}
}	
/*Back-to-top Desktop*/
@media(min-width:769px) {
	.generate-back-to-top {margin-bottom: -18px; margin-right: -18px;}}

/*Back to top bei Hover bunt*/
.generate-back-to-top:hover {color: white; background: linear-gradient(to top, rgba(93, 88, 142,1) 0%, rgba(250,0,193,1) 100%); opacity: 0.9;}

	
/*Schriftgrößen*/
.main-navigation a {font-size: clamp(1.125rem, 1.061rem + 0.2927vw, 1.5rem);}
p, ul, li {font-size: clamp(1.125rem, 1.0962rem + 0.1026vw, 1.25rem);}
.buttons {font-size: clamp(1.375rem, 1.2885rem + 0.3077vw, 1.75rem);}
h1 {font-size: clamp(3rem, 0.6616rem + 4.9756vw, 8.125rem); z-index: 10;}
h2 {font-size: clamp(1.5rem, 0.6923rem + 2.8718vw, 5rem);}
h3 {font-size: clamp(1.4375rem, 1.1707rem + 1.2195vw, 3rem);}
h4 {font-size: clamp(1.4375rem, 1.2561rem + 0.8293vw, 2.5rem);}
h5 {font-size: clamp(1.4375rem, 1.2561rem + 0.8293vw, 2.5rem);}
@media (max-width: 768px){
	.main-navigation a {font-size: 1.8rem}
	.inside-site-info a {font-size: 15px !important;}}
h3, h4, h5 {font-weight: bold;}

/*Fontgröße von clamp auf vh für die mobile Ansicht auf der Fotografie-Seite (200 Prozent Vergrößerung, kein overflow)*/
@media (max-width: 768px){
	.allyh2 {font-size: 5.5vh !important;}
	body {--gp-slideout-width:85vw;}
	.main-navigation .main-nav > ul {margin-top: 2vh;}}

/*Burger-Menu (mobiles Menu) WEISS auf der Sartseite zwischen 769px - 1200px*/
@media (min-width: 769px) and (max-width: 1200px){.page-id-7035 .main-navigation .menu-toggle {color: white;}}

/*Suchergebnisseite und nicht gefunden Seite*/
@media(max-width: 768px){
	.page-header > :last-child { padding: 20px;}}
@media(min-width: 769px){
	.page-header > :last-child { padding: 60px; margin-top: -40px;}}
@media (min-width: 769px){
.not-found {margin-top: -40px !important; padding: 50px;}
	.paging-navigation {padding-left: 35px !important;}}

/*Styling Kontaktformular*/
.wpforms-field-label, .wpforms-field-description {font-weight: 400; color: white; margin-left: 3px}
.wpforms-field-description {font-size: 1rem; line-height: 1.3rem; margin-top: 5px;}
.wpforms-field-description a:hover {color: var(--base);}
.wpforms-field-required {border-radius: 30px !important; margin-top: 3px !important;}
input[type="text"]:focus {border: 3px solid;}
input[type="email"]:focus {border: 3px solid;}
textarea:focus {border: 3px solid;}
/*Styling Absenden-Button*/
.wpforms-form input[type=submit],
.wpforms-form button[type=submit] {color: white !important; background-color: #2b2a33 !important; border-radius: 20px !important; margin-top: 25px;}
/*Pfeil im Button*/
.wpforms-submit {display: flex;
  align-items: center;
  justify-content: center; padding-bottom: 0; padding-top: 0; margin-left: 3px;}
.wpforms-form button[type=submit]::after {
content: url(https://kolleginnen.staging-design-netzwerk.eu/wp-content/uploads/2024/11/arrow-right-white.svg); padding-left: 20px; 
 margin-bottom: -4px;}
/*END Styling Button*/

.formdse a {color: #7eaed7;}
.formdse a:focus {color: #2b2a33;}
.formdse a:visited {color: #fff;}
.altEmail_container {color: white;}

.wpforms-hidden {display: none;}
.wpforms-field-large {width: 100%;}
.wpforms-field {padding-bottom: 10px !important; padding-top: 5px;}
.wpforms-error {color: orangered;}
/*END Styling Kontaktformular*/

/*Abstände Infos im Footer*/
@media (max-width: 815px) {
 .inside-site-info {
	 	padding-left: 0px; 
		padding-right: 0px;
    margin-left: -7px;
    margin-right: 0px;
    padding-bottom: 30px;}}

	@media (min-width: 768px) and (max-width: 820px) {
 .inside-site-info {
    padding-left: 45px;
    padding-right: 45px;
    padding-bottom: 30px;}}
.site-info a:focus {padding-top: 2px;}

/* CSS Code, wenn High Contrast im Betriebssystem aktiv */
 @media screen and (forced-colors: active){
h1, h2, h3, h4, h5 {font-family: var(--gp-font--poppins) !important; font-weight: 500! important;}
a	{font-family: var(--gp-font--poppins) !important; font-weight: 600! important;}
a:focus {border-style: solid; border-width: 2px padding: 2px;}
	.site-info, .wpforms-field-label, .wpforms-field-description,  .wpforms-submit {font-size: clamp(1.125rem, 1.0385rem + 0.3077vw, 1.5rem)!important; line-height: 1.5 !important;}}