/*
 Theme Name:	Divi Child
 Theme URI:		https://www.elegantthemes.com/gallery/divi/
 Description:	Divi Child Theme
 Author:		Robert Knasmüller für gedankengut.media
 Author URI:	https://gedankengut.media
 Template:		Divi
 Version:		1.0.1
 Website:		congressmedia.at
*/

 
/* =Theme customization starts here
---------------------------------------------------------------------- */


/* Spot Colours ------------------------------------------------------
	Paragraph: 			#333333
	Türkis:			 	#0069a1
	Links:				#c60086
	BG-Weiß: 			#000000
	BG-Header: Petrol:	#007a98
	Hellblau:			#f8fafc
	BG-Body-Grau hell:	#efefef 
	BG-Body-Grau dunkel:#dedede
	Header-Menü: Gelb:	#ffff00
	

*/

/* style.css Table of Content ----------------------------------------
	XXX In Progress
	100 Header und Navigation
	200 Typografische Settings
	300 Startseite 
 */


/* XXX ********** In progress *******************************************/

@media (max-width: 980px) {
	.pa-open-mobile-menu .et_pb_menu__menu {
		display: flex!important;
	}
	.pa-open-mobile-menu .et_mobile_nav_menu {
		display: none!important;
	}
}


/* Blockquote */

.et_pb_row.row-blockquote {
	background: #0069a1;
	padding: 1em 1em 0em 1em;
}

.cm-quote {
	position: relative;
	/*max-width: 520px;*/
	margin: 0 auto;
	padding-top: 2.5rem;
	padding-bottom: 1.3rem;
	color: #ffffff;
	text-align: center!important;
	font-size:21px;
}

.cm-quote::before {
	content: "“";
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	font-family: 'Manrope', sans-serif;
	font-size: 4.5rem;
	font-weight: 500;
	line-height: 1;
}

.zentriert {
	width: 90%;
	margin-left: auto;
	margin-right: auto;
}

strong {font-weight:600;}




/* Verhindert dass Bildtitel bei Mouseover angezeigt wird */
img[title] {pointer-events: none;}



/**** Refereenzen Logoleiste *********************************/
 
/* Steuert die Spaltenbreite */
.et_pb_column.logo-column {
	background: #f8fafc;
	width: 140px!important;
	height: 140px!important;
	border:1px solid #0069a1;
}

/* Steuert die Textbox (Text-Modul), die bei Mouseover über das Logo gelegt wird. */
.et_pb_text.logo-column {
	background: #f8fafc;
	width: 138px!important;
	height: 138px!important;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 500;
    position: absolute !important;
    top: 50%;
    bottom: auto;
    left: 50%;
    right: auto;
    transform: translateX(-50%) translateY(-50%);
}
	
.vishov {
	opacity: 0;
}

.vishov:hover {
	opacity: 1;
	transition-duration: 1000ms;
}




/*** Header und Footer Smartphone ***/

@media (max-width: 980px) {
	/* Auf Tablet und Smartphone wird das normale Desktop-Menü angezeigt ... */
	.mobile-header-menu .et_pb_menu__menu {
		display: flex!important;
	}
	
	/* ... und das Burger-Menü ausgeblendet */
	.mobile-header-menu .et_mobile_nav_menu {
		display: none!important;
	}
	
	.footer-menu-open .et_pb_menu__menu {
		display: flex!important;
	}
	
	ul#menu-footere-menue-1 {
		flex-direction: column!important;
	}
	
	.et_pb_menu--style-left_aligned .et_pb_menu__wrap {
		justify-content: flex-start!important;
    }

	.footer-menu-open .et_mobile_nav_menu {
		display: none!important;
	}
}

/* XXX ********** In progress END ***************************************/




/* 100 ********** Header, Navigation und Menüs  ********************************/

/* Secondary Menu (ul#menu-secondary-menu) – Icon only */

.pa-open-mobile-menu .et_pb_menu__menu li.menu-icon > a,
ul#menu-secondary-menu > li.menu-icon > a {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: 35px; /* etwas größer */
  height: 35px;

  font-size: 0;
  line-height: 0;

  background-color: #0069a1;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 20px; /* Icongröße */

  border-radius: 50%;
}


/* Icons */

.pa-open-mobile-menu .et_pb_menu__menu li.menu-icon.mail > a, /* Smartphone */
ul#menu-secondary-menu > li.menu-icon.mail > a { /* Desktop und Tablet */
  background-image: url("/wp-content/themes/divi-child/assets/icons/icon-mail.svg");
}

.pa-open-mobile-menu .et_pb_menu__menu li.menu-icon.phone > a, /* Smartphone */
ul#menu-secondary-menu > li.menu-icon.phone > a { /* Desktop und Tablet */
  background-image: url("/wp-content/themes/divi-child/assets/icons/icon-phone.svg");
}

.pa-open-mobile-menu .et_pb_menu__menu li.menu-icon.contact > a, 
ul#menu-secondary-menu > li.menu-icon.contact > a { /* Desktop und Tablet */
  background-image: url("/wp-content/themes/divi-child/assets/icons/icon-contact.svg");
}

/* Hover */
ul#menu-secondary-menu > li.menu-icon > a:hover {
	background-color: #0069a1;
	/*background-color: rgba(20, 184, 166, 0.15);*/
	border-radius: 50%;
}

ul#menu-secondary-menu > li.menu-icon > a:hover {
  background-color: #005785; /* minimal dunkler */
}


/* Secondary Menu – sichtbarer Tastatur-Fokus (DIVI-sicher) */
ul#menu-secondary-menu > li.menu-icon > a:focus,
ul#menu-secondary-menu > li.menu-icon > a:focus-visible {
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(255,255,255,0.85), 0 0 0 6px rgba(0,105,161,0.35) !important;
}


/* Hauptmenü: Hover + Fokus */

ul#menu-hauptmenue > li > a {
  position: relative;
  padding-bottom: 6px;
}


/* Unterstrich */
ul#menu-hauptmenue > li > a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;

  border-bottom: 1px dashed #0069a1;
  opacity: 0;

  transition: opacity 0.2s ease;
}

ul#menu-hauptmenue > li > a:hover::after,
ul#menu-hauptmenue > li > a:focus-visible::after {
  opacity: 1;
}


/* Korrektur von DIVI-Default-Setting: Bei Mouseover veränden sich die Menüpunkte nicht */
/* Bei Mouseover gibt es stattdessen einen Farbwechsel */
/*.et_pb_bg_layout_dark*/
.et_pb_menu ul li a:hover {
	opacity: 1 !important;				/* Transparenz aufheben */
	transition: color .4s ease-in-out;	/* nur Farbe animieren, nicht „all“ */
}


/**** Kontakt-Menü mit DIVI Icons -> Section auf der Startseite ****/

/* UL vertikal stapeln */
.menu-vertical .et-menu {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 8px;  /* Abstand zwischen Items – anpassen */
}


/* Listeneinträge sauber blocken */
.menu-vertical .et-menu > li {
	float: none !important;  /* überschreibt Divi-Defaults */
	display: block;
	margin: 0 !important;    /* horizontale Abstände entfernen */
	width: 100%;
}

/* Link über ganze Zeile klickbar machen (optional) */
.menu-vertical .et-menu > li > a {
	display: block;
	font-size: 18px;
	color: #0069a1;
	width: 100%;
	padding: 10px 14px;      
}

.menu-vertical.et_pb_menu .et_pb_menu__wrap {display:block!important;}

.et_pb_menu--without-logo.menu-vertical .et_pb_menu__menu>nav>ul>li>a:hover {
	color: #c60086 !important; /* = Rosa */
	opacity: 1 !important;				/* Transparenz aufheben */
	transition: color .4s ease-in-out;	/* nur Farbe animieren, nicht „all“ */
}


@media (max-width: 980px) {
	.menu-vertical .et_pb_menu__menu {
		display: flex!important;
	}
	
	.menu-vertical .et_mobile_nav_menu {
		display: none!important;
	}
}


/* Menü-Icons */
.tel-icon a::before,
.mail-icon a::before,
.linkedin-icon a::before {
	font-family: 'ETMODULES';
	color: #007a98;
	font-size: 25px;
	padding-top: 10px;
	padding-right: 10px;
	font-weight:600;
	line-height: 1; /* Einheitliche Linienhöhe für alle Icons */
}


.tel-icon a:hover::before, 
.mail-icon a:hover::before,
.linkedin-icon a:hover::before {
	color: #c60086;
}


.tel-icon a::before {content: '\e090';} /* Menüpunkt Telefon */
.mail-icon a::before {content: '\e076';} /* Menüpunkt E-Mail */
.linkedin-icon a::before {content: '\e0b4';} /* Menüpunkt LinkedIn */


h4.et_pb_toggle_title {padding-top: 5px;}



/* 200 ********** Typografische Settings *******************************/



p {
	padding-bottom:1.0em;
	line-height: 1.4
}

p strong {line-height:1.0;}

p a:hover {border-bottom: 1px dashed #0069a1;}

.footer p a:hover {
	color: #ffff00!important;
	border-bottom: 1px dashed #007a98;
}


blockquote {
    margin: 0;
    border: none;
    padding: 0;
}


h2 {margin-top: 0.6em;}

@media (max-width: 768px) {
	h2 {font-size: 24px!important;}
}


/* AZWs */

.et_pb_text ul {padding-bottom: 1em;}

ul {padding-left: 2em!important;}

ul {
	list-style-type: disc;
	line-height: 24px!important;
	padding: 10px 0px 23px 1em;
	vertical-align: baseline!important;
}

@media (max-width: 400px) {
	ul {padding-left: 15px!important;}
}

li::marker {color: #0069a1;}


/* Scroll to top Icon */
.et_pb_scroll_top.et-pb-icon {
	background: #0069a1;
	font-size:20px;
}


/*
Not in Use:

@media (min-width: 768px) {
	img.alignright,
	img.alignleft {
		width: 25%;
		margin-right: 25px;
	}
}

@media (max-width: 767px) {
	img.alignright {
		display: block;
		float: inherit;
		margin-left:auto;
		margin-right: auto;
		margin-bottom: 20px;
	}
	
	img.alignleft {
		background:#fff!important;
		display: block;
		float: inherit;
		margin-left: 0px;
		margin-bottom: 20px;
	}
}





/* 300 ********** Startseite *******************************************/

@media (min-width: 768px) {
	/* 2-spaltiges Layout im Text-Modul hinterlegt. Die Spalten sollen in etwa gleich hoch sein */
	.three-column-txt {
		column-count: 2;
		column-gap: 30px;
		column-fill: balance;
	}
	
	/* Keine Spaltenwechsel bzw. Trennung innerhalb von Absätzen und AZWs */ 
	.three-column-txt p,
	.three-column-txt  li {
		break-inside: avoid;      /* verhindert Umbruch innerhalb einer Liste */
		page-break-inside: avoid; /* ältere Browser / Print */
	}
	
	/* Absatz + Liste als Block zusammenhalten 
	.three-column-txt .keep-together {
		break-inside: avoid-column;
		page-break-inside: avoid;
	}*/
	
	/* Wenn nach einem p direkt eine ul kommt: Umbruch davor vermeiden 
	.three-column-txt p + ul {
		break-before: avoid-column;
		page-break-before: avoid;
	}*/
		
	/* Und weiterhin innerhalb der Liste nicht trennen 
	.three-column-txt ul {
		break-inside: avoid-column;
		page-break-inside: avoid;
	}*/
}



@media (min-width: 768px) and (max-width: 980px) {
	/* ROW als flex-container darstellen */
	.et_pb_row.two-column-tablet {
		display: flex;
		flex-wrap: nowrap; /* verhindert Umbruch */
		gap: 20px; /* Abstand zwischen den Spalten */
    }

    /* Jede Spalte gleich breit */
	.et_pb_row.two-column-tablet .et_pb_column {
		width: calc(50% - 10px) !important; /* 50% minus halber Gap */
		margin-bottom: 0 !important;
	}
}


/* 300 ********** CF-7  ****************************************/


/*Eingabefeld beginnt in neuer Zeile*/

.wpcf7-form-control-wrap {display:block} 

.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type=password],
.wpcf7 input[type=tel],
.wpcf7 textarea,
.wpcf7 select {
	border-radius:0;
	background-color: #fff;
	border: 1px dotted #0069a1!important;
	padding: 6px;
	width: 100%;
}


input[type="radio"] {
	transform: scale(1.2);
	margin-right: 10px; /* Abstand zum nächsten Element */
}

input[type="checkbox"] {transform: scale(1.2);}

.radio-css .wpcf7-list-item.last {margin-left: 20px;}

input.wpcf7-form-control.wpcf7-file.wpcf7-validates-as-required.file-upload  {
	background: #e5ebef;
	border: 1px solid #e5ebef;
    cursor: pointer;
	padding: 10px;
}


input.wpcf7-form-control.has-spinner.wpcf7-submit,
button.wpcf7cf_prev,
button.wpcf7cf_next {
	border: 1px solid #0069a1;
    background: #0069a1;
    color: #ffffff;
    padding: 12px 12px;
    font-weight: 500;
	width: 200px;
}


input.wpcf7-form-control.has-spinner.wpcf7-submit {margin-top:0.5em;}

input.wpcf7-form-control.has-spinner.wpcf7-submit:hover {opacity: 0.7;}


label {
	font-size: 13px;
    color: #0069a1;
}


.wpcf7-list-item {margin: 0;}


button.wpcf7-form-control.wpcf7cf-togglebutton.wpcf7-togglebutton {
    background: #003B62;
    border: 0;
    padding: 5px 10px 5px 10px;
	margin-left: 1px;
	margin-bottom: -5px;
    color: #ffffff;
}


/* Darstellung der Anzeige, wenn eine Auswahl falsch ist oder fehlt */
.wpcf7-not-valid-tip {
    color: #dc3232;
    font-size: 12px;
    font-weight: 600;
    display: block;
}


/* Erfolgsmessage nach Klick auf submit-Button */
.wpcf7 form.sent .wpcf7-response-output {
    border-color: #e6f1e2;
	color: #333;
	background: #e6f1e2;
	font-weight:500;
	padding: 15px 20px;
	margin: 20px 0px;
}

/**** Contactform7 - ENDE  ****************************************************/

