h1,h2 {
  font-family: Roboto, sans-serif;
  color: #373737;
   text-align: justify;
   text-indent: 4em;
   line-height: 1.2;

}
body {
    background-color: #f9f9f9;
}

table.a {
    font-size: 20px;
    border-style: hidden;
    border-collapse: separate;
    margin-right: auto;
    margin-left: auto;
    border-spacing: 55px 0;
}

img.b {
  display: block;
  margin: auto;
  width: 50%;
  border-radius: 1%;
}

.TextOnImage {
  font-size: 60px;  
  position: relative;
  text-align: center;
  color: #f9f9f9;
}

div.x {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  opacity: 90%;
  
  
}

div.x p{

 font-size: 50px;
 margin-top: 10px;
}

div.x a{

 font-size: 30px;
 margin-top: 10px;
 background-color: rgb(0, 255, 234, 0.7);
 padding: 2%;
border-radius: 100%;
}

.TextImage1 {
  font-size: 1.25rem + 1vw;  
  position: relative;
  text-align: left;
  color: black;
}

div.TI1 {
  position: absolute;
  top: 0px;
  left: 5px;
}

.TextImage2 {
  font-size: 1.25rem + 1vw;  
  position: relative;
  text-align: left;
  color: #f9f9f9;
}

div.TI2 {
  position: absolute;
  top: 0px;
  left: 5px;
}

.TextImage3 {
  font-size: 1.25rem + 1vw;  
  position: relative;
  text-align: left;
  color: black;
}

div.TI3 {
  position: absolute;
  top: 0px;
  left: 5px;
}

.flexbox {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  flex-wrap: wrap;

}