Change background of a section [closed]

the section has a defined background

How do I move the mouse over the image? 1 Change the background of the section overlapping the current one, remove the mouse back.

    <section class="modules">
<div class="container">
  <div class="row">
<div class="col-md-4">

  <img src="<?php echo get_theme_file_uri('assets/img/module-advancement.png') ?>" alt="Advancement" class="module-1" id="1">
  <img src="<?php echo get_theme_file_uri('assets/img/module-marketing.png') ?>" alt="Marketing" class="module-2" id="2">
  <img src="<?php echo get_theme_file_uri('assets/img/module-alumni.png') ?>" alt="Alumni" class="module-3" id="3">

css:

  section.modules:after {
  content: "";
 background-image: url(../img/bg/bg-modules-bottom.jpg);
  width: 980px;
   height: 956px;
   display: block;
   position: absolute;
   bottom: -110px;
   right: -480px;
   z-index: -1;
 }