#text-search-bar {
  margin: 20px;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--green-grey);
}

input[type="search"] {
  width: 100%;
  height: 60px;
  padding-left: 25px;
  border: 1px 1px 0px 1px solid var(--green-grey);
  background-color: unset;
  font-family: 'SwitzerVariable';
  font-size: 19px;
  font-weight: 400;
  line-height: 25.08px;
  letter-spacing: 0.01em;
  text-align: left;
  color: var(--black);
}

input[tyope="search"]:focus {
  outline: none;
}

input[type="search"]::placeholder {
  color: transparent; /* Hide the actual placeholder color */
  padding-left: 25px;
  background-image: linear-gradient(to right, #121D179A, #121D1700);
  background-clip: text;
  -webkit-background-clip: text;
}

button {
  all: unset;
  appearance: none; /* Removes default styling on some browsers */
  -webkit-appearance: none; /* Removes default styling on iOS/Safari */
  -moz-appearance: none; /* Removes default styling on Firefox */

  display: inline-block; /* Ensures the button behaves like a button */
  cursor: pointer; /* Makes it clear the element is interactive */

  /* Optional: Add a basic reset for padding and margin */
  padding: 0;
  margin: 0;

  /* Optional: Set a font reset */
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  color: inherit;
  text-align: center;

  /* Optional: Reset background and border */
  background: none;
  border: none;
  border-radius: 0;

  /* Optional: Remove any text decoration */
  text-decoration: none;

  /* Optional: Set a box-sizing reset */
  box-sizing: border-box;
}

.button-with-icon {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 25px;
  height: 60px;
}

.button-with-icon.filter-count-element {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 0;
  padding: 0 30px;
}

.button-with-icon span {
  font-family: 'SwitzerVariable';
  font-size: 19px;
  font-weight: 400;
  line-height: 25.08px;
  letter-spacing: 0.01em;
  text-align: left;
}

#text-search-button {
  border-top: 1px solid var(--green-grey);
}

#tab_toggle_wrapper {
  width: 100%;
  height: 83px;
  display: flex;
  justify-content: flex-start;
  align-items: flex-end;
  border-bottom: 1px solid var(--green-grey-low-light);
}

.filter-opening-wrapper {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  width: calc(100% - 50px); 
  height: 58px;
  margin: 45px 25px 35px 25px;
  
}

#outer-reset-filter-button {
  border-left: 1px solid var(--green-grey);
  border-top: 1px solid var(--green-grey);
  border-bottom: 1px solid var(--green-grey);
  flex-grow: 1;
  display: none;
}

#outer-reset-filter-button.active {
  display: flex;
}

.reset-active-filter-counter {
  font-family: 'SwitzerVariable';
  font-size: 16px;
  font-weight: 300;
  line-height: 21.12px;
  letter-spacing: 0.01em;
  text-align: left;
  color: var(--black-70);
  margin-left: 10px;
  display: none;
}

.reset-active-filter-counter.active {
  display: block;
}

#open-filter-button {
  border: 1px solid var(--green-grey);
  flex-grow: 1;
  min-width: 146px;
}

#open-filter-button-desktop,
#apply-filter-button-desktop,
#open-filter-desktop-button {
  display: none;
}

.filter-form-wrapper {
  position: relative;
}

.collapsable-filter-wrapper {
  position: fixed;
  top: 0;
  left: 0;
  display: block;
  width: 100vw;
  height: 100vh;
  visibility: hidden;
  transform: translateX(100%);
  transition: transform var(--slide-animation-time) ease-in-out, visibility 0s var(--slide-animation-time);
  background: var(--off-white);
  z-index: 100; /* Ensure it appears above other content */
  display: flex;
  flex-direction: column;
}

.collapsable-filter-wrapper.active {
  transform: translateX(0);
  visibility: visible;
  transition: transform var(--slide-animation-time) ease-in-out;
}

.filter-top-container {
  position: relative;
  height: 180px;
  width: 100%;
  border-bottom: 1px solid var(--green-grey-low-light);
  z-index: 10;
}

.filter-middle-container {
  width: 100%;
  min-height: 300px;
  flex-grow: 1;
  position: relative;
  overflow: hidden;
}

.filter-bottom-container {
  height: 100px;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  border-top: 1px solid var(--green-grey-low-light);
}

.filter-bottom-container button {
  width: 100%;
  height: 58px;
  margin: 25px 20px;
  border: 1px solid var(--green-grey);
}

.filter-top-wrapper {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  margin: 50px 20px 15px 20px;
  width: calc(100vw - 40px);
  gap: 15px;
}

.filter-top-row {
  height: 50px;
  width: 100%;
  display: flex;
  flex-direction: row;
}

#inner-reset-filter-button {
  border-left: 1px solid var(--green-grey);
  border-top: 1px solid var(--green-grey);
  border-bottom: 1px solid var(--green-grey);
  flex-grow: 1;
  height: 100%;
}

#cancel-button {
  border: 1px solid var(--green-grey);
  width: 155px;
  height: 100%;
}

#union-toggle {
  position: relative;
  width: 100%;
  height: 100%;
  flex-grow: 1;
  min-height: 50px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  overflow: hidden;
  border: 1px solid var(--green-grey);
}

#union-toggle .toggle-slider {
  position: absolute;
  width: 50%;
  height: 100%;
  background-color: var(--green-grey-low-light); /* Highlight color */
  transition: transform 0.3s ease;
  z-index: 1;
  transform: translateX(0);
  border-right: 1px solid var(--green-grey);
}

#union-toggle.active .toggle-slider {
  transform: translateX(100%);
  border-left: 1px solid var(--green-grey);
}

#union-toggle .toggle-option {
  position: relative;
  width: 50%;
  text-align: center;
  z-index: 2;
  font-weight: bold;
  user-select: none;
  font-size: 18px;
  text-transform: unset;
  font-weight: 400;
}

#help-wrapper {
  position: relative;
  width: 65px;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  border-top: 1px solid var(--green-grey);
  border-right: 1px solid var(--green-grey);
  border-bottom: 1px solid var(--green-grey);
}

.help-icon {
  width: 22px;
  height: 22px;
}

.tooltip-text {
  visibility: hidden;
  width: calc(100vw - 40px);
  background-color: var(--off-white);
  color: var(--black);
  text-align: left;
  border: 1px solid var(--green-grey);
  border-radius: 0px;
  padding: 20px;
  position: absolute;
  z-index: 1;
  top: 100%;
  right: -1px;
  font-family: 'SwitzerVariable';
  color: var(--black);
  font-size: 19px;
  line-height: 25.08px;
  letter-spacing: 0.01em;
  opacity: 0;
  transition: opacity 0.3s;
}

#help-wrapper:hover .tooltip-text {
  visibility: visible;
  opacity: 1;
}

.filter-category-1 {
  width: 100%;
  padding: 23px 15px 20px 20px;
  justify-content: space-between;
  border-bottom: 1px solid var(--green-grey);
}

.filter-category-1 .button-text {
  font-family: 'SwitzerVariable';
  color: var(--black);
  font-size: 27px;
  font-weight: 600;
  line-height: 35.64px;
  letter-spacing: 0.01em;
  text-align: left;
}

.button-with-icon .filter-count {
  margin: 0 auto 0 10px;
}

.filter-category-1 .filter-count {
  font-family: 'SwitzerVariable';
  color: var(--black-70);
  font-size: 16px;
  font-weight: 300;
  line-height: 21.12px;
  text-align: left;
  margin: 0 10px 0 auto;
}

.filter-category-2 {
  width: 100%;
  padding: 17px 15px 15px 20px;
  justify-content: space-between;
  border-bottom: 1px solid var(--green-grey);
}

.filter-category-2 .button-text {
  font-family: 'SwitzerVariable';
  color: var(--black);
  font-size: 18px;
  font-weight: 400;
  line-height: 23.76px;
  text-align: left;
}

.filter-category-2 .filter-count {
  font-family: 'SwitzerVariable';
  color: var(--black-70);
  font-size: 16px;
  font-weight: 300;
  line-height: 21.12px;
  text-align: left;
  margin: 0;
}

.filter-view {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  overflow-x: hidden;
  overflow-y: scroll;
  transform: translateX(100%);  /* Move off-screen */
  transition: transform var(--slide-animation-time) ease-in-out, visibility 0s var(--slide-animation-time);
  visibility: hidden; /* Ensure it's hidden when not active */
  background-color: var(--off-white);
}

/* Active state: visible view */
.filter-view.active.slide-in-left, .filter-view.active.slide-in-right {
  visibility: visible;
  transform: translateX(0); /* Center the view */
  transition: transform var(--slide-animation-time) ease-in-out;
}

/* Slide out to the left (forward navigation) */
.filter-view.slide-out-left {
  transform: translateX(-100%); /* Slide out of the view to the left */
  visibility: hidden;
}

/* Slide out to the right (backward navigation) */
.filter-view.slide-out-right {
  transform: translateX(100%); /* Slide out of the view to the right */
  visibility: hidden;
}

.filter-top-wrapper {
  position: absolute;
  transform: translateX(100vw); /* Initially off-screen to the right */
  visibility: hidden; /* Start hidden */
  transition: transform var(--slide-animation-time) ease-in-out, visibility 0s var(--slide-animation-time); /* Delay visibility until after transform */
}

.filter-top-wrapper.active {
  transform: translateX(0); /* Bring the element into view */
  visibility: visible; /* Make it visible after the transform transition starts */
  transition: transform var(--slide-animation-time) ease-in-out, visibility 0s; /* Instant visibility when sliding in */
}

.filter-top-wrapper.slide-out-left {
  transform: translateX(-100vw); /* Slide out to the left */
  visibility: hidden; /* Hide after the transform */
  transition: transform var(--slide-animation-time) ease-in-out, visibility 0s var(--slide-animation-time); /* Delay visibility until slide is done */
}

.filter-top-wrapper.slide-out-right {
  transform: translateX(100vw); /* Slide out to the right */
  visibility: hidden; /* Hide after the transform */
  transition: transform var(--slide-animation-time) ease-in-out, visibility 0s var(--slide-animation-time); /* Delay visibility until slide is done */
}

.filter-back-button {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  height: 50px;
  width: 50px;
  border: 1px solid var(--green-grey);
}

.filter-back-button img {
  width: 16.38px;
  height: 18px;
  transform: rotateZ(180deg);  
}

#filter-contextual-title {
  text-transform: uppercase;
}

.options-wrapper {
  margin: 0;
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.checkbox-and-counter-wrapper {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  margin: 0 50px 0 20px;
}

.checkbox-wrapper {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 15px;
}

input[type='checkbox'] {
  margin-top: 0px !important;
}

.filter-checkbox {
  flex-shrink: 0;
  position: relative;
  width: 20px;
  height: 20px;
  border: 1px solid var(--green-grey);
  appearance: none; /* Hide the default checkbox appearance */
  background-color: var(--off-white);
  cursor: pointer;
}

/* Remove focus outline */
.filter-checkbox:focus {
  outline: none;
  box-shadow: none; /* Prevent browsers like Chrome from showing blue border */
}

.filter-checkbox:focus-visible {
  outline: none;
  box-shadow: none;
}

/* Checkbox before checked state */
/* Checked state */
.filter-checkbox:checked {
  background-color: var(--off-white); /* Keep the background the same */
  border-color: var(--green-grey);    /* Keep the border the same */
}

.filter-checkbox:checked::before {
  content: ''; /* No text, just a square */
  position: absolute;
  top: 50%;
  left: 50%;
  width: 10px;  /* Size of the black square */
  height: 10px; /* Size of the black square */
  background-color: var(--black); /* Black square */
  transform: translate(-50%, -50%); /* Center the square */
}

.radio-wrapper{
  margin-top: 30px;
}

input[type='radio'] {
  margin-top: 0px !important;
}

.filter-radio {
  flex-shrink: 0;
  position: relative;
  width: 20px;
  height: 20px;
  border: 1px solid var(--green-grey);
  border-radius: 50%; /* Make it circular like a radio button */
  appearance: none; /* Hide the default radio appearance */
  background-color: var(--off-white);
  cursor: pointer;
}

/* Remove focus outline */
.filter-radio:focus {
  outline: none;
  box-shadow: none; /* Prevent browsers from showing focus outline */
}

.filter-radio:focus-visible {
  outline: none;
  box-shadow: none;
}

/* Radio button checked state */
.filter-radio:checked {
  background-color: var(--off-white); /* Keep the background the same */
  border-color: var(--green-grey);    /* Keep the border the same */
}

/* Radio button inner dot when checked */
.filter-radio:checked::before {
  content: ''; /* No text, just the inner dot */
  position: absolute;
  top: 50%;
  left: 50%;
  width: 10px;  /* Size of the inner dot */
  height: 10px; /* Size of the inner dot */
  background-color: var(--black); /* Black dot */
  border-radius: 50%; /* Make the dot circular */
  transform: translate(-50%, -50%); /* Center the dot */
}

.option-name {
  font-family: 'SwitzerVariable';
  font-size: 19px;
  font-weight: 400;
  line-height: 25.08px;
  letter-spacing: 0.01em;
  text-align: left;  
  color: var(--black);
}

label {
  margin: 0;
}

.option-count {
  align-self: flex-start;
  font-family: 'SwitzerVariable';
  font-size: 16px;
  font-weight: 300;
  line-height: 21.12px;
  letter-spacing: 0.01em;
  text-align: left;
  color: var(--black-70);  
}

.sort-options {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  margin: 30px 50px 20px 20px;
}

.selection-options {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  margin: 0 50px 0 20px;
}

.selection-options *:active {
  color: var(--black-70);
}

.sort-options > :nth-child(2) {
  margin-left: 10px !important;
}
.sort-options > :nth-child(3) {
  margin-left: auto !important;
}
.sort-options > :nth-child(4) {
  margin-left: 10px !important;
}

.contextual-menu button, #languages button[data-filter="languages"] {
  color: var(--green-grey);
  font-family: 'SwitzerVariable';
  font-size: 19px;
  font-weight: 300;
  line-height: 25.08px;
  letter-spacing: 0.01em;
  text-align: left;
}

.contextual-menu button.active-sort{
  color: var(--black) !important;
}

.contextual-menu button .toggle-icon {
  width: 19px;
  height: 11px;
  margin: 0;
  filter: invert(49%) sepia(21%) saturate(420%) hue-rotate(95deg) brightness(90%) contrast(90%);
}

.contextual-menu button.active-sort .toggle-icon {
  filter: unset;
}

.upside-down {
  transform: rotate(180deg);
}

.active-filters-section {
  width: 100%;
  padding: 0 25px 0 25px;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 10px;
}

.active-filter-category {
  display: flex;
  flex-direction: column;
  gap: 5px;
  border: 1px solid var(--green-grey-low-light);
}

.active-filter-category h3 {
  font-family: 'SwitzerVariable';
  font-size: 14px;
  font-weight: 300;
  line-height: 18.48px;
  letter-spacing: 0.06em;
  text-align: left;
  text-transform: uppercase;
  color: var(--black);
  padding: 0 10px;
  margin: 8px 0 0 0;
}

.active-filter-options-wrapper {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 8px;
  /* padding: 10px; */
}

.active-filter-options-wrapper button {
  padding: 7px 14px;
  margin: -1px;
  border: 1px solid var(--green-grey);
  font-family: 'SwitzerVariable';
  font-size: 14px;
  font-weight: 300;
  line-height: 18.48px;
  letter-spacing: 0.06em;
  text-align: left;
  color: var(--black);
}

.active-filter-button {
  text-decoration: unset;
}

.active-filter-button.removing-fitler {
  text-decoration: line-through;
  text-decoration-color: var(--black);

}

.active-filter-button::after {
  content: '';
  background-image: url('../icons/neu/cancel.png');
  background-size: 12px 12px;
  background-repeat: no-repeat;
  /* position: absolute;
  right:  */
  display: inline-block;
  margin-left: 10px;
  vertical-align: baseline;
  width: 12px;
  height: 12px;
  object-fit: contain;
}

.duration-slider-container {
  padding: 50px 20px 0 20px;
}

.duration-text-wrapper {
  font-family: 'SwitzerVariable';
  font-size: 19px;
  font-weight: 400;
  line-height: 25.08px;
  letter-spacing: 0.01em;
  text-align: left;
  color: var(--black);
  margin-bottom: 41px;
}

#duration_slider.noUi-target {
  background: unset;
  border-radius: 0;
  border: unset;
  box-shadow: unset;
}

.noUi-background {
  height: 22px;
}

.noUi-base .noUi-connects {
  border: 1px solid var(--green-grey);
  background-color: unset;
  border-radius: 0;
}

.noUi-base .noUi-connect {
  background-color: var(--green-grey-low-light);
}

.noUi-base .noUi-handle {
  width: 18px;
  height: 44px;
  transform: translateX(-9px);
  top: -13.5px;
  background-color: var(--black);
  box-shadow: unset;
  border: unset;
  border-radius: 0;
}

.noUi-base .noUi-handle::before {
  display:none;
  visibility: hidden;
}
  
.noUi-base .noUi-handle::after {
  display:none;
  visibility: hidden;
}

@media screen and (min-width: 450px) and (max-width: 1200px) {
  #text-search-bar {
    margin: 0 40px;
    flex-direction: row;
  }

  input[type="search"] {
    height: 83px;
  }

  #text-search-button {
    border-top: unset;
    border-left: 1px solid var(--green-grey);
    height: 83px;
    padding: 0 45px;
  }

  .tab-toggle-outter-wrapper {
    width: 100%;
    border-bottom: 1px solid var(--green-grey-low-light);
  }
  
  #tab_toggle_wrapper {
    height: 122px;
    width: calc(100% - 80px);
    margin: 0 40px;
    border-bottom: unset;
    border-left:  1px solid var(--green-grey-low-light);
    border-right:  1px solid var(--green-grey-low-light);
  }

  .filter-opening-outter-wrapper {
    border-bottom: 1px solid var(--green-grey-low-light);
  }

  .filter-opening-spacer {
    height: 25px;
    margin: 0 40px;
    border-left: 1px solid var(--green-grey-low-light);
    border-right: 1px solid var(--green-grey-low-light);
  }

  #open-filter-button {
    height: 58px;
  }

  #outer-reset-filter-button.active {
    height: 58px;
  }

  .filter-opening-wrapper {
    margin: 0 40px;
    width: calc(100% - 80px);
  }

  .filter-top-container {
    height: 238px;
  }

  .filter-bottom-container {
    height: 145px;
  }

  .filter-bottom-container button {
    margin: 25px auto 62px auto;
    width: 353px; 
  }

  .filter-top-wrapper {
    width: calc(100% - 80px);
    margin: 50px 40px 21px 40px;
  }

  .filter-top-row {
    height: 72px;
  }

  .button-with-icon.filter-count-element {
    justify-content: center;
    gap: 25px;
    padding: unset;
  }

  #cancel-button {
    flex-grow: 1;
  }

  .filter-category-1 {
    padding: 23px 40px 20px 40px;
  }

  .filter-category-2 {
    padding: 17px 40px 15px 40px;
  }

  .button-with-icon {
    height: unset;
  }

  .sort-options {
    margin: 30px 40px 20px 40px;
  }

  .selection-options {
    margin: 30px 40px 20px 40px;
  }

  .checkbox-and-counter-wrapper {
    margin: 0 40px 0 40px;
  }

  .active-filters-section {
    width: calc(100% - 80px);
    margin: 30px 40px 60px 40px;
    gap: 20px;
    padding: unset;
  }
}

/* Regular computer screens (1200px to 1600px) */
@media screen and (min-width: 1200px) and (max-width: 1600px) {
  /* Styles for regular desktops */
  #text-search-bar {
    margin: 0 calc(50% - 0.5 * 1140px);
    margin-top:-1px;
    flex-direction: row;
  }

  input[type="search"] {
    height: 83px;
  }

  #text-search-button {
    border-top: unset;
    border-left: 1px solid var(--green-grey);
    height: 83px;
    padding: 0 45px;
  }

  .tab-toggle-outter-wrapper {
    border-top: 1px solid var(--green-grey-low-light);
    border-bottom: 1px solid var(--green-grey-low-light);
    margin-top: -1px;
  }

  #tab_toggle_wrapper {
    border-left: 1px solid var(--green-grey-low-light);
    border-right: 1px solid var(--green-grey-low-light);
    margin: 0 calc(50% - 0.5 * 1140px);
    margin-bottom: -1px;
    height: 122px;
    width: 1140px;
  }

  .collapsable-filter-wrapper {
    position: unset;
    transform: translateX(0);
    visibility: visible;
    height: auto;
  }

  .filter-opening-outter-wrapper {
    display: none;
  }

  .filter-top-container {
    height: 105px;
  }

  .filter-top-wrapper {
    flex-direction: row;
    margin: 25px calc(50% - 0.5 * 1140px);
    margin-bottom: 30px;
    width: 1140px;
  }

  .filter-top-row {
    width: auto;
    height: 58px;
  }

  #union-toggle {
    min-width: 312px;
  }

  #cancel-button {
    width: auto;
    padding: 0 30px;
  }
  
  .neu.button-with-icon.desktop {
    border: 1px solid var(--green-grey);
    flex-grow: 1;
    height: 100%;
    padding: 0 30px;
  }

  #inner-reset-filter-button {
    gap: 10px;
  }

  .collapsable-filter-wrapper {
    border-bottom: 1px solid var(--green-grey-low-light)
  }

  .collapsable-filter-wrapper.active #open-filter-button-desktop {
    display: none;
  }
  .collapsable-filter-wrapper #open-filter-button-desktop {
    display: flex;
  }
  .collapsable-filter-wrapper.active #apply-filter-button-desktop,
  .collapsable-filter-wrapper.active #cancel-button {
    display: flex;
  }
  .collapsable-filter-wrapper #apply-filter-button-desktop,
  .collapsable-filter-wrapper #cancel-button {
    display: none;
  }

  .top-filter .button-with-icon {
    gap: 21px;
  }

  .filter-bottom-container {
    display: none;
  }

  .filter-middle-container {
    min-height: 0;
    /* height: 481px; */
    display: flex;
    width: 1140px;
    margin: 0 calc(50% - 0.5 * 1140px);
    gap: 12px;
    transition: height 0.55s ease-out;
  }

  #collapsable-filter-wrapper #filter-middle-container {
    height: 0;
  }

  #collapsable-filter-wrapper.active #filter-middle-container {
    height: 481px;
  }

  .filter-column-desktop {
    border-left: 1px solid var(--green-grey-low-light);
    border-right: 1px solid var(--green-grey-low-light);
    display: flex;
    position: relative;
    width: 372px;
  }

  #technical-data-categories, #autors {
    z-index: 2;
  }

  .filter-category-1 .arrow-icon {
    display: none;
  }

  .filter-category-1.desktop-active,
  .filter-category-2.desktop-active {
    background-color: var(--green-grey-low-light);
  }

  .filter-view.slide-in-left,
  .filter-view.slide-in-right,
  .filter-view.slide-out-left,
  .filter-view.slide-out-right {
    z-index: 1;
    visibility: visible;
    transform: translateX(0);
  }
  .filter-top-wrapper.slide-in-left,
  .filter-top-wrapper.slide-in-right,
  .filter-top-wrapper.slide-out-left,
  .filter-top-wrapper.slide-out-right {
    z-index: 1;
    visibility: visible;
    transform: translateX(0);
  }

  .filter-view.active,
  .filter-view.desktop-active {
    z-index: 5;
  }

  #filter-contextual-menu {
    display: none;
  }

  .active-filters-section {
    width: 1140px;
    margin: 80px calc(50% - 0.5 * 1140px);
    margin-top: 30px;
    padding: 0;
  }
}

/* Huge computer screens (1600px and above) */
@media screen and (min-width: 1600px) {
  /* Styles for large desktops */
}