.pozadi {
  position: relative;
  text-align: center;

}


/* Centered text */
.center {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 10bw; /* 10 % z výšky boxu  */

} 


/* If the screen size is 601px wide or more, set the font-size of <div> to 80px  */
@media screen and (min-width: 1300px) {
  div.center {
    font-size: 22px;
  }
}

/* If the screen size is 601px wide or more, set the font-size of <div> to 80px  */
@media screen and (min-width: 1150px) {
  div.center {
    font-size: 16px;
  }
}

/* If the screen size is 601px wide or more, set the font-size of <div> to 80px  */
@media screen and (max-width: 990px) {
  div.center {
    font-size: 14px;
  }
}


/* If the screen size is 600px wide or less, set the font-size of <div> to 30px  */
@media screen and (max-width: 800px) {
  div.center {
    font-size: 12px;
  }
}

/* If the screen size is 600px wide or less, set the font-size of <div> to 30px  */
@media screen and (max-width: 600px) {
  div.center {
    font-size: 8px;
  }
}


/* If the screen size is 600px wide or less, set the font-size of <div> to 30px  */
@media screen and (max-width: 400px) {
  div.center {
    font-size: 5px;
  }
}
/* If the screen size is 601px wide or more, set the font-size of <div> to 80px */
@media screen and (min-width: 1201px) {
  img.responsive-image {
    font-size: 20px;
    opacity: 0.5;
  }
}

/* If the screen size is 601px wide or more, set the font-size of <div> to 80px */
@media screen and (max-width: 1200px) {
  img.responsive-image {
    font-size: 16px;
    opacity: 0.5;
  }
}


/* If the screen size is 600px wide or less, set the font-size of <div> to 30px */
@media screen and (max-width: 800px) {
  img.responsive-image {
    font-size: 12px;
  }
}

/* If the screen size is 600px wide or less, set the font-size of <div> to 30px */
@media screen and (max-width: 600px) {
  img.responsive-image {
    font-size: 10px;
  }
}