div.accordion {
  position: fixed;
  display: flex;
  flex-direction: column;
  top: 0;
  right: 0;
  width: 75%;
  z-index: 1111;
  overflow: hidden;
  background: white;
  transform: translate(100%);

   transition: all 0.5s ease-in-out;
    overflow-y: scroll;




}

div.accordion.active {
  transform: translate(0%);

  transition: all 0.5s ease-in-out;
}


.cataloglayout__facet__showfilter {
  color: #ffffff;
  background: var(--primary);

  /* display: inline-block; */
  border-radius: 3px;
  padding: 10px 15px;
  font-weight: bold;
  font-size: 1.1rem;
  text-transform: uppercase;
  text-decoration: none;
  text-align: center;
  cursor: pointer;
}




.accordion input.accordion {
  position: absolute;
  opacity: 0;
  z-index: -1;
}

.accordion.row {
  display: flex;
}
.accordion .row .col {
  flex: 1;
}
.accordion .row .col:last-child {
  margin-left: 1em;
}

/* Accordion styles */
div.accordion {

  overflow: hidden;
}

.accordion .tab {
  width: 100%;
  color: black;
  overflow: hidden;
}
.accordion .tab-label {
  display: flex;
  justify-content: space-between;
  padding: 1em;
  /* background: #5a2982; */
  font-weight: bold;
  cursor: pointer;
  /* Icon */
}
/* .accordion .tab-label:hover {
  background: #521684;
} */
.accordion .tab-label::after {
  content: "❯";
  width: 1em;
  height: 1em;
  text-align: center;
  transition: all 0.35s;
}
.accordion .tab-content,
.accordion .tab-content-small,
.loginrequired p {
  max-height: 0;
  /* padding: 0 1em; */
  color: #2c3e50;
  background: white;
  transition: all 0.35s;
}

.loginrequired p {
  background: transparent;
  color: white;
}
.accordion .tab-close {
  display: flex;
  justify-content: flex-end;
  padding: 1em;
  font-size: 0.75em;
  background: #2c3e50;
  cursor: pointer;
}
.accordion .tab-close:hover {
  background: #521684;
}


.accordion input:checked + .tab-label::after {
  transform: rotate(90deg);
}
.accordion input:checked ~ .tab-content {
  max-height: 100vh;
  overflow-y: auto;
  overflow-x: hidden;
  /* padding: 1em; */
}

.accordion input:checked ~ .tab-content-small,
.loginrequired p {
  max-height: 100vh;
  overflow-y: auto;
  overflow-x: hidden;
  /* padding: 1em; */
}

.tab-content-small {
  position: relative;
}
.loginrequired {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  text-align: center;

  background: #808080;
  opacity: 0.8;
}
.accordion input:checked ~ .tab-content-small .loginrequired p {
  position: absolute;
  top: 50%;
  background: transparent;
  color: white;
  left: 50%;
  transform: translate(-50%, -50%);
  margin: 0;
}

.loginrequired a {
  color: white;
}

.accordion input:checked ~ .hiddenoverflow {
  overflow-y: hidden;
}


@media (min-width: 1000px) {


  div.accordion{
    position: static;
     width: auto;
     transform: none;
     /* border-radius: 8px;
     box-shadow: 0 4px 4px -2px rgba(0, 0, 0, 0.5);
      */
  transition: none;
    }

  .sip__facetmobile__header__container, .sip__facetmobile__footer__container{
    display: none;
  }


  .accordion input:checked ~ .tab-content-small,
.loginrequired p {
  max-height: 50vh;
  /* padding: 1em; */
}

}