body {background-image: greybackground1.jpg;
width:100%;}

p {margin-left:50px;
	font-family:"Airal", Airal, sans-serif;
	  font-size:18px;
	  margin-right: 18px;}

p3 {margin-left:50px;
  font-family:"Airal", Airal, sans-serif;
    font-size:16px;
    padding-bottom: 6px;
    line-height: 26px;}  
	  

h1 {font-family:"Airal", Airal, sans-serif;
  text-align:center;
  font-size:30px;}

h2 {font-family:"Airal", Airal, sans-serif;
  margin-left:5px;
  font-size:14px;
  font-weight: normal;
  }
  
h3 {margin-left:50px;
  font-family:"Airal", Airal, sans-serif;
    font-size:16px;
    font-weight: normal;
    }  

div.MsoNormal
  {
  text-align:left;
  font-weight:normal;
  font-family:"Arial", Arial, sans-serif;
  width:auto;
  line-height:24px;
    font-size:16px;
  }
  
img {width: 320px;}  
  
  
.gallery-container {
  /* Apply Flexbox to the main container of the figures */
  display: flex;
  gap: 20px; /* Space between the figure elements */
  justify-content: center;
  align-items: center;
}

.gallery-container figure {
  /* Ensure each figure takes up equal space */
  flex: 1;
  margin: 0; /* Remove default margin from the figure element */
  text-align: center; /* Center the caption text */
}

.gallery-container img {
  /* Ensure image fills the figure container */
  max-width: 100%;
  height: auto;
  /* Add space between image and caption */
  margin-bottom: 10px; 
}

.gallery-container figcaption {
  /* Style your captions */
  font-size: 16px;
  font-family: Arial;
  color: Black;
  padding: 5px 0;
}

.container-margin img {
  display: block;  /* Change image from inline to block element */
  margin-left: auto;
  margin-right: auto;
  width: 50%;      /* Set a specific width so margin:auto works */
     -webkit-box-shadow: 7px 7px 5px rgba(46, 50, 50, 0.75);
-moz-box-shadow:    7px 7px 5px rgba(46, 50, 50, 0.75);
box-shadow:         7px 7px 5px rgba(46, 50, 50, 0.75);
}


 display: flex;
  {flex-direction: column;
  height: 100%;
  width: 100%;
  justify-content: center;
  align-items: center;}
  
  suggestion_active { 
    background-image: E:/Documents/Webpages/greybackground1.jpg;
    background-repeat:no-repeat;
    position:inherit;
    float:inherit;
    width: 100px; 
    height: 36px;
}

suggestion_active_text {
    possition: absolute;
    font-family: "Arial", Arial;
    font-size: 12px;
    font-weight: lighter;
    text-align: center;
    color:#edebeb;
    vertical-align: middle;
    padding:0px;
}

 /* Container holding the image and the text */
.container {
  position: relative;
}

/* Bottom right text */

.text-block {
  width: 30%;
  margin-left: auto;
  margin-right: auto;
  background-color: #edebeb;
  color: black;
  padding-left: 10px;
  padding-right: 8px;
  padding-top: 10px;
} 

<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center; font-family: "Times New Roman", Times New Roman">

div.img
  {
  display: flex;
   justify-content: center;
   align-items: center;
   width: auto;
          }
  
div.img img
  {
  width:50%;
  -webkit-box-shadow: 7px 7px 5px rgba(46, 50, 50, 0.75);
-moz-box-shadow:    7px 7px 5px rgba(46, 50, 50, 0.75);
box-shadow:         7px 7px 5px rgba(46, 50, 50, 0.75);
   }

div.desc
  {
  text-align:center;
  font-weight:normal;
  font-family:"Times New Roman", Times New Roman, sans-serif;
  width:auto;
    font-size:14px;
    padding-top: 14px;
    padding-bottom: 24px;
  }
  
div.end
	      {font-family:"Arial", Arial, sans-serif;
	          font-size:10px;
	          width:auto;
		  line-height:20px;
	          text-align:center;
		  padding-bottom: 20px;}