/*----------------------------------- FIRST SECTION -----------------------------------*/
.inner-banner-section {
  background-color: #c7eef7;
  background-image: linear-gradient(to bottom, #06060600, rgba(156, 152, 202, 0)), url('./../../img/Contact-Header-Background.jpg');
  background-size: cover;
  background-position: bottom center;
  background-repeat: no-repeat;
  /* mix-blend-mode: multiply; */
  /* filter: contrast(1.5);
    pointer-events: none;
    opacity: .2; */
  display: -webkit-box;
  /* OLD - iOS 6-, Safari 3.1-6 */
  display: -moz-box;
  /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox;
  /* TWEENER - IE 10 */
  display: -webkit-flex;
  /* NEW - Chrome */
  display: flex;
  /* NEW, Spec - Opera 12.1, Firefox 20+ */
  align-items: center;
  flex-wrap: wrap;
  padding-top: calc(var(--section-padding) * 1.5);
  padding-bottom: calc(var(--section-padding) / 1.5);
}



/* DROPDOWN BUTTON FORMs */
.dropdown-switch:checked+.dropdown-options-filter .dropdown-select {
  visibility: visible;
  -webkit-transform: scale(1, 1);
  transform: scale(1, 1) translateX(-50%);
}

.dropdown-switch:checked+.dropdown-options-filter .dropdown-filter:after {
  transform: rotate(-135deg);
}

.dropdown-options-filter {
  position: relative;
  width: 100%;
  cursor: pointer;
  display: block;
}

.dropdown-filter {
  padding-left: 5px;
  position: relative;
  cursor: pointer;
  min-width: 12em;
  min-height: 3em;
  display: flex;
  align-items: center;
  background: transparent;
  border-bottom: solid 2px;
  border-width: 0 0 1px;
  border-color: #00000029;
  box-shadow: inset 0 0 2px 2px rgba(247, 0, 0, 0);
}

.dropdown-filter::after {
  content: "";
  position: absolute;
  top: 45%;
  right: 10px;
  width: 10px;
  height: 10px;
  -webkit-transform: translateY(-50%) rotate(45deg);
  transform: translateY(-50%) rotate(45deg);
  border-right: 1px solid #B6B6B6;
  border-bottom: 1px solid #B6B6B6;
  transition: 0.2s ease;
}

.dropdown-select {
  position: absolute;
  top: 100%;
  width: 100%;
  overflow: hidden;
  background: var(--white-color);
  border-top: 1px solid #eee;
  border-radius: 0.45rem;
  z-index: 1;
  background: #fff;
  -webkit-transform: scale(1, 0);
  transform: scale(1, 0) translateX(-50%);
  -webkit-transform-origin: top center;
  transform-origin: top center;
  visibility: hidden;
  transition: 0.2s ease;
  box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
  left: 50%;
  /* min-width: 20em; */
  margin-top: 15px;
  max-height: 14vw;
  overflow-y: scroll;
}


.dropdown-filter-selected {
  color: #6C6C6C;
  font-size: 1rem;
  font-family: "Noto Sans, Light";
  opacity: .6;
}

.dropdown-select-option {
  padding: 10px;
  box-sizing: border-box;
  cursor: pointer;
  font-family: "Noto Sans, Light";
  font-size: 1rem;
  transition: 0.3s ease-in-out all;
  color: var(--dark-blue-color);
}

.dropdown-select-option.active {
  background: #f8f8f8;
  font-family: "Noto Sans, Black" !important;
  color: #022C7B;
}

.dropdown-select-option:hover {
  background: #f8f8f8;
  color: #022C7B;
}

.dropdown-options-filter.title-active .dropdown-filter-selected {
  color: #083248;
  font-family: "Noto Sans, Black" !important;
  opacity: 1;
}

/* END DROPDOWN BUTTON FORMs */




@media (max-width: 767px) {
  .inner-banner-section {
    background-image: linear-gradient(to top, #06060600, rgba(156, 152, 202, 0)), url('./../../img/contact-bg-mbl.jpg');
    background-position: right center !important;
  }

  .dropdown-select {
    max-height: 85vw !important;
  }

  .dropdown-filter-selected, .dropdown-select-option {
    font-size: .9rem !important;
  }

}

@media (max-width: 1024px) {
  .contact-desc p {
    text-align: center;
  }

  .contact-info {
    display: flex;
    gap: 1.2rem;
    align-self: center;
    min-width: 20rem;
    max-width: 20rem;
    margin-top: 1rem !important;
  }

  .contact-info:nth-child(1) {
    position: relative;
    margin-top: 2rem !important;
  }

  .contact-icon img {
    width: 20px !important;
    position: relative !important;
    left: unset !important;
    top: unset !important;
  }

  .contact-wrapper {
    display: flex;
    flex-direction: column;
  }
}

@media screen and (min-width: 768px) and (max-width: 1024px) {

  .inner-banner-section {
    background-image: linear-gradient(to top, #06060600, rgba(156, 152, 202, 0)), url('./../../img/contact-bg-i.jpg');
  }

  #contact_form_div {
    width: 85% !important;
  }

  .contact-info {
    padding-left: unset !important;
  }

  .directory-wrapper {
    display: flex;
    flex-direction: column !important;
  }
}

/* landscape */
@media screen and (min-width: 300px) and (max-width: 1024px) and (orientation: landscape) {
  .c-section--1 .contact-bg {
    padding-top: 6rem;
  }
}

/*----------------------------------- END FIRST SECTION -----------------------------------*/



/*----------------------------------- GROUP DIRECTORY SECTION -----------------------------------*/
.c-section--2 {
  background-color: #c7eef7;
  background-image: linear-gradient(to top, #fff, rgba(255, 255, 255, 0.41)), url('./../../img/group-directory-bg.jpg');
  background-size: cover;
  background-position: top center;
  background-repeat: no-repeat;
  /* background-attachment: fixed; */
}

.c-section--2::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(to top, #06060600, #D7ECE4);
  pointer-events: none;
  max-height: 20%;
}

.c-section--2::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(to bottom, #06060600, #ffffff) !important;
  pointer-events: none;
}

.directory-wrapper {
  display: flex;
  align-items: center;
  width: 100%;
  justify-content: center;
  gap: 1rem;
}

.directory-wrapper h4 {
  color: #083248;
  font-size: 1.4rem;
  text-transform: inherit;
}

#search-wrapper {
  width: 25%;
  padding: 1px 6px;
  margin: 0 !important;
}


/* directory tab*/
.directory-tab-header {
  width: max-content;
  margin: 0 auto !important;
  display: flex;
  flex-wrap: wrap;
}

.directory-tab-header a {
  /* margin-right: 13px; */
  /* margin-bottom: 13px; */
  font-size: 0.9rem;
  letter-spacing: 1.02px;
  padding: 15px 15px;
  float: left;
  clear: right;
  text-decoration: none;
  cursor: pointer;
  text-align: center;
  border: 1px solid #70707042;
  /* border-radius: 0.45rem; */
  width: 13em;
  height: 5em;
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 1.2;
}

.directory-tab-title.directory-title-active {
  background-color: var(--white-color);
  border: 1px solid #70707000;
}

.directory-tab-content {
  animation: fadeIn ease 2s;
  -webkit-animation: fadeIn ease 2s;
  -moz-animation: fadeIn ease 2s;
  -o-animation: fadeIn ease 2s;
  -ms-animation: fadeIn ease 2s;
}

.directory-tab {
  display: none;
  position: relative;
  padding: 40px;
  color: var(--dark-blue-color);
  min-width: 33em;
  background-color: #fff;
  transition: .3s ease-in-out all;
}

.directory-tab h4 {
  color: var(--dark-blue-color);
  text-transform: inherit;
  text-align: center;
}

.directory-results-text.no-results-wrapper p {
  text-align: center;
  color: #70777B;
  letter-spacing: 0.98px;
  font-size: 1.2rem;
}

.directory-tab.tab-active {
  display: block;
}

.directory-tab-inner-wrapper {
  position: relative;
  margin: 0 auto;
  display: flex;
  justify-content: center;
}

/* adjusting the input selection */
.filter-menu-item:hover,
.filter-menu-item:focus-within {
  background: unset !important;
  border: unset !important;
}

.submenu-wrapper {
  padding-left: unset !important;
  justify-content: center;
  display: flex;
}

.directory-tab .submenu-wrapper.submenu-wrapper-col .submenu-container .row {
  width: 100%;
  /* min-width: 30em; */
  justify-content: space-between;
  display: flex;
}

.directory-tab .submenu-container {
  display: inline-block;
  vertical-align: top;
}

.directory-tab:nth-child(2) .submenu-container {
  display: inline-block;
  vertical-align: top;
  width: 100%;
}

/* text results */
.directory-results-text h4 {
  color: var(--dark-grey-color);
  font-size: 1.4rem;
  text-transform: inherit;
  text-align: center;
}

/* results wrapper */
.directory-results-wrapper {
  position: relative;
}

/* directories card */

.directory-cards-wrapper {
  position: relative;
  min-height: 65vw;
  transition: .3s ease-in-out all;
}

.directory-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  width: 100%;
  gap: 1rem;
}

.directory-cards {
  position: relative;
  width: 100%;
  max-width: 555px;
  min-height: 425px;
  padding: 2rem 1rem;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: #FFFFFF;
  box-shadow: 0px 3px 6px #00000029;
  transition: .3s ease-in-out all;
  min-width: 550px;
}

.directories-info {
  position: relative;
  display: flex;
  gap: 1.5rem;
  margin-bottom: 1rem;
}

.directories-info-desc small {
  font-family: "Noto Sans, Light";
}

.directories-icon img {
  width: 22px;
}

.directories-info-desc p {
  margin-bottom: 0 !important;
}

.directory-cards:hover {
  background: var(--royal-blue-color);
  color: #fff;
}

.directory-cards h3,
.directory-cards h4,
.directories-info-desc p a,
.directories-icon img {
  transition: .3s ease-in-out all;
}

.directory-cards:hover h3,
.directory-cards:hover h4,
.directory-cards:hover .directories-info-desc p a {
  color: #fff;
}

.directory-cards:hover .directories-icon img {
  -webkit-filter: brightness(0) invert(1);
  filter: brightness(0) invert(1);
}

.directories-info-desc .small-txt {
  font-size: 0.8rem;
}

.directory-cards .main-btn {
  position: absolute;
  bottom: 3vw;
}


@media (max-width: 767px) {

  .directory-cards .main-btn {
    position: relative !important;
    bottom: unset !important;
  }


  .c-section--2 {
    padding-top: calc(var(--section-padding) / 2) !important;
  }

  .directory-wrapper {
    flex-direction: column !important;
  }

  .directory-wrapper h4 {
    font-size: 1.2rem !important;
    text-align: center;
    margin-bottom: 0 !important;
  }

  .directory-tab-header a {
    font-size: 0.8rem !important;
    width: 12em !important;
    height: 4em !important;
  }

  .directory-tab h4 {
    font-size: 1rem !important;
  }

  .submenu-checkbox .submenu-label {
    font-size: .85rem !important;
    letter-spacing: 0 !important;
  }

  .directory-tab {
    padding: 25px !important;
    min-width: 100% !important;
  }

  .directory-results-text h4 {
    font-size: 1rem !important;
  }

  .directory-cards h3 {
    margin-bottom: .3rem !important;
  }

  .directory-cards h4 {
    font-size: .9rem !important;
  }

  .directories-icon img {
    width: 15px !important;
  }

  .directory-cards-wrapper {
    max-height: unset !important;
  }

  .directory-cards {
    min-height: unset !important;
    padding: 1rem !important;
    min-width: 100% !important;
  }

  .directory-container {
    gap: 1rem !important;
  }

  .directories-info {
    margin-bottom: 0 !important;
  }

  .default-btn {
    transform: translateX(9vw) !important;
  }


}

@media screen and (min-width: 768px) and (max-width: 1024px) {
  .dropdown-select {
    max-height: 38vw !important;
  }

  .directory-cards-wrapper {
    max-height: unset !important;
  }

  .directory-container {
    gap: 1rem;
  }

  .directory-cards .main-btn {
    position: relative !important;
    bottom: unset !important;
    width: 50%;
  }

  .directory-cards {
    position: relative;
    width: 100%;
    max-width: 855px !important;
    padding: 2rem !important;
  }

  .directory-cards hr {
    display: none;
  }

  .directory-cards .row .col-6:nth-child(1) {
    display: flex;
    width: 100%;
    flex-direction: row;
  }

  .directories-info {
    width: 50%;
    flex: 50%;
  }

  .directory-cards .row .col-6:nth-child(2) {
    display: flex;
    flex-direction: revert;
    width: 100%;
    flex-wrap: wrap;
  }


}

@media (max-width: 1024px) {
  .directory-results-text h4 {
    text-align: center;
    max-width: 90%;
    margin: 0 auto;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    line-height: 1.5;
  }

  .directories-info:last-child {
    margin-bottom: 0 !important;
  }
}

/* For only Large Devices, Wide Screens */
@media screen and (min-width: 1500px) {
  #search-wrapper {
    width: 33%;
  }

  .directory-cards {
    max-width: 660px !important;
    min-height: 425px !important;
    padding: 2rem !important;
  }

  .directories-info-desc .small-txt {
    font-size: 0.95rem;
  }

  .directory-cards-wrapper {
    position: relative;
    min-height: 100% !important;
    max-height: 65vw !important;
    transition: .3s ease-in-out all;
  }
}

/* landscape */
@media screen and (min-width: 300px) and (max-width: 1024px) and (orientation: landscape) {
  #search-wrapper {
    width: 60% !important;
  }

  .directory-tab {
    min-width: 33em !important;
  }

  .directory-cards-wrapper {
    max-height: unset !important;
  }

  .directory-container {
    gap: 1rem;
  }

  .directory-cards .main-btn {
    position: relative !important;
    bottom: unset !important;
    width: 50%;
  }

  .directory-cards {
    position: relative;
    width: 100%;
    max-width: 855px !important;
    padding: 2rem !important;
  }

  .directory-cards hr {
    display: none;
  }

  .directory-cards .row .col-6:nth-child(1) {
    display: flex;
    width: 100%;
    flex-direction: row;
  }

  .directories-info {
    width: 50%;
    flex: 50%;
  }

  .directory-cards .row .col-6:nth-child(2) {
    display: flex;
    flex-direction: revert;
    width: 100%;
    flex-wrap: wrap;
  }
}

/*----------------------------------- END GROUP DIRECTORY SECTION -----------------------------------*/
