diff --git a/app/general/filters.py b/app/general/filters.py
index 1b878700..cf0d4fcf 100644
--- a/app/general/filters.py
+++ b/app/general/filters.py
@@ -1,11 +1,25 @@
 import django_filters
+from django import forms
 from django.contrib.postgres.search import SearchQuery, SearchRank, SearchVector
+from django_filters import ModelMultipleChoiceFilter, MultipleChoiceFilter
 
-from general.models import DocumentFile
+from general.models import DocumentFile, Institution, Language, Subject
 
 
 class DocumentFileFilter(django_filters.FilterSet):
     search = django_filters.CharFilter(method="filter_search", label="Search")
+    institution = ModelMultipleChoiceFilter(
+        queryset=Institution.objects.all(), widget=forms.CheckboxSelectMultiple
+    )
+    document_type = MultipleChoiceFilter(
+        choices=DocumentFile.document_type_choices, widget=forms.CheckboxSelectMultiple
+    )
+    subjects = ModelMultipleChoiceFilter(
+        queryset=Subject.objects.all(), widget=forms.CheckboxSelectMultiple
+    )
+    languages = ModelMultipleChoiceFilter(
+        queryset=Language.objects.all(), widget=forms.CheckboxSelectMultiple
+    )
 
     class Meta:
         model = DocumentFile
@@ -16,7 +30,10 @@ class Meta:
             "languages",
         ]
 
-    def filter_search(self, queryset, value):
+    def filter_search(self, queryset, name, value):
+        print("name", name)
+        print("value", value)
+
         if value:
             queue = SearchQuery(value)
             search_vector = SearchVector("title", "description", "document_data")
diff --git a/app/static/css/styles.css b/app/static/css/styles.css
index 059f1586..369f472a 100755
--- a/app/static/css/styles.css
+++ b/app/static/css/styles.css
@@ -54,44 +54,44 @@ html {
     width: 100%;
 }
 
-.nav > li > a{
+.nav > li > a {
     margin-top: 15px;
     color: var(--text-color);
 }
 
-.nav > li > .active{
+.nav > li > .active {
     margin-top: 15px;
     background-color: var(--primary) !important;
     color: var(--primary-fg);
 }
 
-.nav > li > a:hover{
+.nav > li > a:hover {
     margin-top: 15px;
     background-color: var(--body-quiet-color);
     color: var(--primary-fg);
 }
 
-.nav > li > a:active{
+.nav > li > a:active {
     margin-top: 15px;
     background-color: var(--primary);
     color: var(--primary-fg);
 }
 
-.btn-primary{
-    margin-top:20px;
+.btn-primary {
+    margin-top: 20px;
     outline-color: var(--primary);
     background-color: var(--primary);
     border-color: var(--primary);
 }
 
-.btn-outline-primary{
-    margin-top:20px;
+.btn-outline-primary {
+    margin-top: 20px;
     background: #2D4481;
     outline-color: var(--primary);
 }
 
-.btn-primary:hover{
-    margin-top:20px;
+.btn-primary:hover {
+    margin-top: 20px;
     background: var(--body-quiet-color);
     outline-color: var(--primary);
 }
@@ -104,7 +104,7 @@ html {
     color: var(--primary-fg);
 }
 
-.section{
+.section {
     margin-left: 10px;
     margin-right: 10px;
     margin-bottom: 10px;
@@ -121,7 +121,7 @@ html {
     color: var(--primary-fg) !important;
 }
 
-.page-link:hover{
+.page-link:hover {
     background-color: var(--body-quiet-color) !important;
     color: var(--primary-fg) !important;
 }
@@ -154,12 +154,13 @@ html {
     margin-top: 0.5rem;
 }
 
-.btn-language{
+.btn-language {
     color: var(--text-color);
     outline-color: var(--primary-fg);
     background-color: var(--primary-fg);
     border-color: var(--primary-fg);
 }
+
 /*Home page*/
 .content-card {
     border-color: var(--primary-red);
@@ -186,27 +187,33 @@ html {
     margin: 30px;
     font-size: 0.875rem;
 }
+
 .filter-form label {
     margin-right: 10px;
 }
+
 .filter-form .form-group {
     margin-right: 10px;
 }
+
 .filter-form .form-control {
     border: 1px solid #000;
 }
+
 .filter-form select {
     padding: 0 10px;
     width: 230px;
 }
-.btn-apply, .btn-reset{
+
+.btn-apply, .btn-reset {
     color: var(--primary-fg);
     outline-color: var(--primary);
     background-color: var(--primary);
     border-color: var(--primary);
     margin-right: 10px;
 }
-.btn-apply:hover, .btn-reset:hover{
+
+.btn-apply:hover, .btn-reset:hover {
     color: var(--primary-fg);
     outline-color: var(--primary);
     background-color: var(--primary);
@@ -236,46 +243,55 @@ html {
     width: auto;
 
 }
+
 .project-border {
     margin: 0 0 5px 0;
     overflow: hidden;
     padding: 0 5px 0 0;
     word-wrap: break-word;
 }
+
 .project-left-col {
     width: 70%;
 }
+
 .project-right-col {
     width: 30%;
     flex: 0 0 auto;
     display: flex;
     justify-content: flex-end;
 }
+
 .project-header {
     display: flex;
     justify-content: space-between;
     align-items: center;
     max-width: 800px;
 }
+
 .project-body {
     width: 100%;
     max-width: 800px;
 
 }
+
 .card-text-description {
     word-wrap: break-word;
     overflow: hidden;
     font-size: 0.875rem;
     margin: 3px 0 3px 0;
 }
+
 .project-row {
     display: flex;
     justify-content: space-between;
     width: 100%;
 }
+
 .project-text {
     font-size: 1.25rem;
 }
+
 .icon-text {
     font-size: 0.95rem;
 }
@@ -286,13 +302,16 @@ html {
     margin: 0 auto;
     font-size: 0.875rem;
 }
+
 .detail h1 {
     font-size: 2em;
 }
+
 .detail a {
     text-decoration: none;
     color: var(--link-text);
 }
+
 .project-detail a:hover,
 .detail-col ul li a:hover {
     text-decoration: underline;
@@ -354,13 +373,13 @@ html {
     display: flex;
     justify-content: left;
 }
+
 .project-date-row {
-  display: flex;
-  font-size: 0.875rem;
+    display: flex;
+    font-size: 0.875rem;
 }
 
 
-
 /*Error pages*/
 .error-card {
     border-color: var(--primary-red);
@@ -372,6 +391,7 @@ html {
 .bi {
     font-size: 50px;
 }
+
 .detail-icon {
     font-size: 20px;
     margin-right: 3px;
@@ -383,8 +403,9 @@ html {
     .header-container {
         width: 100%;
     }
+
     .section {
-      padding-right: 30px;
+        padding-right: 30px;
     }
 
     /*Institutions page*/
@@ -392,13 +413,16 @@ html {
         width: 100%;
         font-size: smaller;
     }
+
     .all-cards {
         width: 98%;
         padding-right: 30px;
     }
+
     .col-sm-6 {
         width: 50%;
     }
+
     /*Home page*/
     .content-card {
         font-size: smaller;
@@ -419,8 +443,9 @@ html {
     .header-container {
         width: 100%;
     }
+
     .section {
-      padding-right: 20px;
+        padding-right: 20px;
     }
 
     /*Institutions page*/
@@ -428,12 +453,15 @@ html {
         width: 100%;
         padding-right: 10px;
     }
+
     .left-col {
         width: 70%;
     }
+
     .right-col {
         width: 30%;
     }
+
     .uni-card {
         width: 98%;
         height: 200px;
@@ -458,13 +486,15 @@ html {
     .header-container {
         width: 100%;
     }
+
     .section {
-      padding-right: 20px;
+        padding-right: 20px;
     }
+
     .footer-class {
         flex-direction: row;
         justify-content: center;
-      }
+    }
 
     .language-toggle {
         margin-top: 0;
@@ -491,13 +521,16 @@ html {
         padding-right: 20px;
         height: 200px;
     }
+
     .all-cards {
         width: 100%;
         padding-right: 10px;
     }
+
     .left-col {
         width: 70%;
     }
+
     .right-col {
         width: 30%;
     }
@@ -509,60 +542,82 @@ html {
     }
 }
 
- /*Larger screens (desktops, 1001px and up)*/
-@media screen and (min-width: 1001px){
-  /*General*/
-  .section {
-      padding-right: 20px;
-  }
-  .footer-class {
-      flex-direction: row;
-      justify-content: center;
-    }
-
-  .language-toggle {
-      margin-top: 0;
-      position: absolute;
-      right: 1rem;
-  }
-
-  .language-toggle form {
-      display: flex;
-      flex-direction: row;
-      align-items: center;
-  }
-
-  .language-toggle select,
-  .language-toggle .btn-language {
-      margin-left: 0.5rem;
-      margin-top: 0;
-  }
-  /*Institutions page*/
-  .institution-card{
-      overflow: hidden;
-  }
-  .all-cards {
-      width: 48%;
-      margin: 10px 10px 10px 10px;
-      float: left;
-      padding-right: 10px;
-    }
-  .left-col {
+/*Larger screens (desktops, 1001px and up)*/
+@media screen and (min-width: 1001px) {
+    /*General*/
+    .section {
+        padding-right: 20px;
+    }
+
+    .footer-class {
+        flex-direction: row;
+        justify-content: center;
+    }
+
+    .language-toggle {
+        margin-top: 0;
+        position: absolute;
+        right: 1rem;
+    }
+
+    .language-toggle form {
+        display: flex;
+        flex-direction: row;
+        align-items: center;
+    }
+
+    .language-toggle select,
+    .language-toggle .btn-language {
+        margin-left: 0.5rem;
+        margin-top: 0;
+    }
+
+    /*Institutions page*/
+    .institution-card {
+        overflow: hidden;
+    }
+
+    .all-cards {
+        width: 48%;
+        margin: 10px 10px 10px 10px;
+        float: left;
+        padding-right: 10px;
+    }
+
+    .left-col {
         width: 70%;
     }
-  .right-col {
+
+    .right-col {
         width: 30%;
     }
-  .uni-card {
-      margin: 10px;
-      width: 100%;
-      height: 200px;
-      font-size: small;
-  }
-
-  /*Projects page*/
-  .filter-form select {
-      padding: 0 10px;
-      width: 230px;
-  }
+
+    .uni-card {
+        margin: 10px;
+        width: 100%;
+        height: 200px;
+        font-size: small;
+    }
+
+    /*Projects page*/
+    .filter-form select {
+        padding: 0 10px;
+        width: 230px;
+    }
+}
+
+/*Search Css*/
+.subjects-checkbox-container {
+    cursor: pointer;
+    max-height: 130px; /* Adjust based on your line-height and padding to show only 4 rows */
+    overflow-y: auto; /* Enable vertical scrollbar when content overflows */
+    border: 1px solid #ced4da; /* Bootstrap's form control border color */
+    border-radius: 0.25rem; /* Bootstrap's form control border radius */
+    /*padding: 0.375rem; !* Bootstrap's form control padding *!*/
+    /*white-space: nowrap; !* Prevent text wrapping *!*/
+}
+
+.subjects-checkbox-container input[type="checkbox"] {
+    cursor: pointer;
+
 }
diff --git a/app/templates/app/search.html b/app/templates/app/search.html
index 3468a4e3..1cd6da27 100644
--- a/app/templates/app/search.html
+++ b/app/templates/app/search.html
@@ -10,29 +10,85 @@
                 <div class="card-body">
                     <h5 class="card-title">{% trans "Search a term" %}</h5>
 
+
                     <form method="get" class="container">
-                        {% for field in filter.form %}
-                            <div class="form-group">
-                                {{ field.label_tag }}<br>
-                                {% if field.name == "search" %}
-                                    <input type="search" name="{{ field.name }}" placeholder="{% trans 'Search...' %}"
-                                           class="form-control search-input" value="{{ request.GET.search|default_if_none:'' }}">
-                                {% else %}
-                                    {{ field }}
-                                {% endif %}
-                                {% if field.help_text %}
-                                    <small class="form-text text-muted">{{ field.help_text }}</small>
-                                {% endif %}
+
+                        <input type="search" name="{{ filter.form.search.name }}" placeholder="{% trans 'Search...' %}"
+                               class="form-control search-input"
+                               value="{{ request.GET.search|default_if_none:'' }}">
+
+                        <br>
+
+                        <div class="row">
+                            <div class="col-md-3">
+                                <div class="form-group">
+                                    <label for="id_subjects">Institution</label>
+                                    <div class="subjects-checkbox-container">
+                                        {% for checkbox in filter.form.institution %}
+                                            <div class="form-check">
+                                                {{ checkbox.tag }}
+                                                <label class="form-check-label"
+                                                       for="{{ checkbox.id_for_label }}">
+                                                    {{ checkbox.choice_label }}
+                                                </label>
+                                            </div>
+                                        {% endfor %}
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="col-md-3">
+                                <div class="form-group">
+                                    <label for="id_subjects">Document Type</label>
+                                    <div class="subjects-checkbox-container">
+                                        {% for checkbox in filter.form.document_type %}
+                                            <div class="form-check">
+                                                {{ checkbox.tag }}
+                                                <label class="form-check-label" for="{{ checkbox.id_for_label }}">
+                                                    {{ checkbox.choice_label }}
+                                                </label>
+                                            </div>
+                                        {% endfor %}
+                                    </div>
+                                </div>
                             </div>
-                        {% endfor %}
-                        <button class="btn btn-primary float-right" type="button" onclick="resetForm()">Clear Form
-                        </button>
+                            <div class="col-md-3">
+                                <div class="form-group">
+                                    <label for="id_subjects">Subjects</label>
+                                    <div class="subjects-checkbox-container">
+                                        {% for checkbox in filter.form.subjects %}
+                                            <div class="form-check">
+                                                {{ checkbox.tag }}
+                                                <label class="form-check-label" for="{{ checkbox.id_for_label }}">
+                                                    {{ checkbox.choice_label }}
+                                                </label>
+                                            </div>
+                                        {% endfor %}
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="col-md-3">
+                                <div class="form-group">
+                                    <label for="id_subjects">Languages</label>
+                                    <div class="subjects-checkbox-container">
+                                        {% for checkbox in filter.form.languages %}
+                                            <div class="form-check">
+                                                {{ checkbox.tag }}
+                                                <label class="form-check-label" for="{{ checkbox.id_for_label }}">
+                                                    {{ checkbox.choice_label }}
+                                                </label>
+                                            </div>
+                                        {% endfor %}
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+
                         <br>
                         <br>
                         <input type="submit" class="btn btn-success float-left"/>
                     </form>
-
-                    <hr>
+                    <br>
+                    <br>
 
                     {% for document in filter.qs %}
                         <div>