diff --git a/backend/migrations/0029_hydrolearnmoduleslist.py b/backend/migrations/0029_hydrolearnmoduleslist.py
new file mode 100644
index 0000000..1343f44
--- /dev/null
+++ b/backend/migrations/0029_hydrolearnmoduleslist.py
@@ -0,0 +1,29 @@
+# Generated by Django 3.2 on 2024-03-04 18:20
+
+from django.db import migrations, models
+import django.db.models.deletion
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('cms', '0022_auto_20180620_1551'),
+        ('backend', '0028_hydroshareresourcelist_placeholder_image'),
+    ]
+
+    operations = [
+        migrations.CreateModel(
+            name='HydroLearnModulesList',
+            fields=[
+                ('cmsplugin_ptr', models.OneToOneField(auto_created=True, on_delete=django.db.models.deletion.CASCADE, parent_link=True, primary_key=True, related_name='backend_hydrolearnmoduleslist', serialize=False, to='cms.cmsplugin')),
+                ('organization', models.CharField(blank=True, default='', max_length=200)),
+                ('placeholder_image', models.CharField(default='https://picsum.photos/200', max_length=200)),
+                ('updated_version', models.IntegerField(default=0, editable=False)),
+                ('modules', models.JSONField(default=dict, editable=False)),
+            ],
+            options={
+                'abstract': False,
+            },
+            bases=('cms.cmsplugin',),
+        ),
+    ]
diff --git a/backend/models.py b/backend/models.py
index 1b4d0db..605606e 100644
--- a/backend/models.py
+++ b/backend/models.py
@@ -105,52 +105,51 @@ def create_html_citations(sender, instance, *args, **kwargs):
 
 @receiver(post_save, sender=HydroLearnModulesList)
 def fetch_hydrolearn_modules(sender, instance, *args, **kwargs):
-    # general hydrolearn url
-    URL = "https://edx.hydrolearn.org"
-
-    client = requests.session()
-
-    # Retrieve the CSRF token first
-    client.get(URL)  # sets cookie
-    if "csrftoken" in client.cookies:
-        # Django 1.6 and up
-        csrftoken = client.cookies["csrftoken"]
-    else:
-        # older versions
-        csrftoken = client.cookies["csrf"]
-
-    courses_url = "https://edx.hydrolearn.org/search/course_discovery/"
+    modules_list = []
+    logger.warning("Fetching HydroLearn modules")
+    try:
+        URL = "https://edx.hydrolearn.org"
+        client = requests.session()
+        client.get(URL)  # sets cookie for CSRF
+        csrftoken = client.cookies.get("csrftoken", "") or client.cookies.get(
+            "csrf", ""
+        )
+        courses_url = f"{URL}/search/course_discovery/"
 
-    login_data = dict(csrfmiddlewaretoken=csrftoken)
-    courses_response = client.post(
-        courses_url, data=login_data, headers=dict(Referer=courses_url)
-    )
-    courses_list = courses_response.json()["results"]
-
-    # if organization is specified, then filter the courses
-    if instance.organization:
-        courses_list = list(
-            filter(
-                lambda course: course["data"]["org"] == instance.organization,
-                courses_list,
-            )
+        login_data = {"csrfmiddlewaretoken": csrftoken}
+        courses_response = client.post(
+            courses_url, data=login_data, headers={"Referer": courses_url}
         )
-    for course in courses_list:
-        course_url = f"{URL}/courses/course-v1:{course['org']}+{course['number']}+{course['run']}"
-        course_image_url = f'{URL}/{course["image_url"]}'
-        course_title = course["data"]["title"]["display_name"]
-        course_organization = course["org"]
-        course_code = course["number"]
-        course_weekly_effort = course["data"]["effort"]
-        course_description_content = course["data"]["short_description"]
-
-        course_dict = {
-            "course_title": course_title,
-            "course_url": course_url,
-            "course_image_url": course_image_url,
-            "course_organization": course_organization,
-            "course_code": course_code,
-            "course_weekly_effort": course_weekly_effort,
-            "course_description_content": course_description_content,
-        }
-        instance.modules["list_modules"].append(course_dict)
+        courses_list = courses_response.json()["results"]
+
+        if instance.organization:
+
+            def is_from_organization(course):
+                return course["data"]["org"] == instance.organization
+
+            courses_list = filter(is_from_organization, courses_list)
+        for course in courses_list:
+            course_data = course["data"]
+            course_dict = {
+                "course_title": course_data["content"]["display_name"],
+                "course_url": f"{URL}/courses/{course_data.get('course')}/about",
+                "course_image_url": (
+                    f'{URL}{course_data.get("image_url")}'
+                    if course_data.get("image_url", "") != ""
+                    else ""
+                ),
+                "course_organization": course_data.get("org", ""),
+                "course_code": course_data.get("number", ""),
+                "course_weekly_effort": course_data.get("effort", ""),
+                "course_description_content": course_data.get("content").get(
+                    "short_description", ""
+                ),
+            }
+            logger.warning(course_dict)
+
+            modules_list.append(course_dict)
+
+        instance.modules = modules_list
+    except Exception as e:
+        logger.warning(f"Error fetching HydroLearn modules: {e}")
+        instance.modules = modules_list
diff --git a/backend/templates/hydrolearn_list_modules.html b/backend/templates/hydrolearn_list_modules.html
index e009e51..9559dfb 100644
--- a/backend/templates/hydrolearn_list_modules.html
+++ b/backend/templates/hydrolearn_list_modules.html
@@ -20,13 +20,15 @@
     word-break: break-all;
     overflow:hidden;
     white-space: nowrap;
-}
-.name:hover{
-    overflow: visible; 
-    white-space: normal;
-    height:auto;  /* just added this line */
-}
-
+  }
+  .name:hover{
+      overflow: visible; 
+      white-space: normal;
+      height:auto;  /* just added this line */
+  }
+  .hydrolearn_module{
+    box-shadow: 0 1px 10px 0 rgba(0,0,0,0.125), inset 0 0 0 1px rgba(255,255,255,0.75);
+  }
 
 
 </style>
@@ -37,12 +39,9 @@
 
 
 <div class="container-hydrolearn-module-list-plugin">
-    {% for key, values in instance.modules.items %}
-    <div class="wrapper-publication-set">    
-            {% for module in values %}
-                {% include "single_hydrolearn_module.html" with module=module %}
-            {% endfor %}
-        
-    </div>
-    {% endfor %}
+      <div class="wrapper-publication-set">
+      {% for module in instance.modules %}
+          {% include "single_hydrolearn_module.html" with module=module %}
+      {% endfor %}
+      </div>
 </div>
\ No newline at end of file
diff --git a/backend/templates/single_hydrolearn_module.html b/backend/templates/single_hydrolearn_module.html
index 2da9235..c683808 100644
--- a/backend/templates/single_hydrolearn_module.html
+++ b/backend/templates/single_hydrolearn_module.html
@@ -4,16 +4,16 @@
 
 {% endaddtoblock %}
 
-    <div class="card border-white mb-3 w-100 card-height" >
+    <div class="hydrolearn_module card border-white mb-3 w-100 card-height" >
         <div class="row g-0">
             <div class="col-12 col-sm-6 col-md-4 col-lg-4 d-flex justify-content-center justify-content-md-end justify-content-lg-end align-items-center align-items-lg-center align-items-md-center" >
-            {% if resource.web_site_url  %} 
+            {% if resource.course_url  %} 
                 <a href="{{ module.course_url }}">
-                <img src="{{ module.image_url }}" class="img-tile img-fluid rounded-start" alt="..."  style="width:200px; height:200px;">
+                <img src="{{ module.course_image_url }}" class="img-tile img-fluid rounded-start" alt="..." >
                 </a>
             {% else %}
                 <a href='javascript:void(0)' class='portfolio-link'>
-                <img src="{{ module.image_url }}" class="img-tile img-fluid rounded-start h-100" alt="..." style="width:200px; height:200px;">
+                <img src="{{ module.course_image_url }}" class="img-tile img-fluid rounded-start h-100" alt="..." >
                 </a>
             {% endif %}
             </div>
@@ -21,19 +21,29 @@
                 <div class="card-body">
                     <div class="d-flex align-items-baseline gap-2 justify-content-center justify-content-lg-start justify-content-md-start">
                         <h5 class="card-title card-h5">{{ module.course_title }}</h5>
-                        <div style="width:fit-content;">
-                            <p class="card-text my-2 fs-6 lh-1.5 fw-light d-flex flex-row justify-content-between w-100 gap-3 bg-light rounded p-1"  style="max-width:300px;">
-                                {% if module.organization %}
-                                <a href="{{ module.course_organization }}" target="_blank" class="text-decoration-none text-secondary" title="source_code"> <i class="bi bi-github"></i></a>
-                                {% endif %}
-                                {% if module.course_code %}
-                                <a href="{{ module.course_code }}" target="_blank" class="text-decoration-none text-secondary" title="web page"> <i class="bi bi-arrow-up-right-square"></i> </a>
-                                {% endif %}
-                            </p>
-                        </div>
                     </div>
 
-                    <p class="card-subtitle mb-2 text-muted fst-italic">{{ module.course_weekly_effort }}</p>
+                        <div class="row g-0">
+                            <div class="col col-md-6 col-lg-6 col-xl-6 text-start">
+                                <p class="card-subtitle mb-2 text-muted" style="font-size:12px;">
+                                    {% if module.course_organization %}
+                                        <span class="text-muted">{{ module.course_organization }}</span>
+                                    {% endif %}
+                                </p>
+                            </div>
+                            <div class="col col-md-6 col-lg-6 col-xl-6 text-end">
+                                <p class="card-subtitle mb-2 text-muted" style="font-size:12px">
+                                    {% if module.course_code %}
+                                        <span class="text-muted">{{ module.course_code }}</span>
+                                    {% endif %}
+                                </p>
+                            </div>
+                        </div>
+
+                        {% if module.course_weekly_effort %}
+                            <p class="card-subtitle mb-2 text-muted fst-italic" style="font-size:12px;">Effort: {{ module.course_weekly_effort }}</p>
+                        {% endif %}
+
                     <div class="d-flex flex-column justify-content-center justify-content-lg-start justify-content-md-start text-center text-lg-start text-md-start">
                         <p class="name w-100">
                             {{ module.course_description_content }}