@media (min-width: 360px) and (max-width: 767px) {

.parent-04 {
display: grid;
grid-template-columns: 1fr;
grid-template-rows: repeat(4, 1fr);
grid-column-gap: 0px;
grid-row-gap: 30px;
}
.div04-1 { grid-area: 1 / 1 / 2 / 2; }
.div04-2 { grid-area: 2 / 1 / 3 / 2; }
.div04-3 { grid-area: 3 / 1 / 4 / 2; }
.div04-4 { grid-area: 4 / 1 / 5 / 2; }
}


@media (min-width: 768px) and (max-width: 1479px) {

.parent-04 {
display: grid;
grid-template-columns: repeat(2, 1fr);
grid-template-rows: repeat(2, 1fr);
grid-column-gap: 40px;
grid-row-gap: 30px;
}
.div04-1 { grid-area: 1 / 1 / 2 / 2; }
.div04-2 { grid-area: 1 / 2 / 2 / 3; }
.div04-3 { grid-area: 2 / 1 / 3 / 2; }
.div04-4 { grid-area: 2 / 2 / 3 / 3; }
}


@media (min-width: 1480px) {

.parent-04 {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: 1fr;
  grid-column-gap: 60px;
  grid-row-gap: 0px;
  } 
  .div04-1 { grid-area: 1 / 1 / 2 / 2; }
  .div04-2 { grid-area: 1 / 2 / 2 / 3; }
  .div04-3 { grid-area: 1 / 3 / 2 / 4; }
  .div04-4 { grid-area: 1 / 4 / 2 / 5; }
}


.fig-capt {
  padding: 20px 20px 20px 15px; 
}
.fig-capt h3 {
  font-size: 22px;
  font-weight: 700;
  color: #1c2d3a;
  margin-bottom: 30px;
}
.img-card  {
  border-radius: 5px;
  -webkit-box-shadow: 0 0 35px rgba(0, 0, 0, 0.08);
  box-shadow: 0 0 35px rgba(0, 0, 0, 0.08);
  background: #ffffff;
  padding-bottom: 20px;
}

.fig-capt p {
  color: rgba(88, 97, 103, 0.7);
  margin-bottom: 30px;
}