diff --git a/ims-education.html b/ims-education.html
index 71f0403a..56368dc1 100644
--- a/ims-education.html
+++ b/ims-education.html
@@ -1,1182 +1,839 @@
 <!DOCTYPE html>
-<html lang="en-US" prefix="og: http://ogp.me/ns#">
+<html lang="en-US">
 
 <head>
+	<!-- Basic meta -->
 	<meta charset="UTF-8">
 	<meta name="viewport" content="width=device-width, initial-scale=1">
-<!-- v18 basic meta -->
 	<meta name="geo.country" content="ZZ" />
 	<meta name="dcterms.rights" content="� Copyright IBM Corp. 2020" />
 	<meta name="dcterms.date" content="2020-07-18" />
 	<meta name="keywords" content="IMS Central, IMS Developer, IMS" />
 	<meta name="robots" content="index, follow" />
-<!-- Favicon -->
+
+	<!-- Favicon -->
 	<link id="favicon"
 	rel="shortcut icon"
 	type="image/x-icon"
 	href="wp-content/IMS_logo_small.png">
 
-<!-- Pageittle -->
-<title>IMS Courses</title>
-
-<!-- Meta -->
-<link rel="canonical" href="ims-education.html" />
-<meta property="og:locale" content="en_US" />
-<meta property="og:type" content="article" />
-<meta property="og:title" content="IMS Courses" />
-<meta property="og:description" content="IMS Courses" />
-<meta property="og:url" content="http://www/imsdev.github.io/ims-education.html" />
-<meta property="og:site_name" content="IMS Central" />
-<meta property="og:image" content="http://www/imsdev.github.io/wp-content/IMS_logo_large.png" />
-<meta name="twitter:card" content="summary" />
-<meta name="twitter:description" content="IMS Courses" />
-<meta name="twitter:title" content="IMS Courses" />
-<meta property="og:image" content="http://www/imsdev.github.io/wp-content/IMS_logo_large.png" />
-
-<!-- Sheets -->
-<link rel='stylesheet' id='dwboomer-style-css'  href='wp-content/themes/boomer-v18/style.css' type='text/css' media='all' />
-<link rel='stylesheet' id='dashicons-css'  href='wp-includes/css/dashicons.min.css' type='text/css' media='all' />
-<link rel='stylesheet' id='pagepost_css-css'  href='wp-content/themes/boomer-v18/css/pagepost.css' type='text/css' media='all' />
-<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
-<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
-<link rel="stylesheet" href="wp-includes/css/nav.css">
-<link rel="stylesheet" href="wp-includes/css/dropnav.css">
-<link href="wp-includes/css/www.css" rel="stylesheet" />
-<link href="wp-includes/css/grid-fluid.css" rel="stylesheet">
-<link href="wp-includes/css/tables.css" rel="stylesheet">
-<link href="wp-includes/css/pages/education.css" rel="stylesheet">
-
-<!-- Hotjar Tracking Code for ibm.com/demos &  githhub -->
-<script>
-	(function(h,o,t,j,a,r){
-		h.hj=h.hj||function(){(h.hj.q=h.hj.q||[]).push(arguments)};
-		h._hjSettings={hjid:132193,hjsv:6};
-		a=o.getElementsByTagName('head')[0];
-		r=o.createElement('script');r.async=1;
-		r.src=t+h._hjSettings.hjid+j+h._hjSettings.hjsv;
-		a.appendChild(r);
-	})(window,document,'https://static.hotjar.com/c/hotjar-','.js?sv=');
-  </script>
-
-<!-- Additional styling for content after navigation -->
-
-<link rel="stylesheet" type="text/css" href="wp-includes/css/pure.css">
-<link rel="stylesheet" href="wp-includes/css/grids-responsive-min.css">
-<link rel="stylesheet" type="text/css" href="wp-includes/css/homepage.css">
-<script src="wp-includes/js/jquery.min.js"></script>
-
-<!-- TipueSearch -->
-<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
-<script src="jekyll-tipue-search/assets/tipuesearch/tipuesearch_content.js"></script>
-<script src="jekyll-tipue-search/assets/tipuesearch/tipuesearch_set.js"></script>
-<script src="jekyll-tipue-search/assets/tipuesearch/tipuesearch.min.js"></script>
+	<!-- Page title -->
+	<title>IMS Courses</title>
+
+	<!-- Meta -->
+	<link rel="canonical" href="ims-education.html" />
+	<meta property="og:locale" content="en_US" />
+	<meta property="og:type" content="article" />
+	<meta property="og:title" content="IMS Courses" />
+	<meta property="og:description" content="IMS Courses" />
+	<meta property="og:url" content="http://www/imsdev.github.io/ims-education.html" />
+	<meta property="og:site_name" content="IMS Central" />
+	<meta property="og:image" content="http://www/imsdev.github.io/wp-content/IMS_logo_large.png" />
+	<meta name="twitter:card" content="summary" />
+	<meta name="twitter:description" content="IMS Courses" />
+	<meta name="twitter:title" content="IMS Courses" />
+	<meta property="og:image" content="http://www/imsdev.github.io/wp-content/IMS_logo_large.png" />
+
+	<!-- Sheets -->
+	<!-- Imported styling -->
+	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
+	<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
+	<!-- Migrated stylesheets -->
+	<link rel='stylesheet' id='dwboomer-style-css'  href='wp-content/themes/boomer-v18/style.css' type='text/css' media='all' />
+	<link rel="stylesheet" href="wp-includes/css/www.css" />
+	<!-- Pure CSS -->
+	<link rel="stylesheet" href="wp-includes/css/pure.css">
+	<link rel="stylesheet" href="wp-includes/css/grids-responsive-min.css">
+	<!-- Custom CSS -->
+	<link rel="stylesheet" href="wp-includes/css/homepage.css">
+	<link rel="stylesheet" href="wp-includes/css/nav.css">
+	<link rel="stylesheet" href="wp-includes/css/dropnav.css">
+	<link rel="stylesheet" href="wp-includes/css/page.css">
+	<link href="wp-includes/css/pages/education.css" rel="stylesheet">
+
+	<!-- Hotjar Tracking Code for ibm.com/demos &  githhub -->
+	<script>
+		(function(h,o,t,j,a,r){
+			h.hj=h.hj||function(){(h.hj.q=h.hj.q||[]).push(arguments)};
+			h._hjSettings={hjid:132193,hjsv:6};
+			a=o.getElementsByTagName('head')[0];
+			r=o.createElement('script');r.async=1;
+			r.src=t+h._hjSettings.hjid+j+h._hjSettings.hjsv;
+			a.appendChild(r);
+		})(window,document,'https://static.hotjar.com/c/hotjar-','.js?sv=');
+	</script>
+
+	<!-- Additional styling for content after navigation -->
+	<script src="wp-includes/js/jquery.min.js"></script>
+
+	<!-- TipueSearch -->
+	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
+	<script src="jekyll-tipue-search/assets/tipuesearch/tipuesearch_content.js"></script>
+	<script src="jekyll-tipue-search/assets/tipuesearch/tipuesearch_set.js"></script>
+	<script src="jekyll-tipue-search/assets/tipuesearch/tipuesearch.min.js"></script>
+
+	<!-- delayed search -->
+	<script src="jekyll-tipue-search/assets/tipuesearch/delayedsearch.js"></script>
+
+	<!-- Hamburger menu -->
+	<script src="wp-includes/js/navbar.js"></script>
+
+	<!-- Web components -->
+	<script src="web-components/course-card/course-card.js" type="module"></script>
+</head>
 
-<!-- delayed search -->
-<script src="jekyll-tipue-search/assets/tipuesearch/delayedsearch.js"></script>
+<!-- MASTHEAD_SITENAV_BEGIN -->
+<body id="ibm-com" class="ibm-com ibm-type">
+	<div id="ibm-content-wrapper" class="sticky-nav">
+		<header id="ibm-pageheader" aria-label="Site navigation bar">
+		<a class="skip-link screen-reader-text" href="#main">Skip to content</a>
+
+		<!-- --------------- NAV BAR --------------- -->
+		<section class="p-menu1">
+			<nav id="navbar" class="navigation" aria-labelledby="ibm-pageheader">
+		
+			<!-- Site name wrapper -->
+			<span class="sitename-wrap">
+			<a href="index.html" class="logo-container">
+				<img src="wp-content/IMS_logo_small.png"
+				id="left-bar-brand"
+				alt="IMS logo"
+				>
+			</a>
+			<a href="index.html" class="logo-container">
+				<h4 class="site-header-text">
+				IBM <b>IMS Central</b>
+				</h4>
+			</a>
+			</span>
+		
+			<!-- Search wrapper -->
+			<form id="searchbar" aria-label="Search">
+			<div class="tipue_search_right">
+				<svg id="search-mag" alt="Search magnifying glass" xmlns="http://www.w3.org/2000/svg" width="22px" height="22px" viewBox="0 0 32 32">
+				<defs>
+					<style> .cls-1 { fill: none; } </style>
+				</defs>
+				<path d="M29,27.5859l-7.5521-7.5521a11.0177,11.0177,0,1,0-1.4141,1.4141L27.5859,29ZM4,13a9,9,0,1,1,9,9A9.01,9.01,0,0,1,4,13Z" transform="translate(0 0)"/>
+				<rect id="_Transparent_Rectangle_" data-name="&lt;Transparent Rectangle&gt;" class="cls-1" width="32" height="32"/>
+				</svg>
+				<input type="text" name="q" id="tipue_search_input"
+				pattern=".{3,}" title="Search bar"
+				placeholder="What are you looking for today?" autocomplete="off" required autofocus>
+				<svg id="search-clr" aria-label="Clear search" role="button" tabindex="0" xmlns="http://www.w3.org/2000/svg" height="15px" viewBox="0 0 329.26933 329" width="15px">
+				<path d="m194.800781 164.769531 128.210938-128.214843c8.34375-8.339844 8.34375-21.824219 0-30.164063-8.339844-8.339844-21.824219-8.339844-30.164063 0l-128.214844 128.214844-128.210937-128.214844c-8.34375-8.339844-21.824219-8.339844-30.164063 0-8.34375 8.339844-8.34375 21.824219 0 30.164063l128.210938 128.214843-128.210938 128.214844c-8.34375 8.339844-8.34375 21.824219 0 30.164063 4.15625 4.160156 9.621094 6.25 15.082032 6.25 5.460937 0 10.921875-2.089844 15.082031-6.25l128.210937-128.214844 128.214844 128.214844c4.160156 4.160156 9.621094 6.25 15.082032 6.25 5.460937 0 10.921874-2.089844 15.082031-6.25 8.34375-8.339844 8.34375-21.824219 0-30.164063zm0 0"/>
+				</svg>
+			</div>
+			</form>
 
-<!-- Hamburger menu -->
-<script src="wp-includes/js/navbar.js"></script>
+			<!-- On page-load activation -->
+			<script>
+			$(document).ready(function() {
+				$('#tipue_search_input').tipuesearch();
+			});
+			</script>
 
-</head>
+			<!-- Search drop-down -->
+			<div id="tipue_search_content" class="search_content search-dropdown"></div>
 
-<!-- MASTHEAD_SITENAV_BEGIN -->
-<body id="ibm-com" class="ibm-com ibm-type group-blog">
-	<div class="ibm-landing-page">
-	    <div id="ibm-content-wrapper" class="sticky-nav">
-			<header id="ibm-pageheader" aria-label="Site navigation bar">
-			<a class="skip-link screen-reader-text" href="#main">Skip to content</a>
-	
-			<!-- --------------- NAV BAR --------------- -->
-			<section class="p-menu1">
-			  <nav id="navbar" class="navigation" aria-labelledby="ibm-pageheader">
+			<!-- Hamburger drop-down menu -->
+			<input type="checkbox" tabindex="0" id="toggle1" class="support-enter" aria-label="Hamburger Menu"/>
 			
-			  <!-- Site name wrapper -->
-			  <span class="sitename-wrap">
-				<a href="index.html" class="logo-container">
-				  <img src="wp-content/IMS_logo_small.png"
-					id="left-bar-brand"
-					alt="IMS logo"
-				  >
+			<label class="hamburger1">
+			<!-- Burgie wrapper -->
+			<label class="burg-wrap" for="toggle1">
+				<span class="hide-label">Label for input</span>
+				<span class="burg-bars">
+				<span class="hide-label">Label for input</span>
+				<div class="top"></div>
+				<div class="meat"></div>
+				<div class="bottom"></div>
+				</span>
+			</label>
+			</label>
+		
+			<!-- Hamburger drop-down menu options -->
+			<nav class="menu1" aria-label="Dropdown menu items">
+			<div class="pages pure-g">
+				
+				<!-- Learn -->
+				<div class="pure-u-1 pure-u-sm-1-4">
+				<h3>Learn</h3>
+				<!-- cards/pages -->
+				<!-- 1 -->
+				<a title="IMS Videos" href="ims-videos.html" class="nav-item" tabindex="-1">
+					<div class="navcard">
+					<h5>IMS videos</h5>
+					<p>Choose from hundreds of educational videos on IMS components, functions, and tools.</p>
+					</div>
 				</a>
-				<a href="index.html" class="logo-container">
-				  <h4 class="site-header-text">
-					IBM <b>IMS Central</b>
-				  </h4>
+				<!-- 2 -->
+				<a title="IMS Courses" href="ims-education.html" class="nav-item" tabindex="-1">
+					<div class="navcard">
+					<h5>IMS courses</h5>
+					<p>Get in-depth IMS education with these self-paced courses and earn digital badges.</p>
+					</div>
+				</a>
+				<!-- 3 -->
+				<a title="IMS Repos on GitHub" href="ims-repos.html" class="nav-item" tabindex="-1">
+					<div class="navcard">
+					<h5>IMS repos on GitHub</h5>
+					<p>Get code samples and tutorials on IMS components, workflows, Java, and more.</p>
+					</div>
 				</a>
-			  </span>
-			
-			  <!-- Search wrapper -->
-			  <form id="searchbar" aria-label="Search">
-				<div class="tipue_search_right">
-				  <svg id="search-mag" alt="Search magnifying glass" xmlns="http://www.w3.org/2000/svg" width="22px" height="22px" viewBox="0 0 32 32">
-					<defs>
-					  <style> .cls-1 { fill: none; } </style>
-					</defs>
-					<path d="M29,27.5859l-7.5521-7.5521a11.0177,11.0177,0,1,0-1.4141,1.4141L27.5859,29ZM4,13a9,9,0,1,1,9,9A9.01,9.01,0,0,1,4,13Z" transform="translate(0 0)"/>
-					<rect id="_Transparent_Rectangle_" data-name="&lt;Transparent Rectangle&gt;" class="cls-1" width="32" height="32"/>
-				  </svg>
-				  <input type="text" name="q" id="tipue_search_input"
-					pattern=".{3,}" title="Search bar"
-					placeholder="What are you looking for today?" autocomplete="off" required autofocus>
-				  <svg id="search-clr" aria-label="Clear search" role="button" tabindex="0" xmlns="http://www.w3.org/2000/svg" height="15px" viewBox="0 0 329.26933 329" width="15px">
-					<path d="m194.800781 164.769531 128.210938-128.214843c8.34375-8.339844 8.34375-21.824219 0-30.164063-8.339844-8.339844-21.824219-8.339844-30.164063 0l-128.214844 128.214844-128.210937-128.214844c-8.34375-8.339844-21.824219-8.339844-30.164063 0-8.34375 8.339844-8.34375 21.824219 0 30.164063l128.210938 128.214843-128.210938 128.214844c-8.34375 8.339844-8.34375 21.824219 0 30.164063 4.15625 4.160156 9.621094 6.25 15.082032 6.25 5.460937 0 10.921875-2.089844 15.082031-6.25l128.210937-128.214844 128.214844 128.214844c4.160156 4.160156 9.621094 6.25 15.082032 6.25 5.460937 0 10.921874-2.089844 15.082031-6.25 8.34375-8.339844 8.34375-21.824219 0-30.164063zm0 0"/>
-				  </svg>
 				</div>
-			  </form>
-	
-			  <!-- On page-load activation -->
-			  <script>
-				$(document).ready(function() {
-				  $('#tipue_search_input').tipuesearch();
-				});
-			  </script>
-	
-			  <!-- Search drop-down -->
-			  <div id="tipue_search_content" class="search_content search-dropdown"></div>
-	
-			  <!-- Hamburger drop-down menu -->
-			  <input type="checkbox" tabindex="0" id="toggle1" class="support-enter" aria-label="Hamburger Menu"/>
-			  
-			  <label class="hamburger1">
-				<!-- Burgie wrapper -->
-				<label class="burg-wrap" for="toggle1">
-				  <span class="hide-label">Label for input</span>
-				  <span class="burg-bars">
-					<span class="hide-label">Label for input</span>
-					<div class="top"></div>
-					<div class="meat"></div>
-					<div class="bottom"></div>
-				  </span>
-				</label>
-			  </label>
-			
-			  <!-- Hamburger drop-down menu options -->
-			  <nav class="menu1" aria-label="Dropdown menu items">
-				<div class="pages pure-g">
-					
-					<!-- Learn -->
-				  <div class="pure-u-1 pure-u-sm-1-4">
-					<h3>Learn</h3>
-					<!-- cards/pages -->
-					<!-- 1 -->
-					<a title="IMS Videos" href="ims-videos.html" class="nav-item" tabindex="-1">
-					  <div class="navcard">
-						<h5>IMS videos</h5>
-						<p>Choose from hundreds of educational videos on IMS components, functions, and tools.</p>
-					  </div>
-					</a>
-					<!-- 2 -->
-					<a title="IMS Courses" href="ims-education.html" class="nav-item" tabindex="-1">
-					  <div class="navcard">
-						<h5>IMS courses</h5>
-						<p>Get in-depth IMS education with these self-paced courses and earn digital badges.</p>
-					  </div>
-					</a>
-					<!-- 3 -->
-					<a title="IMS Repos on GitHub" href="ims-repos.html" class="nav-item" tabindex="-1">
-					  <div class="navcard">
-						<h5>IMS repos on GitHub</h5>
-						<p>Get code samples and tutorials on IMS components, workflows, Java, and more.</p>
-					  </div>
-					</a>
-				  </div>
 
-				  <!-- Innovate -->
-				  <div class="pure-u-1 pure-u-sm-1-4">
-					<h3>Innovate</h3>
-					<!-- cards/pages -->
-					<!-- 1 -->
-					<a title="APIs" href="ims-apis.html" class="nav-item" tabindex="-1"> 
-					  <div class="navcard">
-						<h5>APIs</h5>
-						<p>Unlock the value of your IMS applications by making easily consumable APIs in minutes.</p>
-					  </div>
-					</a>
-					<!-- 2 -->
-					<a title="DevOps" href="ims-devops.html" class="nav-item" tabindex="-1">
-					  <div class="navcard">
-						<h5>Automation</h5>
-						<p>Learn how to automate your IT infrastructure and applications on IBM Z.</p>
-					  </div>
-					</a>
-					<!-- 3 -->
-					<a title="Java" href="ims-java.html" class="nav-item" tabindex="-1">
-					  <div class="navcard">
-						<h5>Java</h5>
-						<p>Build Java applications to run inside or outside IMS.</p>
-					  </div>
-					</a>
-					<!-- 4 -->
-					<a title="Database" href="ims-db.html" class="nav-item" tabindex="-1">
-					  <div class="navcard">
-						<h5>IMS Database</h5>
-						<p>IMS Database: fast, secure, reliable.</p>
-					  </div>
-					</a>
-					<!-- 5 -->
-					<a title="Transaction Manager" href="ims-tm.html" class="nav-item" tabindex="-1">
-						<div class="navcard">
-							<h5>IMS Transaction Manager</h5>
-							<p>IMS Transaction Manager: fast, secure, connected.</p>
-						</div>
-					</a>
-				  </div>
-			  
-				  <!-- Engage -->
-				  <div class="pure-u-1 pure-u-sm-1-4">
-					<h3>Engage</h3>
-					<!-- cards/pages -->
-					<!-- 1 -->
-					<a title="Gold" href="ims-gold.html" class="nav-item" tabindex="-1">
-					  <div class="navcard">
-						<h5>IMS Gold</h5>
-						<p>Join the IMS client feedback program for the latest IMS news and engage with other customers.</p>
-					  </div>
-					</a>
-					<!-- 2 -->
-					<a title="IMS Community" class="nav-item" tabindex="-1" target="_blank" rel="noopener noreferrer"
-					  href="https://community.ibm.com/community/user/ibmz-and-linuxone/groups/topic-home?CommunityKey=eba3ada3-db89-4dca-9154-328195f5e560">
-					  <div class="navcard">
-						<h5>IMS community
-						  <img src="wp-content/Icon07.png" alt="External link" style="height: 15px; width: 15px;margin-left:10px"></img>
-						</h5>
-						<p>See the latest IMS blogs, engage in IMS forums, and more by visiting the <b><em>IMS Community</em></b> website.</p>
-					  </div>
+				<!-- Innovate -->
+				<div class="pure-u-1 pure-u-sm-1-4">
+				<h3>Innovate</h3>
+				<!-- cards/pages -->
+				<!-- 1 -->
+				<a title="APIs" href="ims-apis.html" class="nav-item" tabindex="-1"> 
+					<div class="navcard">
+					<h5>APIs</h5>
+					<p>Unlock the value of your IMS applications by making easily consumable APIs in minutes.</p>
+					</div>
+				</a>
+				<!-- 2 -->
+				<a title="DevOps" href="ims-devops.html" class="nav-item" tabindex="-1">
+					<div class="navcard">
+					<h5>Automation</h5>
+					<p>Learn how to automate your IT infrastructure and applications on IBM Z.</p>
+					</div>
+				</a>
+				<!-- 3 -->
+				<a title="Java" href="ims-java.html" class="nav-item" tabindex="-1">
+					<div class="navcard">
+					<h5>Java</h5>
+					<p>Build Java applications to run inside or outside IMS.</p>
+					</div>
+				</a>
+				<!-- 4 -->
+				<a title="Database" href="ims-db.html" class="nav-item" tabindex="-1">
+					<div class="navcard">
+					<h5>IMS Database</h5>
+					<p>IMS Database: fast, secure, reliable.</p>
+					</div>
+				</a>
+				<!-- 5 -->
+				<a title="Transaction Manager" href="ims-tm.html" class="nav-item" tabindex="-1">
+					<div class="navcard">
+						<h5>IMS Transaction Manager</h5>
+						<p>IMS Transaction Manager: fast, secure, connected.</p>
+					</div>
+				</a>
+				</div>
+			
+				<!-- Engage -->
+				<div class="pure-u-1 pure-u-sm-1-4">
+				<h3>Engage</h3>
+				<!-- cards/pages -->
+				<!-- 1 -->
+				<a title="Gold" href="ims-gold.html" class="nav-item" tabindex="-1">
+					<div class="navcard">
+					<h5>IMS Gold</h5>
+					<p>Join the IMS client feedback program for the latest IMS news and engage with other customers.</p>
+					</div>
+				</a>
+				<!-- 2 -->
+				<a title="IMS Community" class="nav-item" tabindex="-1" target="_blank" rel="noopener noreferrer"
+					href="https://community.ibm.com/community/user/ibmz-and-linuxone/groups/topic-home?CommunityKey=eba3ada3-db89-4dca-9154-328195f5e560">
+					<div class="navcard">
+					<h5>IMS community
+						<img src="wp-content/Icon07.png" alt="External link" style="height: 15px; width: 15px;margin-left:10px"></img>
+					</h5>
+					<p>See the latest IMS blogs, engage in IMS forums, and more by visiting the <b><em>IMS Community</em></b> website.</p>
+					</div>
+				</a>
+				<!-- 3 -->
+				<a title="Advocates and ideas" href="ims-advocacy.html" class="nav-item" tabindex="-1">
+					<div class="navcard">
+						<h5>Advocates and ideas</h5>
+						<p>Get an IMS advocate to represent you and learn how to submit ideas to the IMS team.</p>
+					</div>
 					</a>
-					<!-- 3 -->
-					<a title="Advocates and ideas" href="ims-advocacy.html" class="nav-item" tabindex="-1">
-						<div class="navcard">
-						  <h5>Advocates and ideas</h5>
-						  <p>Get an IMS advocate to represent you and learn how to submit ideas to the IMS team.</p>
-						</div>
-					  </a>
-					<!-- 4 -->
-					<a title="IMS Internship" href="ims-internship-2025.html" class="nav-item" tabindex="-1">
-						<div class="navcard">
-							<h5>IMS Customer Internship</h5>
-							<p>Register for the May 2025 event today.</p>
+				<!-- 4 -->
+				<a title="IMS Internship" href="ims-internship-2025.html" class="nav-item" tabindex="-1">
+					<div class="navcard">
+						<h5>IMS Customer Internship</h5>
+						<p>Register for the May 2025 event today.</p>
+					</div>
+				</a>
+				</div>
+			
+				<!-- Docs & Support -->
+				<div class="pure-u-1 pure-u-sm-1-4">
+				<h3>
+					Documentation & support
+				</h3>
+				<!-- cards/pages -->
+				<!-- 1 -->
+				<a title="IMS Docs" href="ims-docs.html" class="nav-item" tabindex="-1">
+					<div class="navcard">
+					<h5>IMS documentation</h5>
+					<p>Find information on IMS, tools, and other IBM products.</p>
+					</div>
+				</a>
+				<!-- 2 -->
+				<a title="IMS Support" href="ims-support.html" class="nav-item" tabindex="-1">
+					<div class="navcard">
+					<h5>IMS support</h5>
+					<p>Get help with IMS or other IBM products.</p>
+					</div>
+				</a>
+				</div>
+			</div>
+			</nav>
+		</section>
+		</header>
+	</div>
+
+	<div id="content" class="main-content">
+		<!-- MAIN CONTENT -->
+		<main id="main">
+			<!-- =========================== Hero =========================== -->
+			<section class="learn-bg">
+				<div id="intro-section" class="pure-g hero">
+					<div class="pure-u-1 pure-u-md-1-24">
+						<img src="wp-content/course.svg" alt="" class="icon icon-xl">
+					</div>
+					<div class="pure-u-1 pure-u-md-23-24">
+						<h6>Learn</h6>
+						<h1>IMS courses</h1>
+						<p>Get comprehensive IMS™ education by taking these self-paced, digital courses.</p>
+						<p class="subtext">You can also earn a digital badge!</p>
+						<div class="button-g">
+							<a class="button button-primary" 
+							onfocus="closeNavMenu()" 
+							target="_blank"
+							aria-label="Sign up for an IBM ID to enroll in IMS courses" 
+							href="https://login.ibm.com/authsvc/mtfim/sps/authsvc?PolicyId=urn:ibm:security:authentication:asf:basicldapuser&Target=https%3A%2F%2Flogin.ibm.com%2Foidc%2Fendpoint%2Fdefault%2Fauthorize%3FqsId%3D9fe3fe66-c22f-4c7b-8e5d-01dfc0e8defa%26client_id%3DMyIBMDallasProdCI" 
+							rel="noopener noreferrer">
+							Sign up for an IBM ID →
+							</a>
 						</div>
-					</a>
-				  </div>
-			  
-				  <!-- Docs & Support -->
-				  <div class="pure-u-1 pure-u-sm-1-4">
-					<h3>
-					  Documentation & support
-					</h3>
-					<!-- cards/pages -->
-					<!-- 1 -->
-					<a title="IMS Docs" href="ims-docs.html" class="nav-item" tabindex="-1">
-					  <div class="navcard">
-						<h5>IMS documentation</h5>
-						<p>Find information on IMS, tools, and other IBM products.</p>
-					  </div>
-					</a>
-					<!-- 2 -->
-					<a title="IMS Support" href="ims-support.html" class="nav-item" tabindex="-1">
-					  <div class="navcard">
-						<h5>IMS support</h5>
-						<p>Get help with IMS or other IBM products.</p>
-					  </div>
-					</a>
-				  </div>
+					</div>
 				</div>
-			  </nav>
 			</section>
-		  </header>
-		</div>
-
-		<!-- Additional styling for content after navigation -->
-		<head>
-			<link rel="stylesheet" type="text/css" href="wp-includes/css/pure.css">
-			<link rel="stylesheet" href="wp-includes/css/grids-responsive-min.css">
-			<link rel="stylesheet" type="text/css" href="wp-includes/css/homepage.css">
-		</head>
-
-		<div id="content" class="site-content">
-			<div class="content-area" id="content-area">
-				<div class="entry-content">
-					<!-- MAIN CONTENT -->
-					<main class="zs-main" id="main">
 
-						<div>	
-							<!-- =========================== IMS Courses banner =========================== -->
-							<div class="banner learn-bg ed-banner">
-								<section id="intro-section" class="pure-g zs-section intro-sec">
-									<div id="intro-header" class="pure-u-1"></div>
-									<div class="pure-u-3-25">
-										<img class="ims-card-icon" src="wp-content/course.svg" alt="">
-									</div>
-									<div id="intro-info" class="pure-u-1 pure-u-sm-1-2">
-										<h6>Learn</h6>
-										<h1>IMS courses</h1>
-										<p id="p-style">Get comprehensive IMS™ education by taking these self-paced, digital courses.</p>
-										<p class="intro-p-sub">You can also earn a digital badge!</p>
-										<div class="pure-u-1 intro-button">
-											<a class="zs-w-button-transparent" onfocus="closeNavMenu()" aria-label="Sign up for an IBM ID to enroll in IMS courses"
-												href="https://login.ibm.com/authsvc/mtfim/sps/authsvc?PolicyId=urn:ibm:security:authentication:asf:basicldapuser&Target=https%3A%2F%2Flogin.ibm.com%2Foidc%2Fendpoint%2Fdefault%2Fauthorize%3FqsId%3D9fe3fe66-c22f-4c7b-8e5d-01dfc0e8defa%26client_id%3DMyIBMDallasProdCI" target="_blank" rel="noopener noreferrer">
-												Sign up for an IBM ID →
-											</a>
-										</div>
-									</div>
-								</section>
-							</div>
-
-							<!-- =========================== Row for filtering =========================== -->
-							<!-- remember, the behaviour is that clicking pulls you to the anchors -->
-							<div class="zs-section ed-filter">
-								<div class="pure-g">
-									<!-- Filter list -->
-									<div class="ibm-sitenav-menu-list ed-filter-list">
-										<ul class="menu">
-											<li><a href="#all">All roles</a></li>
-											<li><a href="#imsdb">IMS database</a></li>
-											<li><a href="#sysprog">System programming</a></li>
-											<li><a href="#appdev">Application development</a></li>
-											<li><a href="#faq">FAQs</a></li>
-											<li><a href="#support">Support</a></li>
-										</ul>
-									</div>
-								</div>
-							</div>
-						</div>
-
-						<!-- =========================== Badges & courses  =========================== -->
-						<div class="zs-gray-section zs-white-section courses-sec">
-							<section id="courses-section" class="zs-section pure-g">
-								<div class="pure-u-22-24 courses-sec-space">
-
-									<!-- ALL ROLES header -->
-									<h2 id="all">All roles</h2>
-
-									<!-- card -->
-									<div class="ims-course-card">
-										<div class="course-c-id" id="ims-fundamentals"></div>
-										<div class="pure-u-1">
-											<div class="pure-u-1 pure-u-md-6-24">
-												<img src="wp-content/course-badges/badge_ims_fundamentals.png" alt="IMS Fundamentals badge">
-											</div>
-											<div class="pure-u-1 pure-u-md-18-24 course-c-desc">
-												<h3>IMS Fundamentals</h3>
-												<p>
-													Learn about the main components of IBM IMS: IMS Database Manager (IMS DB), 
-													IMS Transaction Manager (IMS TM), and common system services for IMS DB and IMS TM. 
-													Learn how these components work and interact with applications, how IMS databases differ from each other 
-													and differ from relational databases message types, security, maintenance, troubleshooting, and more.
-												</p>	
-												<div class="pure-u-1 pure-u-md-1 course-c-info">
-													<p>
-														<b>Level</b>: Beginner
-														&ensp;
-														<b>Cost</b>: None
-														&ensp;
-														<b>Badge</b>: Yes
-														&ensp;
-														<b>Time</b>: 32 hours
-													</p>
-													<div class="course-c-info">
-														<a aria-label="Learn more about IMS Fundamentals"
-															title="IMS Fundamentals" target="_blank" rel="noopener noreferrer" 
-															href="https://learn.ibm.com/course/view.php?id=8829">
-															Learn more →
-														</a>
-													</div>
-												</div>
-											</div>
-										</div>
-									</div>
-
-									<!-- card -->
-									<div class="ims-course-card">
-										<div style="position: absolute; margin-top:-60px;" id="ims-intro-pli"></div>
-										<div class="pure-u-1">
-											<div class="pure-u-1 pure-u-md-6-24">
-												<img src="wp-content/course-badges/badge_intro_pli.png" alt="Introduction to PL/I badge" style="width: 100%;height:100%;max-height: 300px;padding-bottom: 1px;">
-											</div>
-											<div class="pure-u-md-18-24" style="padding:35px;margin-right: -10px;">
-												<h3 style="color: black;">Introduction to the PL/I Programming Language</h3>
-												<p>In this 8-hour, introductory course, you’ll learn about the parallels and differences 
-													between C and PL/I, particularly in language syntax, program structure, declarations, 
-													loops, data types, arrays, structures, and more.</p>	
-													<div class="pure-u-1 pure-u-md-1">
-														<div style="margin-top:15px;" >
-															<p>
-																<b>Level</b>: Beginner
-																&ensp;
-																<b>Cost</b>: None
-																&ensp;
-																<b>Badge</b>: Yes
-																&ensp;
-																<b>Time</b>: 8 hours
-															</p>
-														</div>
-														<div style="margin-top:15px;" >
-														<a aria-label="Learn more about Introduction to the PL/I Programming Language"
-														title="Introduction to the PL/I Programming Language" target="_blank" rel="noopener noreferrer" 
-														href="https://www.ibm.com/training/course/introduction-to-the-pli-programming-language-DL00964G" 
-														style="position: relative;bottom:0;margin-bottom:30px;text-align: left;">Learn more →</a>
-														</div>
-													</div>
-
-											</div>
-										</div>
-									</div>		
-
-									<!-- DB header -->
-									<h2 id="imsdb" style="color: black;margin-left: 16px;">IMS database</h2>
-
-									<!-- card -->
-									<div class="ims-course-card" style="margin-top: 3.5em;">
-										<div style="position: absolute; margin-top:-60px;" id="ims-dbfund"></div>
-										<div class="pure-u-1">
-											<div class="pure-u-1 pure-u-md-6-24">
-												<img src="wp-content/course-badges/badge_log_rel.png" alt="IMS Logical Relationships badge" style="width: 100%;height:100%;max-height: 300px;padding-bottom: 1px;">
-											</div>
-											<div class="pure-u-1 pure-u-md-18-24" style="padding:35px;margin-right: -10px;">
-												<h3 style="color: black;">IMS Logical Relationships</h3>
-												<p>
-													Logical relationships establish a logical access paths between segments that are usually in different databases. In this course, you’ll 
-													learn how to code the DBDs and PSBs for IMS databases involved in logical relationships, adjust the performance of these 
-													databases, and review IMS Monitor reports to see whether the logical relationships are effective.
-												</p>	
-													<div class="pure-u-1 pure-u-md-1">
-														<div style=" margin-top:15px;">
-															<p>
-																<b>Level</b>: Advanced
-																&ensp;
-																<b>Cost</b>: None
-																&ensp;
-																<b>Badge</b>: Yes
-																&ensp;
-																<b>Time</b>: 30 hours
-															</p>
-														</div>
-														<div style="margin-top:15px;" >
-														<a aria-label="Learn more about IMS Logical Relationships"
-														title="IMS Logical Relationships" target="_blank" rel="noopener noreferrer" 
-														href="https://www.ibm.com/training/course/ims-logical-relationships-DL00966G" 
-														style="position: relative;bottom:0;margin-bottom:30px;text-align: left;">Learn more →</a>
-														</div>
-												</div>
-						
-											</div>
-										</div>
-									</div>
-
-									<!-- card -->
-									<div class="ims-course-card" style="margin-top: 3.5em;">
-										<div style="position: absolute; margin-top:-60px;" id="ims-dbfund"></div>
-										<div class="pure-u-1">
-											<div class="pure-u-1 pure-u-md-6-24">
-												<img src="wp-content/course-badges/badge_ims_db_fundamentals.png" alt="IMS Database Fundamentals badge" style="width: 100%;height:100%;max-height: 300px;padding-bottom: 1px;">
-											</div>
-											<div class="pure-u-1 pure-u-md-18-24" style="padding:35px;margin-right: -10px;">
-												<h3 style="color: black;">IMS Database Fundamentals</h3>
-												<p>
-													Learn about IMS databases, including the 
-													structure of database records, how those records are accessed, DBDs, PSBs, DL/I calls, 
-													secondary indexes, logical relationships, database types, 
-													access methods, database recovery, and more.</p>	
-													<div class="pure-u-1 pure-u-md-1">
-														<div style=" margin-top:15px;">
-															<p>
-																<b>Level</b>: Beginner
-																&ensp;
-																<b>Cost</b>: None
-																&ensp;
-																<b>Badge</b>: Yes
-																&ensp;
-																<b>Time</b>: 24 hours
-															</p>
-														</div>
-														<div style="margin-top:15px;" >
-														<a aria-label="Learn more about IMS DB Fundamentals"
-														title="IMS DB Fundamentals" target="_blank" rel="noopener noreferrer" 
-														href="https://learn.ibm.com/course/view.php?id=10118" 
-														style="position: relative;bottom:0;margin-bottom:30px;text-align: left;">Learn more →</a>
-														</div>
-												</div>
-						
-											</div>
-										</div>
-									</div>
-
-									<!-- card -->
-									<div class="ims-course-card">
-										<div style="position: absolute; margin-top:-60px;" id="ims-dbrc"></div>
-										<div class="pure-u-1">
-											<div class="pure-u-1 pure-u-md-6-24">
-												<img src="wp-content/course-badges/badge_dbrc.png" alt="DBRC badge" style="width: 100%;height:100%;max-height: 300px;padding-bottom: 1px;">
-											</div>
-											<div class="pure-u-md-18-24" style="padding:35px;margin-right: -10px;">
-												<h3 style="color: black;">IMS Database Recovery Control (DBRC)</h3>
-												<p>IMS DBRC, which is a feature of the IMS Database Manager, helps with the recovery of IMS databases.</p>	
-												<p>In this comprehensive course, you'll learn how to install, customize, administer, and maintain DBRC. 
-													This course is for experienced IMS system programmers and database administrators who need to work with DBRC.
-												</p>
-												<div class="pure-u-1 pure-u-md-1">
-													<div style="margin-top:15px;" >
-														<p>
-															<b>Level</b>: Intermediate
-															&ensp;
-															<b>Cost</b>: None
-															&ensp;
-															<b>Badge</b>: Yes
-															&ensp;
-															<b>Time</b>: 32 hours
-														</p>
-													</div>
-													<div style="margin-top:15px;" >
-													<a aria-label="Learn more about IMS DBRC"
-													title="IMS DBRC" target="_blank" rel="noopener noreferrer" 
-													href="https://learn.ibm.com/course/view.php?id=12150" 
-													style="position: relative;bottom:0;margin-bottom:30px;text-align: left;">Learn more →</a>
-													</div>
-											</div>
-
-											</div>
-										</div>
-									</div>
-
-									<!-- card -->
-									<div class="ims-course-card" style="margin-top: 3.5em;">
-										<div style="position: absolute; margin-top:-60px;" id="ims-datashare"></div>
-										<div class="pure-u-1">
-											<div class="pure-u-1 pure-u-md-6-24">
-												<img src="wp-content/course-badges/badge_ims_data_sharing.png" alt="IMS Data Sharing badge" style="width: 100%;height:100%;max-height: 300px;padding-bottom: 1px;">
-											</div>
-											<div class="pure-u-1 pure-u-md-18-24" style="padding:35px;margin-right: -10px;">
-												<h3 style="color: black;">IMS Data Sharing</h3>
-												<p>When more than one IMS system has concurrent access to an IMS database, those systems are sharing data. 
-													In this advanced course, you'll learn about IMS data sharing capabilities, how multiple 
-													IMS systems on different LPARs and processors can access and update the same databases 
-													with complete integrity, and how to implement and maintain a data sharing environment.</p>	
-													<div class="pure-u-1 pure-u-md-1">
-														<div style=" margin-top:15px;">
-															<p>
-																<b>Level</b>: Advanced
-																&ensp;
-																<b>Cost</b>: None
-																&ensp;
-																<b>Badge</b>: Yes
-																&ensp;
-																<b>Time</b>: 12 hours
-															</p>
-														</div>
-														<div style="margin-top:15px;" >
-														<a aria-label="Learn more about IMS Data Sharing"
-														title="IMS Data Sharing" target="_blank" rel="noopener noreferrer" 
-														href="https://learn.ibm.com/course/view.php?id=11499" 
-														style="position: relative;bottom:0;margin-bottom:30px;text-align: left;">Learn more →</a>
-														</div>
-												</div>
-
-											</div>
-										</div>
-									</div>
-
-									<!-- card -->
-									<div class="ims-course-card" style="margin-top: 3.5em;">
-										<div style="position: absolute; margin-top:-60px;" id="ims-haldb"></div>
-										<div class="pure-u-1">
-											<div class="pure-u-1 pure-u-md-6-24">
-												<img src="wp-content/course-badges/badge_haldb.png" alt="HALDB badge" style="width: 100%;height:100%;max-height: 300px;padding-bottom: 1px;">
-											</div>
-											<div class="pure-u-md-18-24" style="padding:35px;margin-right: -10px;">
-												<h3 style="color: black;">IMS HALDB</h3>
-												<p>In this intermediate course, you’ll learn how to design, implement, 
-													maintain, troubleshoot, and recover IMS High Availability Large Databases (HALDBs). 
-													You’ll learn how other IMS databases can be migrated to HALDB and the advantages of using HALDBs.</p>	
-													<p>This is an intermediate course for experienced IMS database administrators who implement and manage HALDBs.</p>
-													<div class="pure-u-1 pure-u-md-1">
-														<div style="margin-top:15px;" >
-															<p>
-																<b>Level</b>: Intermediate
-																&ensp;
-																<b>Cost</b>: None
-																&ensp;
-																<b>Badge</b>: Yes
-																&ensp;
-																<b>Time</b>: 10 hours
-															</p>
-														</div>
-														<div style="margin-top:15px;" >
-														<a aria-label="Learn more about IMS HALDB"
-														title="IMS HALDB" target="_blank" rel="noopener noreferrer" 
-														href="https://learn.ibm.com/course/view.php?id=12157" 
-														style="position: relative;bottom:0;margin-bottom:30px;text-align: left;">Learn more →</a>
-														</div>
-												</div>
-
-											</div>
-										</div>
-									</div>
-
-									<!-- card -->
-									<div class="ims-course-card" style="margin-top: 3.5em;">
-										<div style="position: absolute; margin-top:-60px;" id="ims-fpimpl"></div>
-										<div class="pure-u-1">
-											<div class="pure-u-1 pure-u-md-6-24">
-												<img src="wp-content/course-badges/bacge_fp_implementation.png" alt="Fast Path Implementation badge" style="width: 100%;height:100%;max-height: 300px;padding-bottom: 1px;">
-											</div>
-											<div class="pure-u-1 pure-u-md-18-24" style="padding:35px;margin-right: -10px;">
-												<h3 style="color: black;">IMS Fast Path Implementation</h3>
-												<p>This is an advanced course for IBM IMS system administrators, database administrators, 
-													and application programmers who design or implement IMS Fast Path applications in an 
-													IMS Transaction Management (TM) or IBM CICS Database Control (DBCTL) environment. 
-													</p>		
-													<div class="pure-u-1 pure-u-md-1">
-														<div style=" margin-top:15px;">
-															<p>
-																<b>Level</b>: Advanced
-																&ensp;
-																<b>Cost</b>: None
-																&ensp;
-																<b>Badge</b>: Yes
-																&ensp;
-																<b>Time</b>: 18 hours
-															</p>
-														</div>
-														<div style="margin-top:15px;" >
-														<a aria-label="Learn more about IMS Fast Path Implementation"
-														title="IMS Fast Path Implementation" target="_blank" rel="noopener noreferrer" 
-														href="https://learn.ibm.com/course/view.php?id=9907" 
-														style="position: relative;bottom:0;margin-bottom:30px;">Learn more →</a>
-														</div>
-												</div>
-							
-											</div>
-										</div>
-									</div>
-
-									<!-- card -->
-									<div class="ims-course-card">
-										<div style="position: absolute; margin-top:-60px;" id="ims-db-repair"></div>
-										<div class="pure-u-1">
-											<div class="pure-u-1 pure-u-md-6-24">
-												<img src="wp-content/course-badges/badge_db_repair.png" alt="Database Repair badge" style="width: 100%;height:100%;max-height: 300px;padding-bottom: 1px;">
-											</div>
-											<div class="pure-u-md-18-24" style="padding:35px;margin-right: -10px;">
-												<h3 style="color: black;">IMS Database Repair</h3>
-												<p>This advanced course shows you techniques and tools for diagnosing 
-													and repairing corrupted IMS databases, including full-function, 
-													DEDB, and HALDB. To do that, you’ll need to understand 
-													database access methods, secondary indexes, database layouts, 
-													control interval (CI) layouts, sequential dependents (SDEPs), 
-													and other database components, features, and structures.</p>	
-													<div class="pure-u-1 pure-u-md-1">
-														<div style="margin-top:15px;" >
-															<p>
-																<b>Level</b>: Advanced
-																&ensp;
-																<b>Cost</b>: None
-																&ensp;
-																<b>Badge</b>: Yes
-																&ensp;
-																<b>Time</b>: 11 hours
-															</p>
-														</div>
-														<div style="margin-top:15px;" >
-														<a aria-label="Learn more about IMS Database Repair"
-														title="IMS Database Repair" target="_blank" rel="noopener noreferrer" 
-														href="https://www.ibm.com/training/course/ims-database-repair-DL00963G" 
-														style="position: relative;bottom:0;margin-bottom:30px;text-align: left;">Learn more →</a>
-														</div>
-													</div>
-
-											</div>
-										</div>
-									</div>		
-
-									<!-- card -->
-									<div class="ims-course-card">
-										<div style="position: absolute; margin-top:-60px;" id="ims-db-tune"></div>
-										<div class="pure-u-1">
-											<div class="pure-u-1 pure-u-md-6-24">
-												<img src="wp-content/course-badges/badge_perf_tuning.png" alt="Database Performance and Tuning badge" style="width: 100%;height:100%;max-height: 300px;padding-bottom: 1px;">
-											</div>
-											<div class="pure-u-md-18-24" style="padding:35px;margin-right: -10px;">
-												<h3 style="color: black;">IMS Database Performance and Tuning</h3>
-												<p>This course shows you how to tune IBM® IMS™ databases. 
-													It also discusses IMS database options that affect performance such as data set considerations 
-													and buffering for Virtual Storage Access Method (VSAM) and Overflow Sequential Access Method 
-													(OSAM) databases.</p>	
-											
-													<div class="pure-u-1 pure-u-md-1">
-														<div style="margin-top:15px;" >
-															<p>
-																<b>Level</b>: Advanced
-																&ensp;
-																<b>Cost</b>: None
-																&ensp;
-																<b>Badge</b>: Yes
-																&ensp;
-																<b>Time</b>: 36 hours
-															</p>
-														</div>
-														<div style="margin-top:15px;" >
-														<a  aria-label="Learn more about IMS Database Performance and Tuning" 
-														title="IMS Database Performance and Tuning" target="_blank" rel="noopener noreferrer" 
-														href="https://learn.ibm.com/course/view.php?id=12404" 
-														style="position: relative;bottom:0;margin-bottom:30px;text-align: left;">Learn more →</a>
-														</div>	</div>
-								
-											</div>
-										</div>
-									</div>
-
-									<!-- card -->
-									<div class="ims-course-card">
-										<div style="position: absolute; margin-top:-60px;" id="ims-phys-db"></div>
-										<div class="pure-u-1">
-											<div class="pure-u-1 pure-u-md-6-24">
-												<img src="wp-content/course-badges/badge_physical_org_db.png" alt="Physical Organization of Databases badge" style="width: 100%;height:100%;max-height: 300px;padding-bottom: 1px;">
-											</div>
-											<div class="pure-u-md-18-24" style="padding:35px;margin-right: -10px;">
-												<h3 style="color: black;">IMS Physical Organization of Databases</h3>
-												<p>In this comprehensive course, you’ll learn about IMS DB access methods, 
-													how to code DBDs and PSBs, use IMS utilities to reorganize and recover 
-													databases,  use the DL/I test program, and how to prepare a job stream 
-													to load a database.</p>	
-													<div class="pure-u-1 pure-u-md-1">
-														<div style="margin-top:15px;" >
-															<p>
-																<b>Level</b>: Intermediate
-																&ensp;
-																<b>Cost</b>: None
-																&ensp;
-																<b>Badge</b>: Yes
-																&ensp;
-																<b>Time</b>: 33 hours
-															</p>
-														</div>
-														<div style="margin-top:15px;" >
-														<a  aria-label="Learn more about IMS Physical Organization of Databases" 
-														title="IMS Physical Organization of Databases" target="_blank" rel="noopener noreferrer" 
-														href="https://www.ibm.com/training/course/ims-physical-organization-of-databases-DL00965G" 
-														style="position: relative;bottom:0;margin-bottom:30px;text-align: left;">Learn more →</a>
-														</div>
-													</div>
-
-											</div>
-										</div>
-									</div>	
-
-									<!-- SYS header -->
-									<h2 id="sysprog" style="color: black;margin-left: 16px;">System programming</h2>
-
-									<!-- card-->
-									<div class="ims-course-card" style="margin-top: 3.5em;">
-										<div style="position: absolute; margin-top:-60px;" id="ims-dmtm"></div>
-										<div class="pure-u-1">
-											<div class="pure-u-1 pure-u-md-6-24">
-												<img src="wp-content/course-badges/badge_db_tm_sysprog.png" alt="System Programming badge" style="width: 100%;height:100%;max-height: 300px;padding-bottom: 1px;">
-											</div>
-											<div class="pure-u-1 pure-u-md-18-24" style="padding:35px;margin-right: -10px;">
-												<h3 style="color: black;">IMS System Programming</h3>
-												<p>Learn about IMS architecture, installation, transaction management, locking, logging, connecting IMS to IBM CICS® and IBM Db2®,  
-													data sharing, shared queues, preparing and starting the system, and more.</p>	
-													<div class="pure-u-1 pure-u-md-1">
-														<div style=" margin-top:15px;">
-															<p>
-																<b>Level</b>: Intermediate
-																&ensp;
-																<b>Cost</b>: None
-																&ensp;
-																<b>Badge</b>: Yes
-																&ensp;
-																<b>Time</b>: 13 hours
-															</p>
-														</div>
-														<div style="margin-top:15px;" >
-														<a aria-label="Learn more about IMS System Programming"
-														title="IMS System Programming" target="_blank" rel="noopener noreferrer" 
-														href="https://learn.ibm.com/course/view.php?id=10973" 
-														style="position: relative;bottom:0;margin-bottom:30px;text-align: left;">Learn more →</a>
-														</div>
-												</div>
-							
-											</div>
-										</div>
-									</div>
-
-									<!-- card -->
-									<div class="ims-course-card" style="margin-top: 3.5em;">
-										<div style="position: absolute; margin-top:-60px;" id="ims-diagnostics"></div>
-										<div class="pure-u-1">
-											<div class="pure-u-1 pure-u-md-6-24">
-												<img src="wp-content/course-badges/badge_ims_diagnostics.png" alt="IMS Diagnostics badge" style="width: 100%;height:100%;max-height: 300px;padding-bottom: 1px;">
-											</div>
-											<div class="pure-u-1 pure-u-md-18-24" style="padding:35px;margin-right: -10px;">
-												<h3 style="color: black;">IMS Diagnostics</h3>
-												<p>Learn about the relationships between IMS components so that you can explain IBM's recommendations for IMS
-													diagnostic setup. Learn how to use the IMS Interactive Dump Formatter, identify the key z/OS® IPCS commands
-														that are useful for IMS problem diagnostics, perform the methodology for debugging IMS abends, and understand the
-														methodology for debugging IMS waits and loops.</p>
-														<div class="pure-u-1 pure-u-md-1">
-															<div style=" margin-top:15px;">
-																<p>
-																	<b>Level</b>: Intermediate
-																	&ensp;
-																	<b>Cost</b>: None
-																	&ensp;
-																	<b>Badge</b>: Yes
-																	&ensp;
-																	<b>Time</b>: 10 hours
-																</p>
-															</div>
-															<div style="margin-top:15px;" >
-															<a aria-label="Learn more about IMS Diagnostics"
-															title="IMS Diagnostics" target="_blank" rel="noopener noreferrer" 
-															href="https://learn.ibm.com/course/view.php?id=7405" 
-															style="position: relative;bottom:0;margin-bottom:30px;">Learn more →</a>
-															</div>
-													</div>
-
-											</div>
-										</div>
-									</div>
-
-									<!-- card -->
-									<div class="ims-course-card" style="margin-top: 3.5em;">
-										<div style="position: absolute; margin-top:-60px;" id="ims-squeues"></div>
-										<div class="pure-u-1">
-											<div class="pure-u-1 pure-u-md-6-24">
-												<img src="wp-content/course-badges/badge_ims_shared_queues.png" alt="Shared Queues badge" style="width: 100%;height:100%;max-height: 300px;padding-bottom: 1px;">
-											</div>
-											<div class="pure-u-1 pure-u-md-18-24" style="padding:35px;margin-right: -10px;">
-												<h3 style="color: black;">IMS Shared Queues</h3>
-												<p>Learn how shared message queues work in IBM IMS, and how full-function queues and Fast Path expedited message handler (EMH) queues 
-													are shared within a parallel sysplex environment. Learn how to prepare and implement IMS shared queues 
-													and manage and troubleshoot an IMS shared queues environment.</p>		
-													<div class="pure-u-1 pure-u-md-1">
-														<div style=" margin-top:15px;">
-															<p>
-																<b>Level</b>: Intermediate
-																&ensp;
-																<b>Cost</b>: None
-																&ensp;
-																<b>Badge</b>: Yes
-																&ensp;
-																<b>Time</b>: 17 hours
-															</p>
-														</div>
-														<div style="margin-top:15px;" >
-														<a aria-label="Learn more about IMS Shared Queues"
-														title="IMS Shared Queues" target="_blank" rel="noopener noreferrer" 
-														href="https://learn.ibm.com/course/view.php?id=9359" 
-														style="position: relative;bottom:0;margin-bottom:30px;">Learn more →</a>
-														</div>
-												</div>
-
-											</div>
-										</div>
-									</div>
-
-									<!-- card -->
-									<div class="ims-course-card">
-										<div style="position: absolute; margin-top:-60px;" id="ims-tm-performance"></div>
-										<div class="pure-u-1">
-											<div class="pure-u-1 pure-u-md-6-24">
-												<img src="wp-content/course-badges/badge_ims_tm_tuning.png" alt="TM Performance Analysis badge" style="width: 100%;height:100%;max-height: 300px;padding-bottom: 1px;">
-											</div>
-											<div class="pure-u-md-18-24" style="padding:35px;margin-right: -10px;">
-												<h3 style="color: black;">IMS TM Performance Analysis</h3>
-												<p>In this advanced course, you'll learn how to use and adjust IMS 
-													Transaction Manager (IMS TM), other components in the IMS system, and z/OS 
-													components, commands, processes, parameters, and more to ensure that the 
-													IMS TM system is running as efficiently as possible.</p>	
-														<div class="pure-u-1 pure-u-md-1">
-															<div style="margin-top:15px;" >
-															<p>
-																<b>Level</b>: Advanced
-																&ensp;
-																<b>Cost</b>: None
-																&ensp;
-																<b>Badge</b>: Yes
-																&ensp;
-																<b>Time</b>: 11 hours
-															</p>
-														</div>
-															<div style="margin-top:15px;" >
-														<a aria-label="Learn more about IMS TM Performance Analysis"
-														title="IMS TM Performance Analysis" target="_blank" rel="noopener noreferrer" 
-														href="https://www.ibm.com/training/course/ims-transaction-manager-performance-analysis-DL00962G" 
-														style="position: relative;bottom:0;margin-bottom:30px;text-align: left;">Learn more →</a>
-														</div>
-													</div>
-
-											</div>
-										</div>
-									</div>		
-
-									<!-- card -->
-									<div class="ims-course-card" style="margin-top: 3.5em;">
-										<div style="position: absolute; margin-top:-60px;" id="ims-dbctl"></div>
-										<div class="pure-u-1">
-											<div class="pure-u-1 pure-u-md-6-24">
-												<img src="wp-content/course-badges/badge_ims_dbctl.png" alt="DBCTL System Programming badge" style="width: 100%;height:100%;max-height: 300px;padding-bottom: 1px;">
-											</div>
-											<div class="pure-u-1 pure-u-md-18-24" style="padding:35px;margin-right: -10px;">
-												<h3 style="color: black;">IMS System Programming in a DBCTL Environment</h3>
-												<p>Learn about the IMS database control (DBCTL) environment, which provides access between CICS and
-													IMS-managed databases. Learn  how to install, configure, maintain, troubleshoot, and support
-													an IMS DBCTL system, and understand the IMS architecture that applies to database management and attaching 
-													to CICS systems and transactions.</p>		
-													<div class="pure-u-1 pure-u-md-1">
-														<div style=" margin-top:15px;">
-															<p>
-																<b>Level</b>: Intermediate
-																&ensp;
-																<b>Cost</b>: None
-																&ensp;
-																<b>Badge</b>: Yes
-																&ensp;
-																<b>Time</b>: 12 hours
-															</p>
-														</div>
-														<div style="margin-top:15px;" >
-														<a aria-label="Learn more about IMS System Programming in DBCTL Environment"
-														title="IMS System Programming in DBCTL Environment" target="_blank" rel="noopener noreferrer" 
-														href="https://learn.ibm.com/course/view.php?id=8352" 
-														style="position: relative;bottom:0;margin-bottom:30px;">Learn more →</a>
-														</div>
-													</div>
-
-											</div>
-										</div>
-									</div>
-
-									<!-- APPDEV header -->
-									<h2 id="appdev" style="color: black;margin-left: 16px;">Application development</h2>
-
-									<!-- card -->
-									<div class="ims-course-card">
-										<div style="position: absolute; margin-top:-60px;" id="ims-tm-prog"></div>
-										<div class="pure-u-1">
-											<div class="pure-u-1 pure-u-md-6-24">
-												<img src="wp-content/course-badges/badge_tm_app_prog.png" alt="TM Application Programming badge" style="width: 100%;height:100%;max-height: 300px;padding-bottom: 1px;">
-											</div>
-											<div class="pure-u-md-18-24" style="padding:35px;margin-right: -10px;">
-												<h3 style="color: black;">IMS TM Application Programming</h3>
-												<p>This course shows you through lectures and lab demos how to write
-													application programs that use Data Language One (DL/I) to process
-													terminal input and output messages in an IMS Transaction manager system.</p>	
-													<p>This course does not teach basic COBOL or PL/I. You
-														should already have experience developing applications with one or both of those languages.</p>
-														<div class="pure-u-1 pure-u-md-1">
-															<div style="margin-top:15px;" >
-																<p>
-																	<b>Level</b>: Intermediate
-																	&ensp;
-																	<b>Cost</b>: None
-																	&ensp;
-																	<b>Badge</b>: Yes
-																	&ensp;
-																	<b>Time</b>: 14 hours
-																</p>
-															</div>
-															<div style="margin-top:15px;" >
-															<a aria-label="Learn more about IMS TM Application Programming" 
-															title="IMS TM Application Programming" target="_blank" rel="noopener noreferrer" 
-															href="https://learn.ibm.com/course/view.php?id=13017" 
-															style="position: relative;bottom:0;margin-bottom:30px;text-align: left;">Learn more →</a>
-															</div>
-														</div>
-
-											</div>
-										</div>
-									</div>
-
-									<!-- card -->
-									<div class="ims-course-card">
-										<div style="position: absolute; margin-top:-60px;" id="ims-db-prog"></div>
-										<div class="pure-u-1">
-											<div class="pure-u-1 pure-u-md-6-24">
-												<img src="wp-content/course-badges/badge_db_app_prog.png" alt="Database Application Programming badge" style="width: 100%;height:100%;max-height: 300px;padding-bottom: 1px;">
-											</div>
-											<div class="pure-u-md-18-24" style="padding:35px;margin-right: -10px;">
-												<h3 style="color: black;">IMS Database Application Programming</h3>
-												<p>In this course, you'll learn how to code application programs that perform processing
-													on IMS database records. You'll learn about the hierarchic structure of IMS databases,
-													how to construct DL/I calls, how to test your applications, and more.</p>	
-													<div class="pure-u-1 pure-u-md-1">
-														<div style="margin-top:15px;" >
-															<p>
-																<b>Level</b>: Intermediate
-																&ensp;
-																<b>Cost</b>: None
-																&ensp;
-																<b>Badge</b>: Yes
-																&ensp;
-																<b>Time</b>: 20 hours
-															</p>
-														</div>
-														<div style="margin-top:15px;" >
-														<a aria-label="Learn more about IMS Database Application Programming"
-														title="IMS Database Application Programming" target="_blank" rel="noopener noreferrer" 
-														href="https://learn.ibm.com/course/view.php?id=12691" 
-														style="position: relative;bottom:0;margin-bottom:30px;text-align: left;">Learn more →</a>
-														</div>
-													</div>
+			<!-- =========================== Row for filtering =========================== -->
+			<div class="zs-section ed-filter">
+				<div class="pure-g">
+					<!-- Filter list -->
+					<div class="ibm-sitenav-menu-list ed-filter-list">
+						<ul class="menu">
+							<li><a href="#all">All roles</a></li>
+							<li><a href="#imsdb">IMS database</a></li>
+							<li><a href="#sysprog">System programming</a></li>
+							<li><a href="#appdev">Application development</a></li>
+							<li><a href="#faq">FAQs</a></li>
+							<li><a href="#support">Support</a></li>
+						</ul>
+					</div>
+				</div>
+			</div>
 
-											</div>
-										</div>
-									</div>
+			<!-- =========================== Courses - all roles =========================== -->
+			<section id="all" class="white-bg card-section">
+				<div class="card-section-header"><h2>All roles</h2></div>
+					<!-- IMS Fundamentals, with live course -->
+					<!-- <course-card
+						name="IMS Fundamentals"
+						desc="Learn about the main components of IBM IMS: IMS Database Manager 
+							(IMS DB), IMS Transaction Manager (IMS TM), and common system services 
+							for IMS DB and IMS TM. Learn how these components work and interact with 
+							applications, how IMS databases differ from each other and differ from 
+							relational databases message types, security, maintenance, troubleshooting, 
+							and more."
+						imgsrc="wp-content/course-badges/badge_ims_fundamentals.png"
+						level="Beginner"
+						cost="None"
+						badge="Yes"
+						time="32 hours"
+						link="https://learn.ibm.com/course/view.php?id=8829"
+						livelevel="Beginner"
+						livecost="$"
+						livebadge="No"
+						livetime="30 hours"
+						livelink="https://learn.ibm.com/course/view.php?id=8829"
+					>
+					</course-card> -->
+
+					<!-- IMS Fundamentals, no live course -->
+					<course-card
+						id="ims-fundamentals"
+						name="IMS Fundamentals"
+						desc="Learn about the main components of IBM IMS: IMS Database Manager (IMS DB), 
+							IMS Transaction Manager (IMS TM), and common system services for IMS DB and 
+							IMS TM. Learn how these components work and interact with applications, how 
+							IMS databases differ from each other and differ from relational databases 
+							message types, security, maintenance, troubleshooting, and more."
+						imgsrc="wp-content/course-badges/badge_ims_fundamentals.png"
+						level="Beginner"
+						cost="None"
+						badge="Yes"
+						time="32 hours"
+						link="https://learn.ibm.com/course/view.php?id=8829"
+					>
+					</course-card>
+
+					<!-- PL/I Programming -->
+					<course-card
+						id="ims-intro-pli"
+						name="Introduction to the PL/I Programming Language"
+						desc="In this 8-hour, introductory course, you’ll learn about the parallels and differences 
+							between C and PL/I, particularly in language syntax, program structure, declarations, 
+							loops, data types, arrays, structures, and more."
+						imgsrc="wp-content/course-badges/badge_intro_pli.png"
+						level="Beginner"
+						cost="None"
+						badge="Yes"
+						time="8 hours"
+						link="https://www.ibm.com/training/course/introduction-to-the-pli-programming-language-DL00964G"
+					>
+					</course-card>	
+			</section>
 
-								</div>
-							</section>
-						</div>	
+			<!-- =========================== Courses - IMS database =========================== -->
+			<section id="imsdb" class="white-bg card-section">
+				<div class="card-section-header"><h2>IMS database</h2></div>
+					<!-- Logical Relationships -->
+					<course-card
+						name="IMS Logical Relationships"
+						desc="Logical relationships establish a logical access paths between segments that 
+							are usually in different databases. In this course, you’ll learn how to code 
+							the DBDs and PSBs for IMS databases involved in logical relationships, adjust 
+							the performance of these databases, and review IMS Monitor reports to see whether 
+							the logical relationships are effective."
+						imgsrc="wp-content/course-badges/badge_log_rel.png"
+						level="Advanced"
+						cost="None"
+						badge="Yes"
+						time="30 hours"
+						link="https://www.ibm.com/training/course/ims-logical-relationships-DL00966G"
+						class="pure-u-1"
+					>
+					</course-card>	
+
+					<!-- Database Fundamentals -->
+					<course-card
+						id="ims-dbfund"
+						name="IMS Database Fundamentals"
+						desc="Learn about IMS databases, including the structure of database records, 
+							how those records are accessed, DBDs, PSBs, DL/I calls, 
+							secondary indexes, logical relationships, database types, 
+							access methods, database recovery, and more."
+						imgsrc="wp-content/course-badges/badge_ims_db_fundamentals.png"
+						level="Beginner"
+						cost="None"
+						badge="Yes"
+						time="24 hours"
+						link="https://learn.ibm.com/course/view.php?id=10118"
+						class="pure-u-1"
+					>
+					</course-card>	
+
+					<!-- DBRC -->
+					<course-card
+						id="ims-dbrc"
+						name="IMS Database Recovery Control (DBRC)"
+						desc="IMS DBRC, which is a feature of the IMS Database Manager, helps with the recovery of IMS databases.
+							In this comprehensive course, you'll learn how to install, customize, administer, and maintain DBRC. 
+							This course is for experienced IMS system programmers and database administrators who need to work with 
+							DBRC."
+						imgsrc="wp-content/course-badges/badge_dbrc.png"
+						level="Intermediate"
+						cost="None"
+						badge="Yes"
+						time="32 hours"
+						link="https://learn.ibm.com/course/view.php?id=12150"
+						class="pure-u-1"
+					>
+					</course-card>	
+
+					<!-- Data Sharing -->
+					<course-card
+						id="ims-datashare"
+						name="IMS Data Sharing"
+						desc="When more than one IMS system has concurrent access to an IMS database, those systems are sharing data. 
+							In this advanced course, you'll learn about IMS data sharing capabilities, how multiple 
+							IMS systems on different LPARs and processors can access and update the same databases 
+							with complete integrity, and how to implement and maintain a data sharing environment."
+						imgsrc="wp-content/course-badges/badge_ims_data_sharing.png"
+						level="Advanced"
+						cost="None"
+						badge="Yes"
+						time="12 hours"
+						link="https://learn.ibm.com/course/view.php?id=11499"
+						class="pure-u-1"
+					>
+					</course-card>	
+
+					<!-- HALDB -->
+					<course-card
+						id="ims-haldb"
+						name="IMS HALDB"
+						desc="In this intermediate course, you’ll learn how to design, implement, 
+							maintain, troubleshoot, and recover IMS High Availability Large Databases (HALDBs). 
+							You’ll learn how other IMS databases can be migrated to HALDB and the advantages of using HALDBs.
+							This is an intermediate course for experienced IMS database administrators who implement and manage HALDBs."
+						imgsrc="wp-content/course-badges/badge_haldb.png"
+						level="Intermediate"
+						cost="None"
+						badge="Yes"
+						time="10 hours"
+						link="https://learn.ibm.com/course/view.php?id=12157"
+						class="pure-u-1"
+					>
+					</course-card>
+
+					<!-- Fast Path -->
+					<course-card
+						id="ims-fpimpl"
+						name="IMS Fast Path Implementation"
+						desc="This is an advanced course for IBM IMS system administrators, database administrators, 
+							and application programmers who design or implement IMS Fast Path applications in an 
+							IMS Transaction Management (TM) or IBM CICS Database Control (DBCTL) environment."
+						imgsrc="wp-content/course-badges/bacge_fp_implementation.png"
+						level="Advanced"
+						cost="None"
+						badge="Yes"
+						time="18 hours"
+						link="https://learn.ibm.com/course/view.php?id=9907"
+						class="pure-u-1"
+					>
+					</course-card>
+
+					<!-- Database Repair -->
+					<course-card
+						id="ims-db-repair"
+						name="IMS Database Repair"
+						desc="This advanced course shows you techniques and tools for diagnosing 
+							and repairing corrupted IMS databases, including full-function, 
+							DEDB, and HALDB. To do that, you’ll need to understand 
+							database access methods, secondary indexes, database layouts, 
+							control interval (CI) layouts, sequential dependents (SDEPs), 
+							and other database components, features, and structures."
+						imgsrc="wp-content/course-badges/badge_db_repair.png"
+						level="Advanced"
+						cost="None"
+						badge="Yes"
+						time="11 hours"
+						link="https://www.ibm.com/training/course/ims-database-repair-DL00963G"
+						class="pure-u-1"
+					>
+					</course-card>	
+
+					<!-- Database Performance and Tuning -->
+					<course-card
+						id="ims-db-tune"
+						name="IMS Database Performance and Tuning"
+						desc="This course shows you how to tune IBM® IMS™ databases. 
+							It also discusses IMS database options that affect performance such as data set considerations 
+							and buffering for Virtual Storage Access Method (VSAM) and Overflow Sequential Access Method 
+							(OSAM) databases"
+						imgsrc="wp-content/course-badges/badge_perf_tuning.png"
+						level="Advanced"
+						cost="None"
+						badge="Yes"
+						time="36 hours"
+						link="https://learn.ibm.com/course/view.php?id=12404"
+						class="pure-u-1"
+					>
+					</course-card>	
+
+					<!-- Physical Organization of Databases -->
+					<course-card
+						id="ims-phys-db"
+						name="IMS Physical Organization of Databases"
+						desc="In this comprehensive course, you’ll learn about IMS DB access methods, 
+							how to code DBDs and PSBs, use IMS utilities to reorganize and recover 
+							databases,  use the DL/I test program, and how to prepare a job stream 
+							to load a database."
+						imgsrc="wp-content/course-badges/badge_physical_org_db.png"
+						level="Intermediate"
+						cost="None"
+						badge="Yes"
+						time="33 hours"
+						link="https://www.ibm.com/training/course/ims-physical-organization-of-databases-DL00965G"
+						class="pure-u-1"
+					>
+					</course-card>	
+			</section>
 
-						<!-- =========================== FAQ =========================== -->
-						<div class="zs-gray-section">
-							<section id="faq-section"class="zs-section pure-g">
-								<!-- Header -->
-								<div class="pure-u-1 pure-u-md-5-24 faq-title">
-									<h2 id="faq">Frequently asked questions</h2>
-								</div>
-								<!-- Contents -->
-								<div class="pure-u-sm-1 pure-u-md-18-24">
+			<!-- =========================== Courses - System programming =========================== -->
+			<section id="sysprog" class="white-bg card-section">
+				<div class="card-section-header"><h2>System programming</h2></div>
+					<!-- System Programming -->
+					<course-card
+						id="ims-dmtm"
+						name="IMS System Programming"
+						desc="Learn about IMS architecture, installation, transaction management, locking, 
+							logging, connecting IMS to IBM CICS® and IBM Db2®, data sharing, shared queues, 
+							preparing and starting the system, and more."
+						imgsrc="wp-content/course-badges/badge_db_tm_sysprog.png"
+						level="Intermediate"
+						cost="None"
+						badge="Yes"
+						time="13 hours"
+						link="https://learn.ibm.com/course/view.php?id=10973"
+						class="pure-u-1"
+					>
+					</course-card>	
+
+					<!-- Diagnostics -->
+					<course-card
+						id="ims-diagnostics"
+						name="IMS Diagnostics"
+						desc="Learn about the relationships between IMS components so that you can explain IBM's recommendations for IMS
+							diagnostic setup. Learn how to use the IMS Interactive Dump Formatter, identify the key z/OS® IPCS commands
+							that are useful for IMS problem diagnostics, perform the methodology for debugging IMS abends, and understand the
+							methodology for debugging IMS waits and loops."
+						imgsrc="wp-content/course-badges/badge_ims_diagnostics.png"
+						level="Intermediate"
+						cost="None"
+						badge="Yes"
+						time="10 hours"
+						link="https://learn.ibm.com/course/view.php?id=7405"
+						class="pure-u-1"
+					>
+					</course-card>		
+					
+					<!-- Shared Queues -->
+					<course-card
+						id="ims-squeues"
+						name="IMS Shared Queues"
+						desc="Learn how shared message queues work in IBM IMS, and how full-function queues and Fast Path expedited message handler (EMH) queues 
+							are shared within a parallel sysplex environment. Learn how to prepare and implement IMS shared queues 
+							and manage and troubleshoot an IMS shared queues environment."
+						imgsrc="wp-content/course-badges/badge_ims_shared_queues.png"
+						level="Intermediate"
+						cost="None"
+						badge="Yes"
+						time="17 hours"
+						link="https://learn.ibm.com/course/view.php?id=9359"
+						class="pure-u-1"
+					>
+					</course-card>		
+					
+					<!-- TM Performance Analysis -->
+					<course-card
+						id="ims-tm-performance"
+						name="IMS TM Performance Analysis"
+						desc="In this advanced course, you'll learn how to use and adjust IMS 
+							Transaction Manager (IMS TM), other components in the IMS system, and z/OS 
+							components, commands, processes, parameters, and more to ensure that the 
+							IMS TM system is running as efficiently as possible."
+						imgsrc="wp-content/course-badges/badge_ims_tm_tuning.png"
+						level="Advanced"
+						cost="None"
+						badge="Yes"
+						time="11 hours"
+						link="https://www.ibm.com/training/course/ims-transaction-manager-performance-analysis-DL00962G"
+						class="pure-u-1"
+					>
+					</course-card>	
+
+					<!-- System Programming in a DBCTL Environment -->
+					<course-card
+						id="ims-dbctl"
+						name="IMS System Programming in a DBCTL Environment"
+						desc="Learn about the IMS database control (DBCTL) environment, which provides access between CICS and
+							IMS-managed databases. Learn  how to install, configure, maintain, troubleshoot, and support
+							an IMS DBCTL system, and understand the IMS architecture that applies to database management and attaching 
+							to CICS systems and transactions."
+						imgsrc="wp-content/course-badges/badge_ims_dbctl.png"
+						level="Intermediate"
+						cost="None"
+						badge="Yes"
+						time="12 hours"
+						link="https://learn.ibm.com/course/view.php?id=8352"
+						class="pure-u-1"
+					>
+					</course-card>
+			</section>
 
-									<div class="pure-u-1" style="margin-bottom:25px;">
-										<p>Have questions about IMS courses, or the badge program? Here are 
-											some quick answers that can help you.</p>
-									</div>
+			<!-- =========================== Courses - Application development =========================== -->
+			<section id="appdev" class="white-bg card-section">
+				<div class="card-section-header"><h2>Application development</h2></div>
+					<!-- TM Application Programming -->
+					<course-card
+						id="ims-tm-prog"
+						name="IMS TM Application Programming"
+						desc="This course shows you through lectures and lab demos how to write
+							application programs that use Data Language One (DL/I) to process
+							terminal input and output messages in an IMS Transaction manager system.
+							This course does not teach basic COBOL or PL/I. You should already have 
+							experience developing applications with one or both of those languages."
+						imgsrc="wp-content/course-badges/badge_tm_app_prog.png"
+						level="Intermediate"
+						cost="None"
+						badge="Yes"
+						time="14 hours"
+						link="https://learn.ibm.com/course/view.php?id=13017"
+						class="pure-u-1"
+					>
+					</course-card>
+
+					<!-- DB Application Programming -->
+					<course-card
+						id="ims-db-prog"
+						name="IMS Database Application Programming"
+						desc="In this course, you'll learn how to code application programs that perform processing
+							on IMS database records. You'll learn about the hierarchic structure of IMS databases,
+							how to construct DL/I calls, how to test your applications, and more."
+						imgsrc="wp-content/course-badges/badge_db_app_prog.png"
+						level="Intermediate"
+						cost="None"
+						badge="Yes"
+						time="20 hours"
+						link="https://learn.ibm.com/course/view.php?id=12691"
+						class="pure-u-1"
+					>
+					</course-card>
+			</section>
 
-									<!-- row1 -->
-									<div class="pure-u-1">
-										<div class="pure-u-1 pure-u-md-5-12">
-											<h4 class="faq-q">How do I earn a badge?</h4>
-											<p>Courses that offer badges include one or more exams. 
-												You must pass those exams and complete required activities. 
-												See the "Grading and badge" topic in the course to see the grading policy and how exams are graded.</p>
-										</div>
-										<div class="pure-u-1 pure-u-md-1-12"></div>
+			<!-- =========================== FAQ =========================== -->
+			<section id="faq" class="light-gray-bg pure-g">
+				<!-- Header -->
+				<div class="pure-u-1 pure-u-md-5-24 faq-title">
+					<h2>Frequently asked questions</h2>
+				</div>
+				<!-- Contents -->
+				<div class="pure-u-sm-1 pure-u-md-18-24">
 
-										<div class="pure-u-1 pure-u-md-5-12">
-											<h4 class="faq-q">If I pass the course, when do I get the badge?</h4>
-											<p>Badges are typically issued automatically after you meet the course requirements and grading policy. You should get an email notification of receiving the badge in one to four days.</p>
-										</div>
-									</div>
-									<!-- row2 -->
-									<div class="pure-u-1">
-										<div class="pure-u-1 pure-u-md-5-12">
-											<h4 class="faq-q">Whom do I contact if I have problems with course content?</h4>
-											<p>You can contact the IMS Education team at <a href="mailto:ibmimsom@us.ibm.com">ibmimsom@us.ibm.com</a>.</p>
-										</div>
-										<div class="pure-u-1 pure-u-md-1-12"></div>
+					<div class="pure-u-1" style="margin-bottom:25px;">
+						<p>Have questions about IMS courses, or the badge program? Here are 
+							some quick answers that can help you.</p>
+					</div>
 
-										<div class="pure-u-1 pure-u-md-5-12">
-											<h4 class="faq-q">Where can I find more information about digital badges?</h4>
-											<p>For more information about badges, see <a 
-												target="_blank" rel="noopener noreferrer" href="https://www.ibm.com/training/credentials/faq">Frequently asked questions</a> on IBM Training.</p>
-										</div>
-									</div>
-									<!-- row3 -->
-									<div class="pure-u-1">
-										<div class="pure-u-1 pure-u-md-5-12">
-											<h4 class="faq-q">Credly Support</h4>
-											<p>For questions related to your Credly badge earner account and 
-												profile, as well as issues related to claiming your badge after receiving a notification,
-												go to <a target="_blank" rel="noopener noreferrer" href="https://support.credly.com/hc/en-us">support.credly.com</a>.</p>
-										</div>
-										<div class="pure-u-1 pure-u-md-1-12"></div>
+					<!-- row1 -->
+					<div class="pure-u-1">
+						<div class="pure-u-1 pure-u-md-5-12">
+							<h4 class="faq-q">How do I earn a badge?</h4>
+							<p>Courses that offer badges include one or more exams. 
+								You must pass those exams and complete required activities. 
+								See the "Grading and badge" topic in the course to see the grading policy and how exams are graded.</p>
+						</div>
+						<div class="pure-u-1 pure-u-md-1-12"></div>
 
-										<div class="pure-u-1 pure-u-md-5-12">
-											<!-- <p>
-												<b>Where can I find more information about digital badges?</b>
-											</p>
-											<p>For more information about badges, see <a href="https://www.ibm.com/training/P430723G05904L37">Frequently asked questions</a> on IBM Training.</p> -->
-										</div>
-									</div>
+						<div class="pure-u-1 pure-u-md-5-12">
+							<h4 class="faq-q">If I pass the course, when do I get the badge?</h4>
+							<p>Badges are typically issued automatically after you meet the course requirements and grading policy. You should get an email notification of receiving the badge in one to four days.</p>
+						</div>
+					</div>
+					<!-- row2 -->
+					<div class="pure-u-1">
+						<div class="pure-u-1 pure-u-md-5-12">
+							<h4 class="faq-q">Whom do I contact if I have problems with course content?</h4>
+							<p>You can contact the IMS Education team at <a href="mailto:ibmimsom@us.ibm.com">ibmimsom@us.ibm.com</a>.</p>
+						</div>
+						<div class="pure-u-1 pure-u-md-1-12"></div>
 
+						<div class="pure-u-1 pure-u-md-5-12">
+							<h4 class="faq-q">Where can I find more information about digital badges?</h4>
+							<p>For more information about badges, see <a 
+								target="_blank" rel="noopener noreferrer" href="https://www.ibm.com/training/credentials/faq">Frequently asked questions</a> on IBM Training.</p>
+						</div>
+					</div>
+					<!-- row3 -->
+					<div class="pure-u-1">
+						<div class="pure-u-1 pure-u-md-5-12">
+							<h4 class="faq-q">Credly Support</h4>
+							<p>For questions related to your Credly badge earner account and 
+								profile, as well as issues related to claiming your badge after receiving a notification,
+								go to <a target="_blank" rel="noopener noreferrer" href="https://support.credly.com/hc/en-us">support.credly.com</a>.</p>
+						</div>
+						<div class="pure-u-1 pure-u-md-1-12"></div>
 
-								</div>
-						
-						</section>
+						<div class="pure-u-1 pure-u-md-5-12">
+							<!-- <p>
+								<b>Where can I find more information about digital badges?</b>
+							</p>
+							<p>For more information about badges, see <a href="https://www.ibm.com/training/P430723G05904L37">Frequently asked questions</a> on IBM Training.</p> -->
 						</div>
+					</div>
 
-						<!-- =========================== Support =========================== -->
-						<div class="zs-gray-section support-sec">
-							<section id="support-section" class="zs-section pure-g">
-								<!-- Header -->
-								<div class="pure-u-1 pure-u-md-5-24">
-									<h2 id="support">Support</h2>
-								</div>
-								<!-- Contents -->
-								<div class="pure-u-sm-1 pure-u-md-18-24">
-									<!-- row1 -->
-									<div class="pure-u-1">
-										<div class="pure-u-1 pure-u-md-5-12">
-											<p>Receiving a badge notification that allows you to accept your badge can take 1 - 2 weeks after you complete the activities required to earn a badge.</p>
-											<p>If you have questions about IBM IMS badges, contact <a href="mailto:ibmimsom@us.ibm.com">ibmimsom@us.ibm.com.</a></p>
-										</div>
-										<div class="pure-u-1 pure-u-md-1-12"></div>
 
-										<div class="pure-u-1 pure-u-md-5-12">
-											<p>For questions related to your badge earner account and profile or issues related to claiming your badge after receiving a notification, go to <a 
-												target="_blank" rel="noopener noreferrer" href="https://support.credly.com/hc/en-us">https://support.credly.com/hc/en-us.</a></p>
-										</div>
-									</div>
+				</div>
+			</section>
 
-									<!-- Notice -->
-									<div class="pure-u-1 supp-notice">
-										<p>IBM leverages the services of Credly, a 3rd party data 
-											processor authorized by IBM and located in the United States, to assist in the 
-											administration of the IBM Digital Badge program. In order to issue you an IBM 
-											Digital Badge, your personal information (name, email address, and badge earned) 
-											will be shared with Credly. You will receive an email notification from Credly 
-											with instructions for claiming the badge. Your personal information is used to 
-											issue your badge and for program reporting and operational purposes. IBM may 
-											share the personal information collected with IBM subsidiaries and third parties 
-											globally. It will be handled in a manner consistent with IBM privacy practices. 
-										</p>
-										<p>
-											The IBM Privacy Statement can be viewed here: 
-											<a  target="_blank" rel="noopener noreferrer" href="https://www.ibm.com/privacy/us/en/"> https://www.ibm.com/privacy/us/en/</a>. 
-										</p>
-										<p>
-											IBM employees can view the IBM Internal Privacy Statement here:  
-											<a  target="_blank" rel="noopener noreferrer" href="https://w3.ibm.com/w3publisher/w3-privacy-notice">https://w3.ibm.com/w3publisher/w3-privacy-notice.</a>
-										</p>
-									</div>
-								</div>
-							</section>
+			<!-- =========================== Support =========================== -->
+			<section id="support" class="gray-bg pure-g">
+				<!-- Header -->
+				<div class="pure-u-1 pure-u-md-5-24">
+					<h2>Support</h2>
+				</div>
+				<!-- Contents -->
+				<div class="pure-u-sm-1 pure-u-md-18-24">
+					<!-- row1 -->
+					<div class="pure-u-1">
+						<div class="pure-u-1 pure-u-md-5-12">
+							<p>Receiving a badge notification that allows you to accept your badge can take 1 - 2 weeks after you complete the activities required to earn a badge.</p>
+							<p>If you have questions about IBM IMS badges, contact <a href="mailto:ibmimsom@us.ibm.com">ibmimsom@us.ibm.com.</a></p>
 						</div>
+						<div class="pure-u-1 pure-u-md-1-12"></div>
 
-						<!-- =========================== back to top =========================== -->
-						<div>
-							<img id="btt" src="wp-content/Icon_Back_to_top.svg" alt="Back to top" tabindex="0" role="button">
+						<div class="pure-u-1 pure-u-md-5-12">
+							<p>For questions related to your badge earner account and profile or issues related to claiming your badge after receiving a notification, go to <a 
+								target="_blank" rel="noopener noreferrer" href="https://support.credly.com/hc/en-us">https://support.credly.com/hc/en-us.</a></p>
 						</div>
+					</div>
+
+					<!-- Notice -->
+					<div class="pure-u-1 supp-notice">
+						<p>IBM leverages the services of Credly, a 3rd party data 
+							processor authorized by IBM and located in the United States, to assist in the 
+							administration of the IBM Digital Badge program. In order to issue you an IBM 
+							Digital Badge, your personal information (name, email address, and badge earned) 
+							will be shared with Credly. You will receive an email notification from Credly 
+							with instructions for claiming the badge. Your personal information is used to 
+							issue your badge and for program reporting and operational purposes. IBM may 
+							share the personal information collected with IBM subsidiaries and third parties 
+							globally. It will be handled in a manner consistent with IBM privacy practices. 
+						</p>
+						<p>
+							The IBM Privacy Statement can be viewed here: 
+							<a  target="_blank" rel="noopener noreferrer" href="https://www.ibm.com/privacy/us/en/"> https://www.ibm.com/privacy/us/en/</a>. 
+						</p>
+						<p>
+							IBM employees can view the IBM Internal Privacy Statement here:  
+							<a  target="_blank" rel="noopener noreferrer" href="https://w3.ibm.com/w3publisher/w3-privacy-notice">https://w3.ibm.com/w3publisher/w3-privacy-notice.</a>
+						</p>
+					</div>
+				</div>
+			</section>
 
-					</main>
-				</div><!-- .entry-content -->
+			<!-- =========================== back to top =========================== -->
+			<div>
+				<img id="btt" src="wp-content/Icon_Back_to_top.svg" alt="Back to top" tabindex="0" role="button">
 			</div>
-		</div><!-- #content -->
 
-		<footer aria-label="IBM" id="themeFooter">
-			<div id="boomer-footer" class="boomer_footer_menu"></div>
-			<div id="dw-footer" class="ibm-alternate ibm-padding-normal">
-				<div class="ibm-columns ibm-padding-bottom-0">
-					<div class="ibm-col-1-1">
-						<div class="ibm-footer-corporate-links">
-							<ul>
-								<li><a href="https://www.ibm.com/contact/us" target="_blank">Contact</a></li>
-								<li><div></div></li>
-								<li><a href="http://www.ibm.com/privacy/us/en/" target="_blank">Privacy</a></li>
-								<li><div></div></li>
-								<li><a href="https://www.ibm.com/legal?lnk=flg-tous-usen" target="_blank">Terms of use</a></li>
-								<li><div></div></li>
-								<li><a href="http://www.ibm.com/accessibility/us/en/" target="_blank">Accessibility</a></li>
-							</ul>
-						</div>
-						<p class="copyright">Copyright IBM Corporation 2023, 2025</p>
-						<div id="ibm-footer-locale-selector"></div>
+		</main>
+	</div><!-- #content -->
+
+	<footer aria-label="IBM" id="themeFooter">
+		<div id="boomer-footer" class="boomer_footer_menu"></div>
+		<div id="dw-footer" class="ibm-alternate ibm-padding-normal">
+			<div class="ibm-columns ibm-padding-bottom-0">
+				<div class="ibm-col-1-1">
+					<div class="ibm-footer-corporate-links">
+						<ul>
+							<li><a href="https://www.ibm.com/contact/us" target="_blank">Contact</a></li>
+							<li><div></div></li>
+							<li><a href="http://www.ibm.com/privacy/us/en/" target="_blank">Privacy</a></li>
+							<li><div></div></li>
+							<li><a href="https://www.ibm.com/legal?lnk=flg-tous-usen" target="_blank">Terms of use</a></li>
+							<li><div></div></li>
+							<li><a href="http://www.ibm.com/accessibility/us/en/" target="_blank">Accessibility</a></li>
+						</ul>
 					</div>
+					<p class="copyright">Copyright IBM Corporation 2023, 2025</p>
+					<div id="ibm-footer-locale-selector"></div>
 				</div>
 			</div>
-		</footer>
-	</div><!-- #page -->
+		</div>
+	</footer>
 
 <!-- Search box functions -->
 <script src="jekyll-tipue-search/assets/tipuesearch/searchBox.js"></script>
diff --git a/web-components/course-card/course-card.css b/web-components/course-card/course-card.css
new file mode 100644
index 00000000..4751d4d6
--- /dev/null
+++ b/web-components/course-card/course-card.css
@@ -0,0 +1,99 @@
+h2 {
+    font-weight: 500;
+    font-size: 1.5em;
+    padding: 0em;
+    margin: 0em;
+}
+
+p {
+    font-size: 1.125em;
+}
+
+a {
+    text-decoration: none;
+    color: #0f62fe;
+}
+
+img {
+    max-width: 16em;
+}
+
+/* Styling for a link group */
+.link-g {
+    margin-top: 1.4em;
+    display: flex;
+    flex-flow: row wrap;
+    gap: 2em;
+}
+
+.column-g {
+    display: flex;
+    flex-flow: column nowrap;
+    gap: 1em;
+}
+
+/* Styling for inline group (level, time) */
+.inline-g {
+    display: flex;
+    flex-flow: row wrap;
+    gap: 1em;
+}
+
+.inline-g div {
+    display: flex;
+    flex-flow: row wrap;
+    gap: 1em;
+}
+
+.inline-g p {
+    padding: 0em;
+    margin: 0em;
+    font-weight: bold;
+}
+
+.inline-g span {
+    font-weight: normal;
+}
+
+/* Styling for course card */
+.course-card {
+    margin: 1em 0em;
+    padding: 2em 0em;
+    display: flex;
+    flex-flow: row wrap;
+    align-items: flex-start;
+    gap: 2em;
+    border-bottom: 2px dotted lightgray;
+}
+
+/* 768px and below screen sizes */
+@media screen and (max-width: 48em) {
+    .inline-g {
+        width: 90%;
+    }
+}
+
+/* 1024px and above screen sizes */
+@media screen and (min-width: 64em) {
+    .course-card {
+        flex-flow: row nowrap;
+    }
+}
+
+/* 1440px and above screen sizes */
+@media screen and (min-width: 90em) {
+    .course-card {
+        align-items: center;
+    }
+
+    /* .inline-g {
+        display: grid;
+        grid-template-columns: 1fr 6fr;
+    } */
+
+    .inline-g div {
+        display: grid;
+        grid-template-columns: repeat(4, 1fr);
+        width: 90%;
+    }
+}
\ No newline at end of file
diff --git a/web-components/course-card/course-card.html b/web-components/course-card/course-card.html
new file mode 100644
index 00000000..30b51b8c
--- /dev/null
+++ b/web-components/course-card/course-card.html
@@ -0,0 +1,44 @@
+<!-- HTML template -->
+<link href="web-components/course-card/course-card.css" rel="stylesheet">
+<div class="course-card">
+    <div>
+        <img class="course-img" src="">
+    </div>
+    <div>
+        <div>
+            <h2 class="course-name"></h2>
+            <p class="course-desc"></p>
+            <div class="column-g">
+                <div class="inline-g">
+                    <p>Level: <span class="course-level"></span></p>
+                    <p>Cost: <span class="course-cost"></span></p>
+                    <p>Badge: <span class="course-badge"></span></p>
+                    <p>Time: <span class="course-time"></span></p>
+                </div>
+                <!-- Uncomment if using self-paced/live distinction -->
+                <!-- <div class="inline-g">
+                    <p>Self-paced:</p>
+                    <div>
+                        <p>Level: <span class="course-level"></span></p>
+                        <p>Cost: <span class="course-cost"></span></p>
+                        <p>Badge: <span class="course-badge"></span></p>
+                        <p>Time: <span class="course-time"></span></p>
+                    </div>
+                </div> -->
+                <div class="inline-g live-course">
+                    <p>Instructor-led:</p>
+                    <div>
+                        <p>Level: <span class="live-level"></span></p>
+                        <p>Cost: <span class="live-cost"></span></p>
+                        <p>Badge: <span class="live-badge"></span></p>
+                        <p>Time: <span class="live-time"></span></p>
+                    </div>
+                </div>
+            </div>
+        </div>
+        <div class="link-g">
+            <a class="course-link" target="_blank" rel="noopener noreferrer">Learn more →</a>
+            <a class="live-link" target="_blank" rel="noopener noreferrer">Instructor-led course →</a>
+        </div>
+    </div>
+</div>
diff --git a/web-components/course-card/course-card.js b/web-components/course-card/course-card.js
new file mode 100644
index 00000000..782c7327
--- /dev/null
+++ b/web-components/course-card/course-card.js
@@ -0,0 +1,86 @@
+// Fetch HTML template
+fetch("web-components/course-card/course-card.html")
+    .then(stream => stream.text())
+    .then(text => createComponent(text))
+
+// Create web component
+function createComponent(html) {
+
+    function setContent(cssSelector, content, shadow) {
+        const selector = shadow.querySelector(cssSelector);
+        selector.textContent = content;
+    }
+
+    function setLink(cssSelector, url, name, shadow) {
+        const link = shadow.querySelector(cssSelector);
+        link.href = url;
+        link.setAttribute('aria-label', `Learn more about ${name}`);
+    }
+
+    // Web component class
+    class CourseCard extends HTMLElement {
+
+        // Creates element with default values
+        constructor() {
+            super();
+        }
+
+        // Return array of properties to observe
+        static get observedAttributes() {
+            return ['name', 'desc', 'imgsrc', 'level', 'cost', 'badge', 'time', 'link', 'livelevel', 'livecost', 'livebadge', 'livetime', 'livelink'];
+        }
+
+        // Called when an attribute is defined or changed
+        attributeChangedCallback(property, oldValue, newValue) {
+            if (oldValue === newValue) return;
+            this[property] = newValue;
+        }
+    
+        // Invoked when element is added to document
+        connectedCallback() {
+            // Create shadow root for element
+            const shadow = this.attachShadow({mode: 'closed'});
+            shadow.innerHTML = html;
+            
+            // Set course img
+            const courseImg = shadow.querySelector('.course-img');
+            courseImg.src = this.imgsrc;
+            courseImg.setAttribute('alt', `${this.name} badge`);
+
+            // Set course name
+            setContent('.course-name', this.name, shadow);
+            // Set course desc
+            setContent('.course-desc', this.desc, shadow);
+            // Set course level
+            setContent('.course-level', this.level, shadow);
+            // Set course cost
+            setContent('.course-cost', this.cost, shadow);
+            // Set course badge
+            setContent('.course-badge', this.badge, shadow);
+            // Set course time
+            setContent('.course-time', this.time, shadow);
+            // Set course link
+            setLink('.course-link', this.link, this.name, shadow);
+
+            // Hide live course if not available
+            if (this.livelevel == undefined) {
+                const liveCourse = shadow.querySelector('.live-course');
+                const liveCourseLink = shadow.querySelector('.live-link');
+                liveCourse.style.display = liveCourseLink.style.display = "none";
+            } else {
+                // Set course level
+                setContent('.live-level', this.livelevel, shadow);
+                // Set course cost
+                setContent('.live-cost', this.livecost, shadow);
+                // Set course badge
+                setContent('.live-badge', this.livebadge, shadow);
+                // Set course time
+                setContent('.live-time', this.livetime, shadow);
+                // Set course link
+                setLink('.live-link', this.livelink, this.name, shadow);
+            }
+        }
+    }
+
+    customElements.define('course-card', CourseCard);
+}
\ No newline at end of file
diff --git a/web-components/video-card/video-card.css b/web-components/video-card/video-card.css
index a187ba3b..6d87e9ec 100644
--- a/web-components/video-card/video-card.css
+++ b/web-components/video-card/video-card.css
@@ -1,14 +1,3 @@
-:root {
-    /* Color */
-    --blue: #0f62fe;
-        /* Background Color */
-        --bg-light-gray: #f4f4f4;
-
-    /* Sizing */
-    --plex-18: 1.125em;
-    --plex-24: 1.5em; 
-}
-
 h2 {
     font-weight: 400;
     font-size: var(--plex-24);
diff --git a/web-components/video-card/video-card.js b/web-components/video-card/video-card.js
index f4e6a7c0..91d1d0e7 100644
--- a/web-components/video-card/video-card.js
+++ b/web-components/video-card/video-card.js
@@ -39,19 +39,19 @@ function createComponent(html) {
 
             // Set video name
             const videoName = shadow.querySelector('.video-name');
-            videoName.textContent = `${this.name}`;
+            videoName.textContent = this.name;
 
             // Set video desc
             const videoDesc = shadow.querySelector('.video-desc');
-            videoDesc.textContent = `${this.desc}`;
+            videoDesc.textContent = this.desc;
 
             // Set video level
             const videoLevel = shadow.querySelector('.video-level');
-            videoLevel.textContent = `${this.level}`;
+            videoLevel.textContent = this.level;
 
             // Set video time
             const videoTime = shadow.querySelector('.video-time');
-            videoTime.textContent = `${this.time}`;
+            videoTime.textContent = this.time;
 
             // Set video links
             const videoLink = shadow.querySelector('.video-link');
@@ -71,8 +71,8 @@ function createComponent(html) {
                 // Check if urls have been defined
                 if (url != undefined) {
                     linkObj.href = url;
-                    const altText = (linkText != 'now') ? `Watch ${this.name}, ${linkText}` : `Watch ${this.name}`; // Change link text if defined
-                    linkObj.setAttribute('alt', altText);
+                    const ariaText = (linkText != 'now') ? `Watch ${this.name}, ${linkText}` : `Watch ${this.name}`; // Change link text if defined
+                    linkObj.setAttribute('aria-label', ariaText);
                     linkObj.textContent = `Watch ${linkText} →`;
                 }
             })
diff --git a/wp-includes/css/page.css b/wp-includes/css/page.css
index 38c3a174..e7f6a8b1 100644
--- a/wp-includes/css/page.css
+++ b/wp-includes/css/page.css
@@ -6,7 +6,8 @@
   --black: #000;
   --blue: #0f62fe;
     /* Background Color */
-    --bg-light-gray: #f4f4f4;
+    --bg-light-gray: #F9F9F9;
+    --bg-gray: #f4f4f4;
     --bg-dark-gray-01: #1c1c1c;
     --bg-dark-gray-02: #2c2c2c;
     --bg-dark-blue: #003A6D;
@@ -71,13 +72,25 @@
   }
 
 .gray-bg {
+  background-color: var(--bg-gray);
+}
+
+.light-gray-bg {
   background-color: var(--bg-light-gray);
 }
 
-  .gray-bg h3, .gray-bg h4 {
+  .gray-bg a, .light-gray-bg a {
+    color: var(--blue);
+  }
+
+  .gray-bg h3, .gray-bg h4, .light-gray-bg h3, .light-gray-bg h4 {
     color: var(--black);
   }
 
+  .gray-bg a {
+    color: var(--blue)
+  }
+
 .blue-bg {
   background-color: var(--bg-dark-blue);
   color: var(--white);
@@ -110,15 +123,12 @@
   margin-bottom: 1.25em;
 }
 
-.icon-md {
-  max-height: var(--plex-72);
-  max-width: var(--plex-72);
-}
-
 .icon-lg {
   height: var(--plex-28);
-  max-height: var(--plex-72);
-  max-width: var(--plex-72);
+}
+
+.icon-xl {
+  height: var(--plex-36);
 }
 
 .icon {
@@ -319,7 +329,7 @@
 }
 
 .quote-blk {
-  background-color: var(--bg-light-gray);
+  background-color: var(--bg-gray);
   margin: 0.2em;
   padding: 2em;
   color: var(--black);
@@ -343,6 +353,11 @@
 .spacer {
   height: 0.3125em;
 }
+
+/* Hero section subtext */
+.subtext {
+  font-weight: 300;
+}
 /* -------------------------------------------------------- */
 
 /* Media queries */
