как сделать чтобы масштабировались элементы (зелёный квадрат
<code lang="html">
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<!--делаетсайтадаптивным на сотовых-->
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Manon 2021 январь</title>
<link href="css/style.css" rel="stylesheet">
</head>
<!---->
<body>
<div class="zastavka">
<img src="img/zastavka_fraer.png">
<div class="kyb">12345</div>
</div>
</body>
</html><img src="https://habrastorage.org/webt/5f/fd/c1/5ffdc1b827c64803510452.png" alt="image"/>
</code>
body {
max-width: 1920px;
overflow: hidden;
border: 10px solid green; }
.zastavka {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
position: relative;
margin: 0 auto; }
.zastavka img {
display: block;
background-origin: border-box;
width: 100%;
max-width: 120em;
max-height: 50.625em;
height: 100%;
max-height: 810px;
border: 10px solid red;
margin: 0 auto; }
.kyb {
position: absolute;
height: 100%;
width: 100%;
max-height: 20em;
max-width: 20em;
border: 8px solid green;
-webkit-transform: translate(-50%, -20%);
-ms-transform: translate(-50%, -20%);
transform: translate(-50%, -20%);
left: 50%; }
) внутри родительского элемента при уменьшении экрана