.topic-selector{
  z-index: 1;
  position: relative;
}
.topic-selector .topic-selector-head{
  padding: 32px 0;
  text-align: center;
  transition: all .2s ease-in-out;
}
.topic-selector-toggle{
  display: inline-block;
  cursor: pointer;
}
.topic-selector .topic-selector-head h2{
  font-family: 'Larsseit';
  font-style: normal;
  font-weight: 700;
  font-size: 44px;
  line-height: 56px;
  text-align: center;
  letter-spacing: -0.02em;
  color: var(--primary);
  text-transform: uppercase;
}
.topic-selector .category-slider-tab{
  padding-top: 0;
}
.topic-selector .topic-selector-head svg{
  transition: all .3s ease-in-out;
  margin-left: 24px;
}
.topic-selector.active .topic-selector-head svg{
  transform: rotate(180deg);
}
.topic-selector-main{
  transition: all .3s ease-in-out;
  opacity: 0;
  height: 0;
  visibility: hidden;
}

.topic-selector:not(.active) .category-slider-tab {
    padding: 0;
}

.topic-selector.active .topic-selector-main{
  visibility: visible;
  height: 100%;
  opacity: 1;
}

@media(min-width: 1600px){
  .topic-selector .topic-selector-main{
    padding: 0 32px;
  }
}
@media(max-width: 1599px){
  .topic-selector .topic-selector-head h2{
    font-size: 36px;
    line-height: 44px;
  }
}
@media(max-width: 1279px){
  .topic-selector .topic-selector-head h2{
    font-size: 30px;
    line-height: 36px;
  }
}
@media(max-width: 767px){
  .topic-selector .topic-selector-head h2{
    font-size: 24px;
    line-height: 28px;
  }
}