@charset "utf-8";
/* CSS Document */
@media screen and (min-width: 1024px) {
	.footerMenu{
		width:100%;
		font-size: 14px;
		line-height: 1.3em;
		padding-left: 10px;
		padding-right: 80px;
		display:grid;
		/*grid-template-columns: 250px repeat(5, auto);	/* 1. Spalte mit Kontaktdaten fixe Grösse, die anderen automatisch */
	}
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
	.footerMenu{
		width: var(--screen-width);
		font-size: 12px;
		line-height: 1.3em;
		padding-left: 80px !important;
		display:grid;
		grid-template-columns: 300px repeat(3, auto);
	}
}
@media screen and (max-width: 767px) {
	#cms_footerContainer{
		display: none;
	}
}

.mgrid{
	text-align:left;
}
.footerMenu strong{
	font-weight: 800;
}
<style>
  :root { --footer-h: 0px; }

  /* Footer ist fix am unteren Rand und fährt per transform hoch */
:root { --footer-h: 0px; }

/* Footer fährt hoch per transform */
#cms_footerContainer{
  position:fixed; left:0; right:0; bottom:0;
  transform: translateY(100%);
  transition: transform .5s ease; 
  will-change: transform; 
  z-index:9999;
}

/* Gesamten Inhalt gleichzeitig nach oben schieben */
#page-wrap{
  transition: transform .2s ease;
  will-change: transform;
}

/* Sichtbar-Zustand */
body.footer-open #cms_footerContainer{ transform: translateY(0); }
body.footer-open #page-wrap{ transform: translateY(calc(-1 * var(--footer-h))); }

/* Falls du bottom-fixierte Elemente hast (Toolbars etc.) */
:root{ --footer-safe: 0px; }
body.footer-open{ --footer-safe: var(--footer-h); }
.fixed-toolbar{ position:fixed; left:0; right:0; bottom: var(--footer-safe); }
  
  


