:root {
  --cassiopeia-color-primary: transparent;
}
.container-header {
  background-image: none;
  padding-top:20px;
  box-shadow:none;
}
body {
	color: #000000;
	font-family: Helvetica, Roboto, sans-serif;  
  	font-size:1rem;
}
.container-component > * + * {
	margin-top: 2em;
}
a, .info a,  .footer a {	color: #79a5c7;	text-decoration: none; }
a:hover, .info a:hover, .footer a:hover  {	color: #719645; }


/*  Spalten rechts und links    ----------------------   */
.site-grid > .container-sidebar-left, .site-grid > .container-sidebar-right {
	width: 85%;
}
.card {
  	border:none;
}
h3.card-header {
	color: #ffffff;
}
.card-header {
  	border-radius:0px;
	font-size:1.2rem;
  	text-align:center;
  	margin-bottom:1rem;
  	margin-top:3.8em;
  	padding:4px 0;
}
.sidebar-left.card.inserat .card-header {
	background: #719645;
  	border-radius:0px;
}
.sidebar-right.card.news .card-header {
	background: #79a5c7;
  	border-radius:0px;
}
.card-body {
	padding: 0px;
}
.sidebar-right.card.news .mod-articlesnews__item {
/*	border: 2px solid #79a5c7;
	padding: 5px;  */
	margin-bottom: 1rem;
}
.sidebar-right.card.news .mod-articlesnews__item p {
	margin-bottom: 0.2rem;
}
.team {
	background-image: url(../images/bg4.png);
	color: #ffffff;
	padding: 5px;
	position: absolute;
	top: -59px;
	left: 35px;
	transform: rotate(-11deg);
}
.team a {
  	color:#8bbae1;
}
.team a:hover {
  	color:#ffffff;
}
.werbung {
	max-width: 320px;
	max-height: 200px;
	height: 168px;
	margin-bottom: 15px;
}
.farfalla {
	background-image: url(https://www.elanpark.ch/images/news/farfalla.png);
}
.tee {
	background-image: url(https://www.elanpark.ch/images/news/tee.png);
}
.baumschmuck {
	background-image: url(https://www.elanpark.ch/images/news/baumschmuck.png);
}
.bodybag {
	background-image: url(https://www.elanpark.ch/images/news/ml_20231227.jpg);
  	background-position:bottom;
}
.write {
	font-size: .95rem;
	color: rgba(255,255,255,0.8);
	line-height: 1.2rem;
	background: rgba(0,0,0,0.4);
	position: relative;
	top: 100px;
	padding: 5px;
}
.bodybag .write {
	color: rgba(0,0,0,0.8);
	background: rgba(255,255,255,0.4);
  	top:0;
}
.holy {
	display: flex;
	border: 3px solid #970000;
	padding: 3px 0 0 3px;
}
.ferien {
	padding-left: 3px;
}

/*  elanpark jumper -------------------------------------------------------------- */
video {
	border: 0px;
	margin-top:-20px;
}
/*  back to top link  ----------------------------------- */
.back-to-top-link {
	border: 1px solid #000;
	border-radius: 0;
	position:fixed;
  	bottom: 1rem;
  	right: 1rem;
	color:#666;
}
.back-to-top-link:focus, .back-to-top-link:hover {
	background-color: rgba(0,0,0,0.1);
	border: 2px solid white;
}
.inserat_cont {
	display: flex;
	gap: 5px;
  	padding-top:20px;
}
.agi-logo {
	margin-top: -6px;
}

/*  verzeichnis elanparker  ------------------------------------------------- */
body.itemid-102 .site-grid > [class*=" container-"], body.itemid-104 .site-grid > [class*=" container-"],
body.itemid-105 .site-grid > [class*=" container-"] {
	max-width: 1000px;
}

/*  beginn animation fadeIn elemente firmen seite wer   -----------------  */
div.elani {
  opacity: 0;
  margin-top:200px;
  -webkit-animation: fadeIn 0.9s 1;
  animation: fadeIn 0.9s 1;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
}

div.elani:nth-child(20n+1) {
  -webkit-animation-delay: 0.1s;
  animation-delay: 0.1s;
}
div.elani:nth-child(20n+2) {
  -webkit-animation-delay: 0.2s;
  animation-delay: 0.2s;
}
div.elani:nth-child(20n+3) {
  -webkit-animation-delay: 0.3s;
  animation-delay: 0.3s;
}
div.elani:nth-child(20n+4) {
  -webkit-animation-delay: 0.4s;
  animation-delay: 0.4s;
}
div.elani:nth-child(20n+5) {
  -webkit-animation-delay: 0.5s;
  animation-delay: 0.5s;
}
div.elani:nth-child(20n+6) {
  -webkit-animation-delay: 0.6s;
  animation-delay: 0.6s;
}
div.elani:nth-child(20n+7) {
  -webkit-animation-delay: 0.7s;
  animation-delay: 0.7s;
}
div.elani:nth-child(20n+8) {
  -webkit-animation-delay: 0.8s;
  animation-delay: 0.8s;
}
div.elani:nth-child(20n+9) {
  -webkit-animation-delay: 0.9s;
  animation-delay: 0.9s;
}
div.elani:nth-child(20n+10) {
  -webkit-animation-delay: 1.0s;
  animation-delay: 1.0s;
}
div.elani:nth-child(20n+11) {
  -webkit-animation-delay: 1.1s;
  animation-delay: 1.1s;
}
div.elani:nth-child(20n+12) {
  -webkit-animation-delay: 1.2s;
  animation-delay: 1.2s;
}
div.elani:nth-child(20n+13) {
  -webkit-animation-delay: 1.3s;
  animation-delay: 1.3s;
}
div.elani:nth-child(20n+14) {
  -webkit-animation-delay: 1.4s;
  animation-delay: 1.4s;
}
div.elani:nth-child(20n+15) {
  -webkit-animation-delay: 1.5s;
  animation-delay: 1.5s;
}
div.elani:nth-child(20n+16) {
  -webkit-animation-delay: 1.6s;
  animation-delay: 1.6s;
}
div.elani:nth-child(20n+17) {
  -webkit-animation-delay: 1.7s;
  animation-delay: 1.7s;
}
div.elani:nth-child(20n+18) {
  -webkit-animation-delay: 1.8s;
  animation-delay: 1.8s;
}
div.elani:nth-child(20n+19) {
  -webkit-animation-delay: 1.9s;
  animation-delay: 1.9s;
}
div.elani:nth-child(20n+20) {
  -webkit-animation-delay: 2.0s;
  animation-delay: 2.0s;
}
/* Animation steps */
@keyframes fadeIn {
    from { opacity: 0; margin-top:200px}
    to   { opacity: 1; margin-top:0px;}
}
@-webkit-keyframes fadeIn {
    from { opacity: 0; margin-top:200px}
    to   { opacity: 1; margin-top:0px;}
}
/*  ende animation fadeIn elemente firmen seite wer   -----------------  */

.elani {
	height: 100px;
}
.elani a img {
	padding:10px;
	width:180px;
/*	transition:.3s;  */
}
.elani a:hover img  {
	width:360px;
}
.elan-list-wrap .elan-list {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	justify-content:flex-start;
}
.elan-list {
	position: relative;
}
/* modal popup einzelne firma -------------------  */
[data-modals-element="modal"] [data-modals-element="overlay"] {
	background-color: rgba(0,75,111,0.8);
}
.contentpane {
	padding: 0px;
}
.firmenlogo img {
	width:180px;
    padding:15px 0 0 15px;
}
h1.firma {
	font-size: 1.2rem;
	margin-bottom:12px;
    padding-left:15px;
}
h2 {
	font-size:1rem;
}
.grid-container {
	display: grid;
	grid-gap: 1.4em;
	grid-template-columns: 3fr 1fr;
	padding: 0 0 0 15px;
}
.grid-icon-container {
	display: grid;
	grid-template-columns: 20px 1fr;
	line-height:2.2;
}
/*div.text {
	border-right:1px solid rgba(0,75,111,0.4);
}*/
div.info {
	padding-left:5px;
  	min-width:133px;
}
/*  wo im hause  ------------------------------------------------- */
.wo-list-wrap {
}
.wo-list {
	max-width:800px;
	margin:0px auto;
}
.elan-wo {
	margin-bottom: 50px;
	padding-bottom:50px;
	position: relative;
}
img.etage {
	opacity: 0.5;
}
/*  wo im hause platzierung  ------------------------------------------------- */
.elan-wo ul {
	margin: 0 !important;
	padding: 0 !important;
	list-style: none;
	font-size: 1.2em;
	line-height: 1.5em;
}
.markierung {
	position: absolute;
}
.buero img {
	width: 55px;
	border: 2px solid #ccc;
}
.buero span {
	scroll-margin-top:14rem;
}

/*#platz_11:target img, #platz_12:target img, #platz_13:target img, #platz_14:target img, #platz_15:target img, #platz_16:target img,
#platz_17:target img, #platz_18:target img, #platz_19:target img, #platz_20:target img, #platz_22:target img,
#platz_23:target img, #platz_24:target img, #platz_25:target img, #platz_26:target img, #platz_27:target img, #platz_28:target img */
.markierung:target img {
	border:3px solid #477d97;
	width:100px;
	transition: all 0.4s ease-in 0.1s;
	z-index: 10;
	position: relative;
	top: -13px;
	left: -10px;
}
.markierung:hover img {
	width:100px;
	transition: all 0.4s ease-in 0.1s;
	z-index: 15;
	position: relative;
}
#platz_11, #platz_25 {
	left: 12%;
	top: 9%;
}
#platz_12 {
	left: 23.2%;
	top: 9%;
}
#platz_13 {
	left: 60%;
	top: 9%;
}
#platz_28 {
	left: 67%;
	top: 9%;
}
#platz_15 {
	left: 76.7%;
	top: 9%;
}
#platz_16 {
	left: 71%;
	top: 48%;
}
#platz_17 {
	left: 83%;
	top: 48%;
}
#platz_18 {
	left: 36.5%;
	top: 9%;
}
/*  doppelbelegung  ------------ 
#platz_19 img, #platz_22 img, #platz_14 img, #platz_23 img {
	border:1px solid #b6ad97;
}  */
#platz_14 {
	left: 83.5%;
	top: 8.5%;
}
#platz_19 {
	left: 31.75%;
	top: 48%;
}
#platz_22 {
	left: 52%;
	top: 9%;
}
#platz_20 {
	left: 41%;
	top: 9%;
}
#platz_23 {
	left: 65.5%;
	top: 9%;
}
#platz_24 {
	left: 16.5%;
	top: 48%;
}
#platz_26 {
	left: 51%;
	top: 9%;
}
#platz_27 {
	left: 87%;
	top: 9%;
}
/*    anfahrt   ---------------------------------------- */
.anfahrt {
	max-width:800px;
	margin:0px auto;
}
.anfahrt_cont {
  	display:flex;
  	justify-content:space-between;
  	gap:5px;
}
.footer {
	background-color: transparent;
	background-image: none;
	color: #477d97;
}
.gruen {
  	color:#719645;
}
/*  navigation -------------------------------------------------------------- */
.container-header .mod-menu > li > a {
	background-repeat: no-repeat;
}
#navbar1 ul.mod-menu li a {
	width: 100px;
	height: 35px;
	text-align: center;
	padding-top: 6px;
	font-weight: bold;
	font-size: 1rem;
}
.container-header .mod-menu > li {
	background-repeat: no-repeat;
	background-position: center center;
}
.container-header .mod-menu > li:first-child {
	background-image: url("../images/navi/menu-bg1.png");
}
.container-header .mod-menu > li:nth-child(2) {
	background-image: url("../images/navi/menu-bg2.png");
}
.container-header .mod-menu > li:nth-child(3) {
	background-image: url("../images/navi/menu-bg3.png");
}
.container-header .mod-menu > li:nth-child(4) {
	background-image: url("../images/navi/menu-bg4.png");
}
.container-header .mod-menu > li:nth-child(5) {
	background-image: url("../images/navi/menu-bg5.png");
}
.container-header .metismenu > li.level-1.active > a::after, .container-header .metismenu > li.level-1 > a:hover::after {
	content: "";
	position: absolute;
	left: 25%;
	right: 25%;
	bottom: 4px;
	height: 0;
	width: 50%;
	border-bottom: 3px solid #fff;
	opacity: 1;
}
.metismenu.mod-menu .metismenu-item.active > a, .metismenu.mod-menu .metismenu-item > a:hover {
	text-decoration: none;
}
.container-header .container-nav {
	justify-content: space-around;
}

/* ------------------------------------------------------------------------*/
/*  MEDIA QUERIES     max-width:767px
------------------------------------------------------------------------*/
@media (max-width:767px){
/*  Spalten rechts und links    ----------------------   */
.site-grid > .container-sidebar-left, .site-grid > .container-sidebar-right {
	width: 100%;
}
.card-header {
	margin-top: 0;
}
/* navigation 1-level  ---------------------  */
.container-header .navbar-toggler {
	border: 0;
	font-size: 2.25rem;
  	border-radius:0px;
  	padding:0px;
	transition: box-shadow .15s ease-in-out;
	background-image: url("../images/navi/button-bg.png");
  	background-repeat:no-repeat;
  	width:120px;
  	height:42px;
  	margin: 0px auto;
}
/*  rahmen um burger-button loeschen   */
.navbar-toggler:focus {
	box-shadow: none;
}
/*  icon burger und icon kreuz bei offener und geschlossener navigation   */
button[aria-expanded="false"] > span.icon-menu::before {
	content: "\f0c9";
} 
button[aria-expanded="true"] > span.icon-menu::before {
	content: "\f00d";
}
.metismenu.mod-menu .metismenu-item {
	flex-direction: column;
}
.sidebar-left.card.inserat .mod-articlesnews__item {
  	text-align:center;
}

/*   footer  -------------------------------- 
.footer .grid-child {
	-webkit-box-align: center;
	-ms-flex-align: center;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	align-items: flex-start;
	justify-content: space-between;
	padding: 1rem 1.5rem;
}*/
}

/* ------------------------------------------------------------------------*/
/*  MEDIA QUERIES     max-width:520px
------------------------------------------------------------------------  */
@media (max-width:520px){
video {
	width: 330px;
	height: 511px;
}
.markierung img {
	width:30px;
	margin-top:-5px;
}
.markierung:hover img {
	width:80px;
}
/*  popup firma  ------------------  */
.grid-container {
  	display:grid;
  	grid-gap: 0em;
	grid-template-columns:1fr;
}
div.info {
	padding-left: 10px;
}
/*
.site-grid {
	grid-gap: 0 0.2rem;
}*/
.inserat_cont {
	flex-direction: column;
}
}


/* ------------------------------------------------------------------------*/
/*  MEDIA QUERIES     liste der firmen - wer
------------------------------------------------------------------------*/
.elan-list-wrap .elan-list .elani {
	border-top:1px solid #ccc;
/*	border-bottom:1px solid #ccc;   */
	border-right:1px solid #ccc;
	text-align:center;
}
.elan-list-wrap .elan-list .elani:last-child {
	border-right: 0;
}

@media (min-width: 980px) {
.elan-list-wrap .elan-list .elani {
	flex-basis:20%;
}
.elan-list-wrap .elan-list .elani:nth-child(5n) {
	border-right: 0;
}
.elan-list-wrap .elan-list .elani:nth-child(-n+5) {
	border-top: 0;
/*	border-bottom:0    */
}
}

@media (min-width: 768px) and (max-width:979.98px){
.elan-list-wrap .elan-list .elani {
	flex-basis:25%;
}
.elan-list-wrap .elan-list .elani:nth-child(4n) {
	border-right: 0;
}
.elan-list-wrap .elan-list .elani:nth-child(-n+4) {
	border-top: 0;
/*	border-bottom:0    */
}
}

@media (min-width: 520px) and (max-width:767.98px){
.elan-list-wrap .elan-list .elani {
	flex-basis:33%;
}
.elan-list-wrap .elan-list .elani:nth-child(3n) {
	border-right: 0;
}
.elan-list-wrap .elan-list .elani:nth-child(-n+3) {
	border-top: 0;
/*	border-bottom:0    */
}
}

@media (max-width:519.98px){
.elan-list-wrap .elan-list .elani {
	flex-basis:50%;
}
.elan-list-wrap .elan-list .elani:nth-child(2n) {
	border-right: 0;
}
.elan-list-wrap .elan-list .elani:nth-child(-n+2) {
	border-top: 0;
/*	border-bottom:0    */
}
}
/*
.elan-list-wrap .elan-list .elani:nth-last-child(-n+2) {
	border-top: 0;
/*	border-bottom:0    */
}
*/

