.search-page-main {
  background-color: #eeeeee;
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 100%;
  height: 90vh;
  overflow-y: hidden;
}
.search-page-main .searchBarContainer{
	flex: 1; 
}
.search-page-main .restOfContainer {
	flex: 19;  
	overflow-y: hidden;
	display: flex;
	height: 100%;
	margin-top: 0.5em; 
}

.search-page-main .advancedContainer {
	flex: 1;
	height: 100%; 
	overflow-y: hidden;
}
.search-page-main .searchContainer {
	flex: 5;
  display: flex; 
  overflow-x: hidden;
  flex-direction: column;
  
}
.search-page-main .searchContainer.mobile {
  display: none;
}

.search-page-main .div {
  background-color: #eeeeee;
  width: 100%;
  height: 100vh;
  position: relative;
}
.search-page-main .results-container {
  flex: 16; 
  margin-left: 1%;
  width: 98%;
  overflow: hidden; 
}
.search-page-main .frame-32,
.search-page-main .results-information-frame {
  display: flex;
  flex: 1; 
  width: 98%;
  align-items: center;
  justify-content: space-between;
  padding: 12px;
  /*margin-top: 0.5em;*/
  margin-left: 1%;
  background-color: #ffffff;
}

.search-page-main .results-information-container {
  display: flex;
  width: 100%;
  flex-wrap: wrap; 
  align-items: center;
  gap: 8px;
  position: relative;
}

.search-page-main .checkbox {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  position: relative;
  flex: 0 0 auto;
  cursor: pointer;

  input[type="checkbox"] {
    display: none;
  }
}

.search-page-main .checkbox-input {
  display: inline-flex;
  flex-direction: column;
  justify-content: center;
  background-color: var(--brand-colorswhite);
  border-radius: 2px;
  align-items: center 4px;
  position: relative;
  flex: 0 0 auto;
}

.search-page-main .bg {
  position: relative;
  width: 16px;
  height: 16px;
  background-color: var(--brand-colorswhite);
  border-radius: 2px;
  border: 2px solid;
  border-color: #afb2b7;
  cursor: pointer;
}
.search-page-main .sort-container {
  display: flex; 
  gap: 1em;
  align-items: flex-end;
  width: fit-content;
}
/* Show the checked state of the custom checkbox */
.search-page-main .checkbox input[type="checkbox"]:checked + .checkbox-input .bg {
  border-color: var(--brand-colorsoxford-blue);
  background: var(--brand-colorsoxford-blue);
  background-image: url('../img/check-white.svg'); /* Replace 'check.png' with your image path */
  background-size: contain; /* Ensure the image fits inside the checkbox */
  background-repeat: no-repeat; /* Prevent the image from repeating */
  background-position: center;
  background-size: 80%
}

.search-page-main .img {
  position: relative;
  width: 24px;
  height: 24px;
}

.search-page-main .columnheader {
  width: fit-content;
  font-family: "Circular Std-Book", Helvetica;
  font-weight: 400;
  letter-spacing: 0.4px;
  line-height: normal;
  position: relative;
  color: #4d5056;
  font-size: 14px;
}

.search-page-main .columnheader-wrapper {
  display: inline-flex;
  height: 22px;
  align-items: center;
  gap: 10px;
  padding: 5px 3px;
  position: relative;
  flex: 0 0 auto;
  background-color: var(--brand-colorsoxford-blue);
}

.search-page-main .text-wrapper {
  margin-bottom: -2px;
  color: #ffffff;
  letter-spacing: 0;
  width: fit-content;
  font-family: "Manrope", Helvetica;
  font-weight: 500;
  font-size: 14px;
  line-height: 18px;
  white-space: normal;
}

.search-page-main .text-wrapper-2 {
  position: relative;
  width: fit-content;
  margin-top: -3px;
  margin-bottom: -1px;
  font-family: "Manrope", Helvetica;
  font-weight: 500;
  color: #ffffff;
  font-size: 14px;
  letter-spacing: 0;
  line-height: 18px;
  white-space: nowrap;
}

.search-page-main .div-wrapper {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 0px 3px;
  position: relative;
  flex: 0 0 auto;
  margin-top: -2px;
  margin-bottom: -2px;
  background-color: #ffffff;
  border-radius: 15px;
}

.search-page-main .text-wrapper-3 {
  position: relative;
  width: fit-content;
  margin-top: -1px;
  font-family: "Manrope", Helvetica;
  font-weight: 500;
  color: var(--brand-colorsoxford-blue);
  font-size: 14px;
  letter-spacing: 0;
  line-height: 18px;
  white-space: nowrap;
}

.search-page-main .vector {
  position: relative;
  width: 8px;
  height: 4.79px;
}

.search-page-main .table {
  display: flex;
  width: calc(100% - 84px - 325px);
  height: calc(100vh - 60px - 68px - 58px - 140px);
  align-items: flex-start;
  position: absolute;
  top: 236px;
  left: 381px;
  background-color: var(--neutral-colorsneutral-8);
  overflow: hidden auto;
  border: 1px solid;
  border-color: #dedfe3;
}

.search-page-main .column {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  position: relative;
  flex: 0 0 auto;
  margin-bottom: -62px;
}

.search-page-main .head {
  display: inline-flex;
  height: 54px;
  align-items: center;
  gap: 12px;
  padding: 18px 12px;
  position: relative;
  background-color: var(--neutral-colorsneutral-8);
  border-bottom-width: 1px;
  border-bottom-style: solid;
  border-color: #dedfe3;
}

.search-page-main .bg-wrapper {
  display: inline-flex;
  flex-direction: column;
  justify-content: center;
  background-color: var(--neutral-colorsneutral-8);
  border-radius: 2px;
  align-items: center;
  position: relative;
  flex: 0 0 auto;
}

.search-page-main .bg-2 {
  border-color: var(--neutral-colorsneutral-2);
  position: relative;
  width: 16px;
  height: 16px;
  background-color: var(--neutral-colorsneutral-8);
  border-radius: 2px;
  border: 2px solid;
}

.search-page-main .row {
  /*display: inline-flex;
  height: 54px;
  align-items: center;
  gap: 12px;
  padding: 15px 12px 16px;
  position: relative;
  background-color: var(--neutral-colorsneutral-8);
  border-bottom-width: 1px;
  border-bottom-style: solid;
  border-color: #dedfe3;*/
}

.search-page-main .head-2 {
  display: flex;
  height: 54px;
  align-items: center;
  gap: 12px;
  padding: 18px 12px;
  position: relative;
  align-self: stretch;
  width: 100%;
  background-color: var(--neutral-colorsneutral-8);
  border-bottom-width: 1px;
  border-bottom-style: solid;
  border-color: #dedfe3;
}

.search-page-main .columnheader-2 {
  margin-top: -1px;
  color: #000a14;
  letter-spacing: var(--table-table-header-1-letter-spacing);
  position: relative;
  width: fit-content;
  font-family: var(--table-table-header-1-font-family);
  font-weight: var(--table-table-header-1-font-weight);
  font-size: var(--table-table-header-1-font-size);
  line-height: var(--table-table-header-1-line-height);
  white-space: nowrap;
  font-style: var(--table-table-header-1-font-style);
}

.search-page-main .row-2 {
  display: flex;
  height: 54px;
  align-items: center;
  gap: 12px;
  padding: 15px 12px 16px;
  position: relative;
  align-self: stretch;
  width: 100%;
  background-color: var(--neutral-colorsneutral-8);
  border-bottom-width: 1px;
  border-bottom-style: solid;
  border-color: #dedfe3;
}

.search-page-main .columnheader-3 {
  margin-top: -1px;
  color: #000a14;
  font-size: var(--subheader-subheader3-font-size);
  letter-spacing: var(--subheader-subheader3-letter-spacing);
  line-height: var(--subheader-subheader3-line-height);
  position: relative;
  align-self: stretch;
  font-family: var(--subheader-subheader3-font-family);
  font-weight: var(--subheader-subheader3-font-weight);
  font-style: var(--subheader-subheader3-font-style);
}

.search-page-main .row-3 {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 15px 12px 16px;
  background-color: var(--neutral-colorsneutral-8);
  overflow: hidden;
  border-bottom-width: 1px;
  border-bottom-style: solid;
  border-color: #dedfe3;
  height: 54px;
  position: relative;
  align-self: stretch;
  width: 100%;
}

.search-page-main .columnheader-4 {
  color: #888a8f;
  font-size: var(--subheader-subheader6-font-size);
  letter-spacing: var(--subheader-subheader6-letter-spacing);
  line-height: var(--subheader-subheader6-line-height);
  position: relative;
  align-self: stretch;
  font-family: var(--subheader-subheader6-font-family);
  font-weight: var(--subheader-subheader6-font-weight);
  font-style: var(--subheader-subheader6-font-style);
}

.search-page-main .columnheader-5 {
  flex: 1;
  margin-top: -7.5px;
  margin-bottom: -5.5px;
  font-family: var(--table-table-body-2-font-family);
  font-weight: var(--table-table-body-2-font-weight);
  letter-spacing: var(--table-table-body-2-letter-spacing);
  line-height: var(--table-table-body-2-line-height);
  position: relative;
  color: var(--neutral-colorsneutral-2);
  font-size: var(--table-table-body-2-font-size);
  font-style: var(--table-table-body-2-font-style);
}

.search-page-main .img-3 {
  position: relative;
  width: 24px;
  height: 24px;
  cursor: pointer;
}

.search-page-main .card {
  display: flex;
  width: 100%;
  align-items: flex-start;
  gap: 12px;
  padding: 20px 12px;
  position: relative;
  flex: 0 0 auto;
  background-color: var(--neutral-colorsneutral-8);
  border-bottom-width: 1px;
  border-bottom-style: solid;
  border-color: #dedfe3;
}

.search-page-main .frame-34 {
  display: flex;
  margin-bottom: 28px;
  flex-direction: column;
  height: 700px;
  overflow: hidden auto;
}

.search-page-main .frame-35 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  position: relative;
  flex: 1;
  align-self: stretch;
  flex-grow: 1;
}

.search-page-main .frame-36 {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 10px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.search-page-main .frame-37 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  position: relative;
  flex: 1;
  flex-grow: 1;
}

.search-page-main .frame-38 {
  display: flex;
  flex-direction: column;
  flex: 1;
  align-items: flex-start;
  gap: 8px;
  position: relative;
}

.search-page-main .frame-39 {
  display: flex;
  align-items: flex-start;
  gap: 4px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.search-page-main .column-2 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  position: relative;
  flex: 1;
  flex-grow: 1;
  margin-bottom: -62px;
}

.search-page-main .head-3 {
  display: flex;
  justify-content: center;
  align-self: stretch;
  width: 100%;
  height: 54px;
  align-items: center;
  gap: 12px;
  padding: 18px 12px;
  position: relative;
  background-color: var(--neutral-colorsneutral-8);
  border-bottom-width: 1px;
  border-bottom-style: solid;
  border-color: #dedfe3;
}

.search-page-main .row-4 {
  height: 54px;
  position: relative;
  align-self: stretch;
  width: 100%;
}

.search-page-main .row-5 {
  height: 46px;
  position: relative;
  align-self: stretch;
  width: 100%;
}

.search-page-main .row-6 {
  height: 54px;
  margin-top: -7261px;
  margin-right: -3729px;
  position: relative;
  align-self: stretch;
  width: 100%;
}

.search-page-main .frame-31,
.search-page-main .search-bar-frame{
  display: flex;
  width: 98%;
  align-items: flex-start;
  justify-content: space-between;
  margin-top: 1.5em;
  margin-left: 1%;
  overflow-y: visible;
}

.search-page-main .searching-container {
  display: inline-flex;
  align-items: flex-start;
  gap: 6px;
  position: relative;
  flex: 0 0 auto;
  height: 34px;
}

.search-page-main .search-icon {
  position: relative;
  width: 34px;
  height: 34px;
}

.search-page-main .search-input-container {
  display: flex;
  width: 249px;
  height: 34px;
  align-items: center;
  gap: 10px;
  position: relative;
  margin-top: 1px;
}

.search-page-main .text-wrapper-4 {
  position: relative;
  width: 100%;
  margin-top: -3px;
  margin-bottom: -1px;
  font-family: "Manrope", Helvetica;
  font-weight: 500;
  color: #000a14;
  font-size: 14px;
  letter-spacing: 0;
  line-height: 18px;
  white-space: nowrap;
  height: 34px;
  border: 1px solid;
  border-color: #dedfe3;
  padding: 10px 12px;
}

.search-page-main .text-wrapper-4:focus,
.search-page-main .text-wrapper-4:focus-visible {
  outline: unset;
}

.search-page-main .search-types-container {
  display: flex;
  width: 101px;
  height: 34px;
  overflow-y: visible;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  padding-left: 0.5em;
  position: relative;
  background-color: var(--neutral-colorsneutral-8);
  border: 1px solid;
  border-color: #dedfe3;
  cursor: pointer;
}

.search-page-main .dropdown .dropdown-menu {
  /*position: absolute;
  width: 150px;
  top: 36px;
  z-index: 110;
  left: 0px;*/
  background-color: var(--neutral-colorsneutral-8);
  border-radius: 8px;
  box-shadow: 0px 8px 24px 0px rgba(119, 131, 146, 0.08), 0px 6px 12px 0px rgba(119, 131, 146, 0.12);

  &.hidden {
    display: none;
  }

  li {
    /*display: flex;
    height: 40px;
    align-items: center;
    padding: 10px 12px;*/
  
    font-family: "Manrope", Helvetica;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 18px;
    
    a {
      color: var(--neutral-colorsneutral-2);
    }
  
    /*&:first-child {
      border-top-left-radius: 8px;
      border-top-right-radius: 8px;
    }
  
    &:last-child {
      border-bottom-left-radius: 8px;
      border-bottom-right-radius: 8px;
    }
  
    &:hover {
      background-color: var(--brand-colorsoxford-blue);
      color: #fff;
    }*/
  }
}
.search-page-main .side-menu-2 .dropdown .dropdown-menu {
	border-radius: 4px;	
}
.search-page-main .side-menu-2 .dropdown .dropdown-menu>li {
    padding: .7em 1.5em;
    text-align: left;
    font-size: 14px;
    cursor: pointer;
}
.dropdown-menu>li>a {
	color: var(--neutral-colorsneutral-2);
}

.search-page-main .sort-by-button-frame {
  display: inline-flex;
  height: 34px;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 10px;
  position: relative;
  flex: 0 0 auto;
  background-color: var(--brand-colorsoxford-blue);
  border-radius: 4px;
  cursor: pointer;
  
  &.dropdown {
    .dropdown-menu {
      border-radius: unset;    
      width: 132px;
      top: 36px;
      z-index: 110;
      right: 0px;
      left: unset;

      li {
        border-radius: unset;
      }
    }
  }
}

.search-page-main .text-wrapper-5 {
  position: relative;
  flex: 1;
  margin-bottom: -1px;
  font-family: "Manrope", Helvetica;
  font-weight: 500;
  color: #000a14;
  font-size: 14px;
  letter-spacing: 0;
  line-height: 18px;
}

.search-page-main .search-types-container .text-wrapper-5 {
  position: relative;
  font-family: "Manrope", Helvetica;
}

.search-page-main .search-bar-icon-container {
  position: relative;
  flex: 0 0 auto;
}
.search-page-main .search-bar-icon-container label { 
  border-radius: 0;
}

.search-page-main .frame-9 {
  display: flex;
  width: 100%;
  height: 60px;
  align-items: center;
  justify-content: space-between;
  padding: 12px 28px;
  position: absolute;
  top: 0;
  left: 0;
  background-color: var(--brand-colorsoxford-blue);
}

.search-page-main .frame-10 {
  display: flex;
  width: 858.5px;
  align-items: center;
  gap: 24px;
  position: relative;
}

.search-page-main .group {
  position: relative;
  width: 99px;
  height: 30px;
}

.search-page-main .image {
  position: absolute;
  width: 30px;
  height: 30px;
  top: 0;
  left: 0;
}

.search-page-main .text-wrapper-6 {
  position: absolute;
  top: 1px;
  left: 34px;
  font-family: "Optima-Bold", Helvetica;
  font-weight: 700;
  color: var(--neutral-colorsneutral-8);
  font-size: 22px;
  letter-spacing: 0;
  line-height: normal;
}

.search-page-main .navbar {
  display: inline-flex;
  align-items: flex-start;
  gap: 16px;
  position: relative;
  flex: 0 0 auto;
}

.search-page-main .text-wrapper-7 a {
  position: relative;
  width: fit-content;
  margin-top: -1px;
  font-family: var(--button-btn2-font-family);
  font-weight: var(--button-btn2-font-weight);
  color: var(--brand-colorsecru);
  font-size: var(--button-btn2-font-size);
  letter-spacing: var(--button-btn2-letter-spacing);
  line-height: var(--button-btn2-line-height);
  white-space: nowrap;
  font-style: var(--button-btn2-font-style);
}

.search-page-main .text-wrapper-8 a {
  position: relative;
  width: fit-content;
  margin-top: -1px;
  font-family: var(--button-btn2-font-family);
  font-weight: var(--button-btn2-font-weight);
  color: var(--neutral-colorsneutral-8);
  font-size: var(--button-btn2-font-size);
  letter-spacing: var(--button-btn2-letter-spacing);
  line-height: var(--button-btn2-line-height);
  white-space: nowrap;
  font-style: var(--button-btn2-font-style);
}

.search-page-main .frame-11 {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 24px;
  position: relative;
  flex: 0 0 auto;
}

.search-page-main .frame-12 {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 4px;
  position: relative;
  flex: 0 0 auto;
}

.search-page-main .text-wrapper-9 {
  position: relative;
  width: fit-content;
  font-family: "Arial-Bold", Helvetica;
  font-weight: 700;
  color: var(--neutral-colorsneutral-8);
  font-size: 16px;
  letter-spacing: 0;
  line-height: normal;
  white-space: nowrap;
}

.search-page-main .frame-33,
.search-page-main .results-sort {
  display: flex;
  flex: 1;
  width: 98%;
  align-items: center;
  justify-content: space-between;
  padding: 0px 12px 0px 0px;
  margin-top: 0.5em;
  margin-left: 1%;
  background-color: #ffffff;
}

.search-page-main .frame-14 {
  display: inline-flex;
  height: 34px;
  align-items: center;
  gap: 10px;
  padding: 0px 6px;
  position: relative;
  flex: 0 0 auto;
  background-color: var(--brand-colorsoxford-blue);
  cursor: pointer;

  &.dropdown {
    .dropdown-menu {
      border-radius: unset;    
      width: 100px;
      z-index: 110;
      right: 0px;
      left: unset;

      li {
        border-radius: unset;
      }
      li:hover {
        color: white; 
      }
    }
  }
}

.search-page-main .content {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  position: relative;
  flex: 0 0 auto;
}

.search-page-main .text {
  position: relative;
  width: fit-content;
  font-family: "Manrope", Helvetica;
  font-weight: 500;
  color: #ffffff;
  font-size: 12px;
  letter-spacing: 0.05px;
  line-height: 16px;
  white-space: nowrap;
}

.search-page-main .frame-15 {
  display: inline-flex;
  flex-direction: column;
  height: 18px;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 0px 3px;
  position: relative;
  flex: 0 0 auto;
  background-color: #ffffff;
  border-radius: 13px;
}

.search-page-main .text-2 {
  font-weight: 500;
  color: var(--brand-colorsoxford-blue);
  font-size: 12px;
  letter-spacing: 0.05px;
  line-height: 16px;
  position: relative;
  width: fit-content;
  font-family: "Manrope", Helvetica;
  white-space: nowrap;
}

.search-page-main .results-footer {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  position: relative;
  flex: 0 0 auto;

  &.dropdown {
    .dropdown-menu {
      border-radius: unset;
      top: 30px;
      left: -90px;
      width: 150px;
      li {
        border-radius: unset;
      }
    }
  }
}

.search-page-main .components {
  display: flex;
  width: 24px;
  height: 24px;
  justify-content: center;
  padding: 1px 8px;
  border-radius: 2px;
  overflow: hidden;
  border: 2px solid;
  border-color: var(--brand-colorsoxford-blue);
  flex-direction: column;
  align-items: center;
  gap: 10px;
  position: relative;
  cursor: pointer;
}

.search-page-main .text-wrapper-10 {
  width: fit-content;
  color: var(--brand-colorsoxford-blue);
  white-space: nowrap;
  position: relative;
  font-family: "Manrope", Helvetica;
  font-weight: 500;
  font-size: 14px;
  text-align: center;
  letter-spacing: 0;
  line-height: 18px;
}

.search-page-main .ellipsis-wrapper {
  display: inline-flex;
  flex: 0 0 auto;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  position: relative;
}

.search-page-main .ellipsis {
  position: relative;
  width: fit-content;
  margin-top: -1px;
  font-family: "Manrope", Helvetica;
  font-weight: 500;
  color: #888a8f;
  font-size: 14px;
  text-align: center;
  letter-spacing: 0;
  line-height: 18px;
  white-space: nowrap;
}

.search-page-main .components-2 {
  display: flex;
  flex-direction: column;
  width: 24px;
  height: 24px;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 1px 8px;
  position: relative;
  border-radius: 2px;
  overflow: hidden;
  cursor: pointer;
}

.search-page-main .text-wrapper-11 {
  position: relative;
  width: fit-content;
  margin-left: -0.5px;
  margin-right: -0.5px;
  font-family: "Manrope", Helvetica;
  font-weight: 500;
  color: var(--neutral-colorsneutral-1);
  font-size: 14px;
  text-align: center;
  letter-spacing: 0;
  line-height: 18px;
  white-space: nowrap;
}

.search-page-main .text-wrapper-12 {
  width: 8px;
  color: var(--neutral-colorsneutral-1);
  position: relative;
  font-family: "Manrope", Helvetica;
  font-weight: 500;
  font-size: 14px;
  text-align: center;
  letter-spacing: 0;
  line-height: 18px;
}

.search-page-main .text-wrapper-13 {
  width: fit-content;
  color: var(--neutral-colorsneutral-1);
  white-space: nowrap;
  position: relative;
  font-family: "Manrope", Helvetica;
  font-weight: 500;
  font-size: 14px;
  text-align: center;
  letter-spacing: 0;
  line-height: 18px;
}

.search-page-main .text-wrapper-14 {
  width: fit-content;
  margin-left: -4.5px;
  margin-right: -4.5px;
  color: var(--neutral-colorsneutral-1);
  white-space: nowrap;
  position: relative;
  font-family: "Manrope", Helvetica;
  font-weight: 500;
  font-size: 14px;
  text-align: center;
  letter-spacing: 0;
  line-height: 18px;
}

.search-page-main .side-menu {
  width: 100%;
  height: 100%;
  background-color: #ffffff;
  overflow: hidden;
  display: flex;
  flex-direction: column; 
}

.search-page-main .frame-16 {
  display: flex;
  flex-direction: column;
  width: 277px;
  align-items: flex-start;
  gap: 20px;
  position: absolute;
  top: 72px;
  left: 24px;
}

.search-page-main .div-3 {
  display: flex;
  flex: 19;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  overflow-y: auto;
  align-self: stretch;
  width: 100%;
}
.search-page-main .advancedPanelContainer {
  width: 100%; 
  margin-top: 1%;
  overflow-y: auto; 
  overflow-x: hidden;
}

.search-page-main .insert-text-here {
  position: relative;
  align-self: stretch;
  margin-top: -1px;
  margin-left: 1em; 
  font-family: "Circular Std-Book", Helvetica;
  font-weight: 400;
  color: var(--neutral-colorsneutral-2);
  font-size: 14px;
  letter-spacing: -0.1px;
  line-height: 18px;
}

.search-page-main .frame-17 {
  display: flex;
  height: 48px;
  align-items: center;
  gap: 8px;
  position: relative;
  align-self: stretch;
  width: 100%;

  &.dropdown {
    border: 1px solid;
    border-color: #dedfe3;

    .label-text {
      display: flex;
      align-items: center;
      border: unset;
      padding: 7px 12px;
    }

    .dropdown-menu {
      top: 49px;
      width: 100%;
    }
  }

  &.calendar {
    border: 1px solid;
    border-color: #dedfe3;

    input {
      display: flex;
      align-items: center;
      border: unset;
      border-top: 1px solid;
      border-bottom: 1px solid;
      border-color: #dedfe3;
      padding: 6px 12px;
    }

    .img {
      margin: 8px;
      height: 20px;
      width: 20px;
    }
  }

}

.search-page-main .text-wrapper-15 {
  flex: 1;
  font-size: 16px;
  margin-left: 1.25em;
  letter-spacing: -0.2px;
  line-height: 21px;
  position: relative;
  font-family: "Circular Std-Book", Helvetica;
  font-weight: 400;
  color: var(--neutral-colorsneutral-2);
  
  height: 48px;
  border: 1px solid;
  border-color: #dedfe3;
  padding: 7px 12px;

  &:focus,
  &:focus-visible {
    outline: unset;
  }
}

.search-page-main .input-fields {
  width: 277px;
  position: absolute;
  top: 256px;
  left: 24px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
}

.search-page-main .input-fields-2 {
  width: 277px;
  position: absolute;
  top: 350px;
  left: 24px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
}

.search-page-main .frame-18 {
  display: flex;
  flex-direction: column;
  width: 277px;
  align-items: flex-start;
  gap: 20px;
  position: absolute;
  top: 444px;
  left: 24px;
}

.search-page-main .dropdown-with-chips {
  display: inline-flex;
  z-index: 2;
  flex-direction: column;
  align-items: flex-start;
  position: relative;
  flex: 0 0 auto;
}

.search-page-main .dropdown-with-chips-2 {
  display: flex;
  flex-direction: column;
  width: 277px;
  align-items: flex-start;
  gap: 4px;
  position: relative;
  flex: 0 0 auto;
}

.search-page-main .dropdown-with-chips-wrapper {
  display: inline-flex;
  z-index: 0;
  flex-direction: column;
  align-items: flex-start;
  position: relative;
  flex: 0 0 auto;
}

.search-page-main .p {
  flex: 1;
  margin-top: -6px;
  margin-bottom: -2px;
  font-size: 16px;
  letter-spacing: -0.2px;
  line-height: 21px;
  position: relative;
  font-family: "Circular Std-Book", Helvetica;
  font-weight: 400;
  color: var(--neutral-colorsneutral-2);
}

.search-page-main .dropdown-with-chips-3 {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  position: relative;
  flex: 0 0 auto;
}

.search-page-main .input-fields-3 {
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
}

.search-page-main .frame-19 {
  display: flex;
  flex-direction: column;
  width: 277px;
  align-items: flex-start;
  justify-content: center;
  gap: 24px;
  position: absolute;
  top: 808px;
  left: 24px;
}

.search-page-main .right-icon {
  position: relative;
  width: 24px;
  height: 1px;
}

.search-page-main .frame-20 {
  display: flex;
  height: 48px;
  align-items: center;
  gap: 8px;
  padding: 7px 12px;
  position: relative;
  align-self: stretch;
  width: 100%;
  background-color: var(--neutral-colorsneutral-8);
  overflow: hidden;
  border: 2px solid;
  border-color: #dedfe3;
}

.search-page-main .chevron-container {
  margin-top: -8796px;
  margin-right: -12px;
  position: relative;
  width: 24px;
  height: 24px;
}

.search-page-main .frame-21 {
  display: flex;
  flex-direction: column;
  width: 277px;
  align-items: flex-start;
  gap: 4px;
  position: absolute;
  top: 996px;
  left: 24px;
}

.search-page-main .text-wrapper-16 {
  position: relative;
  align-self: stretch;
  margin-top: -1px;
  font-family: "Circular Std-Book", Helvetica;
  font-weight: 400;
  color: #4d5056;
  font-size: 14px;
  letter-spacing: -0.1px;
  line-height: 18px;
}

.search-page-main .frame-22 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.search-page-main .label {
  position: relative;
  width: fit-content;
  height: fit-content; 
  margin-top: 0.1em;
  font-family: "Circular Std-Book", Helvetica;
  font-weight: 400;
  color: #4d5056;
  font-size: 14px;
  letter-spacing: 0;
  line-height: 18px;
  display:flex;
  white-space: normal;
}
.removeTag {
  color: white;
}

.search-page-main .frame-23 {
  display: flex;
  flex-direction: column;
  width: 277px;
  align-items: flex-start;
  justify-content: flex-end;
  gap: 24px;
  position: absolute;
  top: 1212px;
  left: 24px;
}

.search-page-main .frame-24 {
  display: flex;
  flex-direction: column;
  width: 170px;
  align-items: flex-start;
  gap: 4px;
  position: relative;
  flex: 0 0 auto;
}

.search-page-main .checkbox-2 {
  display: flex;
  gap: 8px;
  align-self: stretch;
  width: 100%;
  align-items: center;
  position: relative;
  flex: 0 0 auto;
}

.search-page-main .primary-button {
  all: unset;
  box-sizing: border-box;
  display: flex;
  width: 277px;
  height: 40px;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 9px 20px;
  background-color: var(--brand-colorsoxford-blue);
  margin-bottom: 24px;
  cursor: pointer;
}

.search-page-main .text-3 {
  margin-top: -1px;
  font-weight: var(--button-btn2-font-weight);
  color: #ffffff;
  font-size: var(--button-btn2-font-size);
  text-align: center;
  letter-spacing: var(--button-btn2-letter-spacing);
  line-height: var(--button-btn2-line-height);
  position: relative;
  width: fit-content;
  font-family: var(--button-btn2-font-family);
  white-space: nowrap;
  font-style: var(--button-btn2-font-style);
}

.search-page-main .side-menu-2 {
  display: flex;
  flex: 1;
  align-items: flex-start;
  border-bottom-width: 1px;
  border-bottom-style: solid;
  border-color: #dedfe3;
}

.search-page-main .frame-25 {
  display: flex;
  height: 40px;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 10px;
  position: relative;
  flex: 1;
  flex-grow: 1;
  background-color: var(--brand-colorsoxford-blue);
}

.search-page-main .text-wrapper-17 {
  position: relative;
  width: fit-content;
  font-family: var(--button-btn3-font-family);
  font-weight: var(--button-btn3-font-weight);
  color: var(--neutral-colorsneutral-8);
  font-size: var(--button-btn3-font-size);
  letter-spacing: var(--button-btn3-letter-spacing);
  line-height: var(--button-btn3-line-height);
  white-space: nowrap;
  font-style: var(--button-btn3-font-style);
}

.search-page-main .frame-26 {
  display: flex;
  height: 40px;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 10px;
  position: relative;
  flex: 1;
  flex-grow: 1;
  background-color: var(--neutral-colorsneutral-8);
}

.search-page-main .text-wrapper-18 {
  position: relative;
  width: fit-content;
  font-family: var(--button-btn3-font-family);
  font-weight: var(--button-btn3-font-weight);
  color: var(--neutral-colorsneutral-2);
  font-size: var(--button-btn3-font-size);
  letter-spacing: var(--button-btn3-letter-spacing);
  line-height: var(--button-btn3-line-height);
  white-space: nowrap;
  font-style: var(--button-btn3-font-style);
}

.search-page-main .frame-wrapper {
  display: flex;
  flex-direction: column;
  height: 40px;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 10px;
  position: relative;
  flex: 1;
  flex-grow: 1;
  background-color: var(--neutral-colorsneutral-8);
}

.search-page-main .text-wrapper-19 {
  position: relative;
  width: fit-content;
  margin-top: -1px;
  gap: 0.15em;
  font-family: var(--button-btn3-font-family);
  font-weight: var(--button-btn3-font-weight);
  color: var(--neutral-colorsneutral-2);
  font-size: var(--button-btn3-font-size);
  letter-spacing: var(--button-btn3-letter-spacing);
  line-height: var(--button-btn3-line-height);
  white-space: nowrap;
  display: inline-flex;
  font-style: var(--button-btn3-font-style);
}

.search-page-main .vector-2 {
  position: relative;
  width: 8px;
  height: 5px;
  margin: auto; 
  flex: 1;
}
.search-page-main .form-group {
  margin-left: 1em;
  width: 90%;
}

.search-page-main .frame-27 {
  color: #4D4E51; 
  font-size: var(--body-body3-font-size); 
  font-family: var(--body-body3-font-family); 
  font-weight: var(--body-body3-font-weight); 
  line-height: var(--body-body3-line-height); 
  word-wrap: break-word;
  display: flex;
  flex-direction: column;
  width: 98%;
  align-items: flex-start;
  gap: 20px;
  margin-top: 0.5em;
  margin-left: 1%;
}

.search-page-main .frame-28 {
  width: 325px; 
  flex: 1 1 0; 
  padding-left: 24px; 
  padding-right: 24px; 
  padding-top: 72px; 
  padding-bottom: 72px; 
  background: white; 
  flex-direction: column; 
  justify-content: flex-start; 
  align-items: flex-start; 
  gap: 24px; 
  display: flex;
  position: absolute;
}

.search-page-main .frame-29 {
  width: 278px;
  align-self: stretch; 
  height: 70px; 
  padding: 12px; 
  background: #002147; 
  flex-direction: column; 
  justify-content: flex-start; 
  align-items: flex-start; 
  gap: 4px; 
  display: flex;
  position: absolute;
  top: 72px;
  left: 24px;
}

.search-page-main .text-wrapper-20 {
  align-self: stretch;
  color: white; 
  font-size: 16px; 
  font-family: Manrope; 
  font-weight: 700; 
  line-height: 21px; 
  word-wrap: break-word
}

.search-page-main .text-wrapper-21 {
  align-self: stretch; 
  color: white; 
  font-size: 14px; 
  font-family: Manrope; 
  font-weight: 400; 
  line-height: 21px; 
  letter-spacing: 0.10px; 
  word-wrap: break-word
}

.ui-datepicker {    
  z-index: 100!important;
  border-radius: 8px;
  background: var(--neutral-colorsneutral-8);
  box-shadow: 0px 8px 24px 0px rgba(119, 131, 146, 0.08), 0px 6px 12px 0px rgba(119, 131, 146, 0.12)!important;

  .ui-datepicker-header {
    position: relative;

    .ui-datepicker-prev, 
    .ui-datepicker-next {
      position: absolute;
      width: 1.8em;
      height: 1.8em;
      top: 2px;
      cursor: pointer;
    }
    

    .ui-datepicker-prev {
      left: 2px;
    }

    .ui-datepicker-next {
      right: 2px;
    }

    .ui-datepicker-prev .ui-icon,
    .ui-datepicker-next .ui-icon {
      background-image: url('../img/navigate_before.svg');
      text-indent: -99999px;
      overflow: hidden;
      display: block;
      background-repeat: no-repeat;
      height: 1.8em;
    }

    .ui-datepicker-next .ui-icon {
      background-image: url('../img/navigate_next.svg'); /* Replace with your image path */
    }

    .ui-datepicker-title {
      margin: 0 2.3em;
      line-height: 1.8em;
      text-align: center;

      select.ui-datepicker-month,
      select.ui-datepicker-year {
        font-family: "Manrope", Helvetica;
        width: 45%;
        border: unset;
        cursor: pointer;
        color: var(--neutral-colorsneutral-1);
        font-size: 14px;
        font-style: normal;
        font-weight: 500;
        line-height: 18px; /* 128.571% */
        letter-spacing: 0.2px;
        margin: auto 5px;
      }
    }
  }

  .ui-datepicker-calendar {
    width: 100%;

    th, td {
      font-family: "Manrope", Helvetica;
      width: 40px;
      height: 40px;
      vertical-align: middle;
      text-align: center;

      a {
        margin: auto;
        display: flex;
        text-decoration: none;
        color: var(--neutral-colorsneutral-1);
        width: 32px;
        height: 32px;
        justify-content: center;
        align-items: center;

        &.ui-state-highlight,
        &:hover {
          border-radius: 100px;
          background-color: var(--brand-colorsoxford-blue);
          color: #fff;
        }
      }
    }
  }

  .ui-datepicker-buttonpane {
    display: flex;
    padding: 8px 12px;
    justify-content: space-between;
    align-items: flex-end;

    button {
      all: unset;
      display: flex;
      padding: 10px 12px;
      justify-content: center;
      align-items: center;
      color: var(--brand-colorsoxford-blue);
      font-weight: 500;
      font-size: 14px;
      line-height: 18px; /* 128.571% */
      letter-spacing: 0.2px;
      font-family: "Manrope", Helvetica;
      cursor: pointer;

     &:hover {
      background-color: var(--brand-colorsoxford-blue);
      color: var(--neutral-colorsneutral-8);
     }
    }
  }
}

.cursor-pointer {
  cursor: pointer;
}
.criteria-item {
  display: flex; 
  max-width: 60%;
  height: auto; 
}
.criteria-item-text {
  max-width: 100%;
  overflow-wrap: break-word; 
  word-wrap: break-word; 
  flex: 9; 
}
.criteria-icon {
  flex: 0;
  align-self: center;
}

.multi-select-container {
  width: 120px;
  height: 34px;
  background-color: var(--neutral-colorsneutral-8);
  border: 1px solid;
  border-color: #dedfe3;

  .multi-select-button {
    all: unset;
    display: flex;
    position: relative;
    max-width: 120px; /* Account for the caret width */
    max-height: 34px;
    font-family: "Manrope", Helvetica;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    color: var(--neutral-colorsneutral-1);
    cursor: pointer;
    align-items: center;
    justify-content: space-between;
    padding: 10px 12px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;

    &::after {
      content: "";
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      right: 0;
      background-image: url(../img/vector-7.svg);
      background-size: contain;
      background-repeat: no-repeat;
      background-position: left center;
      height: 30px;
      border: unset;
      background-color: white;
      padding: 0 8px;
      padding-right: 13px;
      margin-right: 0px;
      background-size: 12px 5px;
    }
  }

  &.multi-select-container--open {
    .multi-select-button::after {
      transform: translateY(-50%) rotate(180deg); 
      padding-left: 13px;
      padding-right: 8px;
      background-position: right center;
    }
  }

  .multi-select-menu {
    z-index: 900;
    width: 150px!important;
    top: 20px;
    border-radius: 8px;
    background-color: var(--neutral-colorsneutral-8);
    box-shadow: 0px 8px 24px 0px rgba(119, 131, 146, 0.08), 0px 4px 4px 0px rgba(0, 0, 0, 0.25);

    .multi-select-menuitem {
      display: flex;
      width: 100%;
      height: 40px;
      color: var(--neutral-colorsneutral-1);
      font-family: "Manrope", Helvetica;
      font-size: 14px;
      font-style: normal;
      font-weight: 500;
      align-items: center;
      padding: 0 15px 0 30px;
      margin: 4px 0;

      input[type="checkbox" i] {
        appearance: none;
        -webkit-appearance: none;
        -moz-appearance: none;
        width: 16px;
        height: 16px;
        border-radius: 2px;
        border: 2px solid var(--neutral-colorsneutral-5, #DEDFE3);
        background: var(--neutral-colorsneutral-8);
        outline: none;
        cursor: pointer;

        &:checked {
          background: var(--neutral-colorsneutral-8);
          background-image: url('../img/check-dark.svg');
          background-size: contain;
          background-repeat: no-repeat;
          background-position: center;
        }
      
        /* Optional: Hide the checkmark when checkbox is not checked */
        &:not(:checked)::after {
          display: none;
        }
      }
  
      &:first-child {
        margin-top: 0;
        border-top-left-radius: 8px;
        border-top-right-radius: 8px;
      }
    
      &:last-child {
        margin-bottom: 0;
        border-bottom-left-radius: 8px;
        border-bottom-right-radius: 8px;
      }

      &:hover,
      &.checked {
        color: var(--brand-colorswhite);
        background-color: var(--brand-colorsoxford-blue);

        input[type="checkbox" i] {
          border: unset;
        }
      }
    }
  }
}
.tab-container.active {
  flex: 19;
  display: flex;
  flex-direction: column;
  width: 100%;
  overflow-y: auto;
  overflow-x: hidden;
}
.tab-container {
  display: none;
}
.table .table-container {
  width: 100%; 
  height: 100%; 
  overflow: hidden;
}
.table table {
  width: 100%;
  border-collapse: collapse;

  tr {
    height: 54px;
    border-bottom: 1px solid #DEDFE3;
    background: var(--neutral-colorsneutral-8, #FFF);

    th {
      background: var(--neutral-colorsneutral-8, #FFF);
      position: sticky;
      top: 0;
      z-index: 100;

      &::after {
        content: '';
        position: absolute;
        bottom: 0;
        left: 0;
        display: block;
        width: 100%;
        border-bottom: 1px solid #ddd; /* Add a bottom border to the first row of cells */
        margin-top: -1px;
      }
    }

    th,
    td {
      max-height: 54px;
      text-align: start;
      vertical-align: middle;
      padding: 18px 12px;
    }
  }
}
.tab-menu {
  .tab-menuitem {
    cursor: pointer;

    &.active {
      background-color: var(--brand-colorsoxford-blue);
      a,div,li {
        color: white;
      }
    }
  }
}
.tab-menuitem.active {
  color: white;
}
.search-page-main .mobile,
.tab-container {
  display: none;
}


.frame-31,
.m-filter-toggle {
  display: none!important;
}


.mobile-container {
  position: absolute;
  top: 851px;
  width: 100%;
}

.mobile-abmc {
  margin-left: 0.75em;
}

.search-page-main .panel-group .panel{
  border-radius: 0px;
  border-color: transparent;
}
.search-page-main .img-thumbnail{
  border:unset;
  border-radius: 0px;
}
.search-page-main .mapRecordInformationFrame {
  display: flex; 
  width: 100%; 
  overflow: visible;
}
.search-page-main .mapRecordThumbnail {
  flex: 1; 
}
/* Small devices (landscape phones, 576px and up) */
@media (max-width: 575.98px) { 
  .searching-container .multi-select-container,
  .m-575 {
    display: none;
  }
  .results-information-frame.mobile{
    flex-direction: column;
    gap: 0.5em;
    align-items: center;
  }
  .results-heading {
    flex: 1;
    display: flex;
    width: 100%;
  }
  .results-information-container {
    flex: 1; 
    align-self: flex-start;
  }
  .sort-by-button-frame {
    flex: 1; 
    align-self: flex-end;
  }
  .criteria-container {
    display: flex; 
    flex: 1;
    flex-wrap: wrap; 
    max-width: 100%;
  }
  .criteria-item {
    max-width: 100%;
  }
  .search-page-main .searching-container {
    width: 100%!important;
    max-width: 100%!important;
  }

  .search-page-main .search-input-container {
    width: calc(100% - 80px);
  }


  .frame-31 {
    display: flex!important;
    top: 130px!important;
    justify-content: flex-start!important;
    gap: 8px;
  }

  .frame-33 {
    flex-direction: column!important;
    gap: 10px!important;

    .frame-14 {
      width: 100%!important;
    }

    .results-footer {
      justify-content: center;
    }
  }
 }

/* Medium devices (tablets, 768px and up) */
@media (max-width: 845px) {  
  .search-page-main {
    margin-top: 3vh;
    height: 120vh;
    align-items: center;
    overflow-y: auto; 
  }
  .restOfContainer {
    width: 100%; 
    overflow-x: hidden;
    flex-direction: column;
    overflow-y: auto;
  }
  .search-page-main .side-menu {
    overflow: hidden;
  }
  .search-page-main .advancedContainer {
    flex: 1; 
    overflow: hidden; 
  }
  .search-page-main .searchContainer {
    flex: 1;
    overflow-y: auto;
  }

  /* .login .frame-2,
  .login .sort-by-button-frame {
    display: none;
  }

  .login .mobile {
    display: block;
  } */
}
@media (min-width: 768px) {
  .criteria-item {
    max-width: 60%;
  }

}
@media (min-width: 846px) {
  .search-page-main .side-menu {
    overflow: visible;
  }
  .search-page-main .advancedContainer {
    overflow: visible;
  }
}
@media (max-width: 767.99px) {
  .search-page-main .search-bar-frame.mobile {
    flex-direction: column;
    gap: 0.5em;
  }
  .search-bar-icon-container {
    width: 100%; 
    display:flex;
  }
  .search-bar-icon-container .container-1 {
    flex: 1;
    align-self: flex-start;
  }
  .search-bar-icon-container .container-2 {
    flex: 1; 
    display: block; 
  }
  .container-2-float-right {
    display: flex; 
    gap: 0.5em; 
    float: right; 
  }
}

/* Large devices (desktops, 992px and up) */
@media (max-width: 991.98px) {  
  .search-page-main .side-menu {
    width: 100%;
  }
  .search-page-main .searchContainer {
    flex: 2;
  }
  .tab-container.active {
    height: fit-content;
  }
  .search-page-main .frame-9 {
    .navbar,
    .frame-11 {
      display: none;
    }
  }

  .search-page-main .frame-16,
  .search-page-main .frame-18,
  .search-page-main .frame-21,
  .search-page-main .frame-23,
  .search-page-main .input-fields,
  .search-page-main .input-fields-2 {
    width: calc(100% - 28px);
  }

  .dropdown-with-chips,
  .dropdown-with-chips-wrapper,
  .dropdown-with-chips-3 {
    width: calc(100% - 28px)!important;
    .dropdown-with-chips-2 {
      width: calc(100% + 28px);
    }
  }

  .search-page-main .primary-button {
    width: 100%!important;
  }

  .search-page-main .side-menu-2 {
    width: 100%;
  }

  .search-page-main .searching-container {
    max-width: calc(100% - 118px);
  }

  .search-page-main .desktop-container {
    .table,
    .frame,
    .results-sort,
    .filter-toggle {
      display: none;
    }
  }

  .search-page-main .m-filter-toggle {
    cursor: pointer;
    display: flex!important;
    max-width: 40px;

    .frame-30 {
      height: 40px;
      transform: unset;
    }
  }

  .search-page-main .side-menu {
    height: 40px;

    &.collapsed {
      height: 100%;
    }
    
    .m-filter-toggle {
      .frame-30 {
        transform: rotate(90deg);
      }
    }
  }
  .search-page-main .div {
    height: auto;
  }

  body {
    background-color: #eee;
  }

  .search-page-main .mobile-container {
    padding: 28px;

    .frame-32 {
      all: unset;
      position: relative;
      display: flex!important;
      width: calc(100% - 28px)!important;
      margin-bottom: 28px;
      background-color: #ffffff;
      padding: 12px;

      .sort-by-button-frame {
        margin-left: auto;
      }
    }

    .frame-33 {
      all: unset;
      position: relative;
      display: flex!important;
      width: calc(100% - 28px)!important;
      background-color: #ffffff;
      padding: 12px;

      .frame-14 {
        border-radius: 4px;
        cursor: pointer;
        margin-right: auto;

        .vector {
          margin-left: auto;
        }
      }
    }
  }
}

/* X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1199.98px) {
 
}