@charset "UTF-8";
/* CSS Document */


/* Clamp Long project descriptions for read more link below */
.clamped-container {
  display: flex;
  flex-direction: column;
}

.clamp-text {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.6;
  max-height: 6.4em; /* 4 lines */
  margin-bottom: 0; /* Removes gap under paragraph */
}

.clamp-text.expanded {
  -webkit-line-clamp: unset;
  max-height: none;
  overflow: visible;
}

.read-more-toggle {
  font-size: 14px;
  color: deepskyblue;
  text-decoration: underline;
  cursor: pointer;
  line-height: 1.2;
  margin-top: 0.2em;
  padding: 0;
  display: inline-block;
}



/* Style for hoverable dropdown dv 1 */
.hover-link-dv {
    color: deepskyblue;
    position: relative;
    cursor: pointer;
    display: inline-block; /* Ensure it doesn't restrict the dropdown width */
}

.hover-link-dv .dropdown-content-dv {
   display: none;
    position: absolute;
    background-color: #000;
    padding: 10px;
    border: 0px solid #fff;
    z-index: 1;
    top: 20px;
    left: 0;
    font-size: 14px;
    max-width: 300px; /* Increased width to ensure text fits on one line */
    line-height: 1.8em;
}

.hover-link-dv .dropdown-content-dv a {
    color: deepskyblue;
    text-decoration: none;
    display: block;
    margin-bottom: 0px;
}

.hover-link-dv:hover .dropdown-content-dv {
    display: block;
}


	  /* Hover dropdown dv 2 (4 lines) */
.hover-link-dv-2 {
    color: deepskyblue;
    position: relative;
    cursor: pointer;
    display: inline-block; /* Ensure it doesn't restrict the dropdown width */
}

.hover-link-dv-2 .dropdown-content-dv-2 {
    display: none;
    position: absolute;
    background-color: #000;
    padding: 10px;
    border: 1px solid #deepskyblue;
    z-index: 1;
    top: 20px;
    left: 0;
    font-size: 14px;
    line-height: 1.8em;
    max-width: 400px; /* Adjust width as needed */
    column-count: 4; /* Display 4 columns */
}

.hover-link-dv-2 .dropdown-content-dv-2 a {
    color: deepskyblue;
    text-decoration: none;
    display: block;
    margin-bottom: 0px;
}

.hover-link-dv-2:hover .dropdown-content-dv-2 {
    display: block;
}

	  
      	  
	
/* CSS Styling for Filter Description Section */		
#filter-description {
    margin-top: -30px;
    margin-bottom: 20px;
    padding: 10px;
    background-color: #f9f9f9;
    border-radius: 10px;
    display: flex;
    gap: 20px; /* Ensures space between columns */
    justify-content: space-between;
}


#filter-description .column-dv {
    flex: 1; /* Ensures columns take equal space */
    padding: 15px;
    font-size: 12px;
    line-height: 1.6;
}

        

/* This ensures that .col-md-6 columns have space between them when displayed side by side */
@media (min-width: 600px) {
  #filter-descriptions .description {
    display: flex;
    gap: 20px; /* Adjust gap size as needed */
  }
}

/* Stack columns on screens smaller than 992px */
@media (max-width: 600px) {
  #filter-descriptions .description {
    display: flex;
    flex-direction: column; /* Forces stacking */
    padding-left: 20px;
    padding-right: 20px;  
  }
}