*{
    padding: 0;
    margin: 0;
    font-family:Arial, Helvetica, sans-serif;
}
img{
    width: 100%;
    /* height: 100%;  */
}
/* ? Header start here */
.bg{
      background-color: #195774;
  text-align: center;
  color: white;
  font-size: 3.5vw;
  padding: 5% 0;
}
.all-wrapper{
    width: 80%;
  margin: 0 auto;
  text-align: center;
    font-size: 4.5vw;  
    font-weight: 550;
}
.all-wrapper div {
  margin: 5% 0;
}
/* ? three puppies section start here */
 .first-section,.last-section {
    display: flex;
    gap: 1%;
  }
  .first-section div {
    width: 33%;
  }
  /* !if i use height i don't need this */
  /* !if i dont use height 100% i need this */
  .first-section div img {
  display: block;
  background: turquoise;
  }
  .missing{
    background-color: #ee4d65;
  }
   .missing-text {
    text-align: center;
  /* !if i use height 100%*/
    /* padding: 29% 25%; */
    /* ! if don't use 100 height */
    padding: 19% 15%;
    font-size: 4.5vw;
     font-weight: normal; 
  }
  /* ? Last two puppies section */
   .last-section div {
    width: 50%;
  }
  /* ! if i don't use height 100% i need this */
   .last-section div img{
    display: block;
   }
  .last-section {
    gap: 5%;
    }
    /* ? Footer here */
    .ft-text{
    padding-bottom: 6.5%;
}