/* @override 
	https://2026.architekturgalerie-muenchen.de/typo3conf/ext/architekturgalerie/templates-2026/css/global.css?* */



:root {
	--color-black: rgba(0, 0, 0, 1);
	--color-white: rgba(255, 255, 255, 1);
	
	--color-masterI: rgba(244, 63, 61, 1); /* masterI */
	--color-masterI-60: rgba(248, 140, 139, 1); /* masterI 60% */
	
	--color-masterII: rgba(60, 60, 60, 1); /* masterII */
	--color-masterII-60: rgba(138, 138, 138, 1); /* masterII 60% */
	
	--color-boxshadow: rgba(0, 0, 0, .3);
	--color-subnav-selected: rgba(255, 255, 255, .85);
	--color-mmenu-selected: rgba(255, 255, 255, .15);
	--color-slickdot: rgba(0, 0, 0, 1);
	
	--gradient-slidercaption: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0.4) 100%);

	--letterspacing-s: .03em;
	--letterspacing-m: .08em;
	--letterspacing-l: .12em;	
	
	--framespace-xs: calc(var(--padd-section-tb) * .25);
	--framespace-s: calc(var(--padd-section-tb) * .5);
	--framespace-m: calc(var(--padd-section-tb) * .75);
	--framespace-l: calc(var(--padd-section-tb) * 1);
	--framespace-xl: calc(var(--padd-section-tb) * 1.25);
	
	--padd-b-h: 40px;
	--padd-b-p: 20px;
	
	--padd-page-lr: 10%;
	--marg-page-lr: 5%;
	
	--padd-btn: 20px 40px 20px 40px;
	
	--padd-section-tb: 120px;
	--padd-header-tb: 20px;
	--padd-topnav-lr: 20px;
	--padd-mainnav-lr: 20px;
	--padd-subnav-tb: 10px;
	--padd-subnav-lr: 20px;
	--padd-footernav-lr: 20px;
	--padd-footertop-tb: var(--padd-section-tb) 0px calc(var(--padd-section-tb) * .5) 0px;
	--padd-footerbottom-tb: calc(var(--padd-section-tb) * .25);
	--padd-slidercaption: 25px 15px 15px 15px;
	
	--gridgap-col: 40px;
	--gridgap-row: 40px;	
	
	--size-ulbullet: 4px;
	--size-accordionicon: 40px;
	--size-backtop: 40px;
	--size-sliderarrow: 40px;
	--size-sliderdot: 40px;
	--size-socialicon: 20px;
	
	--height-topnav: 40px;
	--height-mainnav: 120px;
	--height-header: calc(var(--height-topnav) + var(--height-mainnav));	
	
	--width-logo: 300px;
	--width-logo-startsection: 500px;
	
	--font-standard: "Inter", Arial, Helvetica, Geneva, sans-serif;
	--font-special: "Courier New", Courier, mono;
	
	--fontsize-xs: 12px;
	--fontsize-s: 16px;
	--fontsize-m: 20px;
	--fontsize-l: 25px;
	--fontsize-xl: 40px;
	
	--lineheight-p: 160%;
	--lineheight-h: 130%;
	--lineheight-nav: 100%;
	
	--fontweight-regular: 400;
	--fontweight-medium: 600;
	--fontweight-bold: 700;

	--font-hI: normal var(--fontweight-regular) var(--fontsize-xl)/var(--lineheight-h) var(--font-standard);
	--font-hII: normal var(--fontweight-regular) var(--fontsize-m)/var(--lineheight-h) var(--font-special);
	--font-hIII: normal var(--fontweight-regular) var(--fontsize-l)/var(--lineheight-h) var(--font-standard);
	
	--font-topnav: normal var(--fontweight-medium) var(--fontsize-l)/var(--lineheight-nav) var(--font-standard);
	--font-mainnav: normal var(--fontweight-medium) var(--fontsize-xl)/var(--lineheight-nav) var(--font-standard);
	--font-subnav: var(--font-mainnav);
	--font-footernav: normal var(--fontweight-medium) var(--fontsize-xs)/var(--lineheight-nav) var(--font-standard);
	--font-mobilemainnav: normal var(--fontweight-medium) var(--fontsize-m)/var(--lineheight-nav) var(--font-standard);
	--font-mobilesubnav: normal var(--fontweight-medium) var(--fontsize-s)/var(--lineheight-nav) var(--font-standard);
	
	--font-btn: normal var(--fontweight-medium) var(--fontsize-s)/var(--lineheight-nav) var(--font-standard);
	--font-bodytext: normal var(--fontweight-regular) var(--fontsize-m)/var(--lineheight-p) var(--font-standard);
	--font-caption: normal var(--fontweight-regular) var(--fontsize-xs)/var(--lineheight-p) var(--font-standard);
	--font-slidercaption: normal var(--fontweight-regular) var(--fontsize-xs)/var(--lineheight-p) var(--font-standard);
	
	--font-cookie-h: normal var(--fontweight-bold) 16px/var(--lineheight) var(--font-standard);
	--font-cookie-p: normal var(--fontweight-regular) 14px/var(--lineheight) var(--font-special);
	--font-cookie-btn: normal var(--fontweight-regular) 14px/var(--lineheight-deco) var(--font-special);	
	--font-cookie-name: normal var(--fontweight-regular) 16px/var(--lineheight) var(--font-standard);
	--font-cookie-description: normal var(--fontweight-regular) 14px/var(--lineheight-deco) var(--font-special);
	--font-cookie-purpose: normal var(--fontweight-regular) 12px/var(--lineheight-deco) var(--font-special);	
	--color-cookie-layerbg: rgba(254, 65, 25, .9);
	--color-cookie-bg: rgba(255, 255, 255, 1);
	--color-cookie-p: rgba(0, 0, 0, 1);
	--color-cookie-link: var(--color-masterI);
	--color-cookie-hover: var(--color-masterII);
	--color-cookie-successbtn-hover: var(--color-cookie-bg);
	--color-cookie-declinebtn-hover: var(--color-cookie-link);
	--color-cookie-description: rgba(90, 90, 90, 1);	
}

/* @group RESET */

p,
.container p,
.ce-bodytext p,
figure.image,
h1, h2, h3, h4, h5,
.ce-bodytext ul,
ul,
figure.video,
.frame-type-textmedia div.ce-gallery {
	margin: 0;
	padding: 0;
}

button, input[type="submit"], input[type="reset"] {
	background: none;
	color: inherit;
	border: none;
	padding: 0;
	font: inherit;
	cursor: pointer;
	outline: inherit;
}

* {
	box-sizing: border-box;
}

html,
body {
	width: 100%;
    padding: 0;
    margin: 0;
}

/* @group Table reset */

.ce-table, .ce-table th, .ce-table td,
.ce-bodytext figure.table,
.ce-bodytext figure.table table {
    border: none;
    padding: 0;
    margin: 0;
    background: none;
    font: inherit;
    color: inherit;
}

.ce-table,
.ce-bodytext figure.table table {
    border-collapse: collapse; /* Verhindert doppelte Rahmen */
    border-spacing: 0; /* Setzt den Abstand zwischen Zellen auf 0 */
    width: auto;
    height: auto;
}

.ce-table th, .ce-table td,
.ce-bodytext figure.table table th,
.ce-bodytext figure.table table td {
    text-align: left;
    vertical-align: top;
    border: none; /* Stellt sicher, dass auch einzelne Zellen keine Rahmen haben */
	padding: 0;
}

/* @end */

/* @end */

/* @group GENERAL */

html, body {

font: var(--font-bodytext);
}

/* @group header
 */

div.headeroben


{
font: var(--font-mainnav);
}

.headerlinks {
width: 50%;
display: inline-block;
float: left;

}
.headerrechts {
width: 50%;
display: inline-block;
float: left;

}

div#wrappergesamt div.headerwrapper div.headeroben div.headerrechts div.navigation ul.topLevel li.aktiv a {


}


/* Liste resetten */
.navigation ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* Top-Level horizontal */
.navigation .topLevel {
  display: flex;
  align-items: center;
}

/* Listenelemente nebeneinander */
.navigation .topLevel > li {
  margin-right: 20px;
}

/* Links weiß + ohne Unterstreichung */
.navigation a {
  color: white;
  text-decoration: none;
  font-family: inherit;
}

/* Hover */
.navigation a:hover {
  text-decoration: underline;
}

/* @group sticky */

/* =========================
   RESET
========================= */
.headerwrapper ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* =========================
   HEADER
========================= */
.headerwrapper {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 9999;
  background: transparent;
  transition: background-color 0.3s ease;
}

/* Gelber Hintergrund beim Scroll */
.headerwrapper.scrolled {
  background-color: yellow;
}

/* Platz für fixed Header */
body {
  padding-top: 140px; /* ggf. anpassen */
}

/* =========================
   LAYOUT
========================= */
.headeroben {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px 40px;
}

.headerlinks .logo {
  font-size: 20px;
  line-height: 1.2;
}

/* =========================
   NAVIGATION
========================= */
.headerrechts {
  display: flex;
  align-items: center;
}

.navigation .topLevel {
  display: flex;
  align-items: center;
}

.navigation .topLevel > li {
  margin-right: 25px;
  position: relative;
}

.navigation .topLevel > li:last-child {
  margin-right: 0;
}

/* =========================
   FARBEN (WICHTIG)
========================= */

/* Standard (oben / transparent) */
.navigation a,
#sprachauswahl a,
.logo {
  color: white;
  text-decoration: none;
  transition: color 0.3s ease;
}

/* Hover immer schwarz */
.navigation a:hover,
#sprachauswahl a:hover {
  color: black;
}

/* Aktiver Menüpunkt */
.navigation .aktiv > a {
  color: black;
}

/* Beim Scroll (gelber Hintergrund → alles schwarz) */
.headerwrapper.scrolled .navigation a,
.headerwrapper.scrolled #sprachauswahl a,
.headerwrapper.scrolled .logo {
  color: black;
}

/* =========================
   SUBMENU
========================= */
.navigation .subLevel {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  background: white;
  padding: 10px 0;
  min-width: 150px;
}

.navigation .topLevel > li:hover .subLevel {
  display: block;
}

.navigation .subLevel li {
  padding: 5px 15px;
}

.navigation .subLevel a {
  color: black;
}

/* =========================
   SPRACHAUSWAHL
========================= */
#sprachauswahl ul {
  display: flex;
  margin-left: 20px;
}

#sprachauswahl li {
  margin-left: 10px;
}/* @end */

/* @end */

/* @group Layouts */

#wrappergesamt {
width: 100%;

}


/* @end */



/* @end */