/***************************Navigation******************************************

    00. Font Icon
    01. Typografie
    02. zweifarbige Hintergründe
    03. Tablet Navigation
    04. Links
    05. Formular
    06. Downloads
    07. Teambox
    08. Mietstatus
    09. Liegenschaften
    10. Genossenschaft

    20. Footer

-------------------------------------------------------------------------------*/
:root {
	--accentColor: #347D56;
	--secondColor: #25332B;
}

html, body {
    background-color: white;
}

/********************************Font Icon**************************************/
#main a,
#main li a,
#footer p a{
  display: inline-flex;
	align-items: flex-start;
}

#footer p a {
  color: rgba(255, 255, 255, 0.9);
}

#main a:hover,
#main li a:hover {
  color: var(--secondColor);
}

#main a[href^="tel:"]:before,
#main a[href^="mailto:"]:before,
#main li a[href$='.pdf']:before,
#main li a[href*='.pdf?']:before,
#main .download-element.ext-pdf > a:before,

#main .download-element.ext-pdf > a:before,
#footer p a[href^="https://"]:before,
#footer p a[href^="tel:"]:before,
#footer p a[href^="mailto:"]:before{
  content: "";
	height: 20px;
	width: 20px;
	display: inline-block;
	background-color: var(--accentColor);
	padding-right: 10px;
	transition: 0.3s ease;
	
	transform: translateY(6px);
}

#main a[href^="tel:"]:hover:before,
#main a[href^="mailto:"]:hover:before,
#main li a[href$='.pdf']:hover:before,
#main li a[href*='.pdf?']:hover:before,
#main .download-element.ext-pdf > a:hover:before,
#main p a[href^="https://"]:hover:before{
  background-color: var(--secondColor);
}

#footer p a:hover {
  color: rgba(255, 255, 255, 0.6) !important;
}

#footer p a[href^="tel:"]:before,
#footer p a[href^="mailto:"]:before,
#footer p a[href^="https://"]:before,
#footer .download-element.ext-pdf > a:before{
  background-color: rgba(255, 255, 255, 0.9);
}

#footer p a[href^="tel:"]:hover:before,
#footer p a[href^="mailto:"]:hover:before,
#footer p a[href^="https://"]:hover:before,
#footer .download-element.ext-pdf > a:hover:before{
  background-color: white;
}

#main a[href^="mailto:"]:before,
#footer p a[href^="mailto:"]:before{
  	mask: url("/files/bgj32/00_Icons_NEU/envelope-sharp-light-full.svg") no-repeat center;
	-webkit-mask: url("/files/bgj32/00_Icons_NEU/envelope-sharp-light-full.svg") no-repeat center;
}

#main a[href^="tel:"]:before,
#footer p a[href^="tel:"]:before{
  	mask: url("/files/bgj32/00_Icons_NEU/phone-sharp-light-full.svg") no-repeat center;
	-webkit-mask: url("/files/bgj32/00_Icons_NEU/phone-sharp-light-full.svg") no-repeat center;
}

#main li a[href$='.pdf']:before,
#main li a[href*='.pdf?']:before,
#main .download-element.ext-pdf > a:before,
#footer .download-element.ext-pdf > a:before{
   	mask: url("/files/bgj32/00_Icons_NEU/file-pdf-sharp-light-full.svg") no-repeat center;
	-webkit-mask: url("/files/bgj32/00_Icons_NEU/file-pdf-sharp-light-full.svg") no-repeat center;
}

#footer p a[href^="https://"]:before {
   	mask: url("/files/bgj32/00_Icons_NEU/link-sharp-light-full.svg") no-repeat center;
	-webkit-mask: url("/files/bgj32/00_Icons_NEU/link-sharp-light-full.svg") no-repeat center;
}

/*-----------------------------------------------------------------------------*/

/****************************01. Typografie*************************************/
/*h5 {
  margin-bottom: 0px;
}*/

#main p strong,
#footer p strong{
  font-weight: 800;
}

/*-----------------------------------------------------------------------------*/

/********************02. zweifarbige Hintergründe*******************************/
.oben-dunkel-gruen.unten-hellgrau {
  background: linear-gradient(to bottom,
  var(--customColor1) 0%,
  var(--customColor1)  50%,
  var(--bgColorGray)50%,
  var(--bgColorGray) 100%);
}

.unten-dunkel-gruen.oben-hellgrau {
  background: linear-gradient(to bottom,
  var(--bgColorGray) 0%,
  var(--bgColorGray)  50%,
  var(--customColor1)50%,
  var(--customColor1) 100%);
}

.oben-weiss.unten-footer-gruen {
  background: linear-gradient(to top,
  var(--secondColor) 0%,
  var(--secondColor)  50%,
  #fff 50%,
  #fff 100%);
}

.oben-hellgrau.unten-weiss {
  background: linear-gradient(to bottom,
  var(--bgColorGray) 0%,
  var(--bgColorGray)  50%,
  white 50%,
  white 100%);
}

.unten-footer-gruen.oben-hellgrau {
  background: linear-gradient(to bottom,
  var(--bgColorGray) 0%,
  var(--bgColorGray)  50%,
  var(--secondColor)50%,
  var(--secondColor) 100%);
}

.unten-footer-gruen.oben-hellgrau.-prozent {
  background: linear-gradient(to bottom,
  var(--bgColorGray) 0%,
  var(--bgColorGray)  80%,
  var(--secondColor)20%,
  var(--secondColor) 100%);
}



/*-----------------------------------------------------------------------------*/

/*****************************03. Navigation************************************/
.mlist.level_2 a{
  line-height: 0.2px;
}

.mlist.error_503 {
  display: none;
}

.smartmenu-content .subitems_trigger:before,
.smartmenu-content .mod_navigation li.open > .subitems_trigger:before{
  content: "";
  mask: url("/files/bgj32/00_Icons/chevron-down-duotone-light-full.svg") no-repeat center;
  -webkit-mask: url("/files/bgj32/00_Icons/chevron-down-duotone-light-full.svg") no-repeat center;
  width: 25px;
  height: 25px;
  display: block;
  background-color: white;
  padding-top: 10px;
}

.smartmenu-content .mod_navigation a.active, .smartmenu-content .mod_navigation a.trail{
  border-bottom: 0px;
  font-weight: 800;
} 

.smartmenu-content .mod_navigation li.open > .subitems_trigger:before {
  mask: url("/files/bgj32/00_Icons/chevron-up-light-full.svg") no-repeat center;
  -webkit-mask: url("/files/bgj32/00_Icons/chevron-up-light-full.svg") no-repeat center;
}

/*-----------------------------------------------------------------------------*/

/*****************************04. Links*****************************************/
a {
  color: var(--accentColor);
}

.autogrid_row.fancylink-unten .attributes{
  display: flex;
  flex-direction: column;
  height: 100%;
}

.autogrid_row.fancylink-unten .attributes .ce_fancylink {
    margin-top: auto;
}


/*-----------------------------------------------------------------------------*/


/*****************************05. Formular**************************************/
:focus-visible {
  outline: 0px;
  border: 4px solid rgb(153, 153, 153);
}

input.submit, button.submit {
  padding: 0px;
}

/*-----------------------------------------------------------------------------*/

/*****************************06. Downloads**************************************/
.ce_downloads li,
#footer .ce_downloads li{
  border-bottom: 0px;
}

.ce_downloads a span.size {
  display: none;
}

/*nur die neusten 3 anzeigen*/
#loadMore ul li {
  display: none;
}

#loadMore li:nth-child(-n+3) {
  display: list-item;
}

/*button «mehr anzeigen»*/
#loadMoreBtn {
  font-family: Manrope;
  font-size: 15px;
  color: var(--secondColor);
  font-weight: 700;
  border: solid 1px var(--accentColor);
  border-radius: 25px;
  background-color: transparent;
  padding: 10px 20px;
  cursor: pointer;
  transition: ease .3s;
}

#loadMoreBtn:hover {
  background-color: rgba(52, 125, 86, .1);
}

/*-----------------------------------------------------------------------------*/

/******************************07. Teambox**************************************/
.ce_teambox_simple .job.font_headline{
  color: var(--accentColor);
}

.ce_teambox_simple .name.font_headline {
  color: var(--secondColor);
}

.ce_teambox_simple .description a {
  text-decoration: none;
}

/*-----------------------------------------------------------------------------*/

/*******************************08. Mietstatus**********************************/
.vermietet p,
.freie-wohnung p {
  display: inline-flex;
	align-items: flex-start;
}

.vermietet p:before,
.freie-wohnung p:before {
  content: "";
	height: 20px;
	width: 20px;
	display: inline-block;
	background-color: var(--accentColor);
	padding-right: 10px;
	transition: 0.3s ease;
	transform: translateY(6px);
}

.vermietet p:before {
  background-color: #b8121e;
}

.freie-wohnung p:before {
  background-color: var(--accentColor);
}

.vermietet p {
  color: #b8121e;
}

.freie-wohnung p {
  color: var(--accentColor);
}

.vermietet p:before {
   	mask: url("/files/bgj32/00_Icons_NEU/circle-xmark-sharp-light-full.svg") no-repeat center;
	-webkit-mask: url("/files/bgj32/00_Icons_NEU/circle-xmark-sharp-light-full.svg") no-repeat center;
}

.freie-wohnung p:before {
   	mask: url("/files/bgj32/00_Icons_NEU/badge-check-sharp-light-full.svg") no-repeat center;
	-webkit-mask: url("/files/bgj32/00_Icons_NEU/badge-check-sharp-light-full.svg") no-repeat center;
}

/*-----------------------------------------------------------------------------*/

/******************************09. Liegenschaften*******************************/
.liegenschaft h5 {
  margin-bottom: 0px;
}


/*-----------------------------------------------------------------------------*/

/******************************10. Genossenschaft*******************************/
.genossenschaft .padding-3 {
  padding: 0px 3% ;
}

@media only screen and (max-width: 767px) {
  .genossenschaft .autogrid_row>.column .attributes.p-xs {
    padding: 20px 0px;
  }
}




/*-----------------------------------------------------------------------------*/

/*****************************20. Footer****************************************/
#footer,
#bottom .inside,
#bottom{
  background-color: var(--secondColor);
}

#footer {
  color: rgba(255, 255, 255, 0.9);
}

#bottom .inside a,
#bottom .inside {
  color: rgba(255, 255, 255, 0.6);
}

#bottom .inside a:hover {
  color: white;
  border-bottom: 0px;
}



/*-----------------------------------------------------------------------------*/