Here’s a CSS-only solution that will work on any page created under “Manage Pages”:

1. Add an HTML widget to the bottom of your page.  Mine says “Scroll down for more courses...”.
2. View the page in your web browser.  Scroll down and notice that the scroll down message appears briefly before more catalogs are loaded.
3. You probably only need for the student to see this once before they get how the page works, so let’s make the DIV element disappear after it’s been shown for 15 seconds.  To do this you’ll need to determine the ID of the DIV so that you can use it in your own CSS (under “Configure Branding and Look”).  Right click on the page and select “Inspect” (or press CTRL+SHIFT+I on your keyboard).
4. Ensure that the selector icon (upper left corner of the panel that just opened) is selected and then click on the “Scroll down for more courses...” area of the page.  You should see that the relevant code is highlighted.

5. Depending on what you selected you may need to go “up” a div or two in the code.  What you’re looking for is something that looks similar to this--specifically the “doc-widget-##” portion in green:
   
   <div _ngcontent-ng-c1956725476="" class="single-widget doc-layout-skip-link-target ng-star-inserted" id="doc-widget-27">    <html-wysiwyg-widget class="ng-star-inserted">       <!--→    <div class="htmlwidget root wrapper-shadow">       <div class="content clearfix">          <h2><em>Scroll down for more courses...</em></h2>       </div>    </div></html-wysiwyg-widget>       <!--→    </div>
    

6. The code below assumes that we want to apply this style to similar DIVs on different pages.  Those DIVs are for doc-widgets 27 through 29 on my system--each on it’s own page.  In order to apply the same styling to all of them using one block of code, I combined them as follows. 
   
   If you only have one DIV you can simplify the code by taking out the *:is(...) and just putting in your widget ID (i.e. #doc-widget-## followed by a curly brace). 
   
   Substitute the #doc-widget-##(‘s) that apply to your system from step 5 above.
    

   /* hide the scroll-down message after 15 seconds for certain widgets */

   *:is(#doc-widget-27, #doc-widget-28, #doc-widget-29) {

     -webkit-animation: seconds 1.0s forwards;

     -webkit-animation-iteration-count: 1;

     -webkit-animation-delay: 15s;

     animation: seconds 1.0s forwards;

     animation-iteration-count: 1;

     animation-delay: 15s;

     position: relative;

     background: white;

   }

   @-webkit-keyframes seconds {

     0% {

       opacity: 1;

     }

     100% {

       opacity: 0;

       left: -9999px;

     }

   }

   @keyframes seconds {

     0% {

       opacity: 1;

     }

     100% {

       opacity: 0;

       left: -9999px;

     }

   }