Four Rounding Values ​​for Different CSS Corners

If four values ​​are specified, the first value specifies the rounding for the upper-left corner, the second for the upper-right corner, the third for the lower-right corner, and the fourth for the lower-left corner:

html<div id="elem"></div>
css#elem {
  width: 300px;
  height: 100px;
  border: 1px solid red;
  border-radius: 10px 20px 30px 40px;
}

Результат:

Задание 1

Repeat the page according to this example: