diff --git a/2-ui/3-event-details/4-mouse-drag-and-drop/article.md b/2-ui/3-event-details/4-mouse-drag-and-drop/article.md
index 193d35c5..9c919f81 100644
--- a/2-ui/3-event-details/4-mouse-drag-and-drop/article.md
+++ b/2-ui/3-event-details/4-mouse-drag-and-drop/article.md
@@ -107,7 +107,7 @@ It would be better if we keep the initial shift of the element relative to the p
For instance, if we start dragging by the edge of the ball, then the cursor should remain over the edge while dragging.
-
+
1. When a visitor presses the button (`mousedown`) -- we can remember the distance from the cursor to the left-upper corner of the ball in variables `shiftX/shiftY`. We should keep that distance while dragging.
diff --git a/2-ui/3-event-details/4-mouse-drag-and-drop/ball_shift.png b/2-ui/3-event-details/4-mouse-drag-and-drop/ball_shift.png
deleted file mode 100644
index 63fe3726..00000000
Binary files a/2-ui/3-event-details/4-mouse-drag-and-drop/ball_shift.png and /dev/null differ
diff --git a/2-ui/3-event-details/4-mouse-drag-and-drop/ball_shift.svg b/2-ui/3-event-details/4-mouse-drag-and-drop/ball_shift.svg
new file mode 100644
index 00000000..564730c5
--- /dev/null
+++ b/2-ui/3-event-details/4-mouse-drag-and-drop/ball_shift.svg
@@ -0,0 +1,41 @@
+
+
\ No newline at end of file
diff --git a/2-ui/3-event-details/4-mouse-drag-and-drop/ball_shift@2x.png b/2-ui/3-event-details/4-mouse-drag-and-drop/ball_shift@2x.png
deleted file mode 100644
index d035705e..00000000
Binary files a/2-ui/3-event-details/4-mouse-drag-and-drop/ball_shift@2x.png and /dev/null differ
diff --git a/2-ui/3-event-details/5-keyboard-events/article.md b/2-ui/3-event-details/5-keyboard-events/article.md
index ed9088fc..ecf10119 100644
--- a/2-ui/3-event-details/5-keyboard-events/article.md
+++ b/2-ui/3-event-details/5-keyboard-events/article.md
@@ -93,9 +93,9 @@ On the other hand, there's a problem with `event.code`. For different keyboard l
For example, here are US layout ("QWERTY") and German layout ("QWERTZ") under it (courtesy of Wikipedia):
-
+
-
+
For the same key, US layout has "Z", while German layout has "Y" (letters are swapped).
diff --git a/2-ui/3-event-details/5-keyboard-events/german-layout.png b/2-ui/3-event-details/5-keyboard-events/german-layout.png
deleted file mode 100644
index 7e24f254..00000000
Binary files a/2-ui/3-event-details/5-keyboard-events/german-layout.png and /dev/null differ
diff --git a/2-ui/3-event-details/5-keyboard-events/german-layout.svg b/2-ui/3-event-details/5-keyboard-events/german-layout.svg
new file mode 100644
index 00000000..1aba23e2
--- /dev/null
+++ b/2-ui/3-event-details/5-keyboard-events/german-layout.svg
@@ -0,0 +1,194 @@
+
+
\ No newline at end of file
diff --git a/2-ui/3-event-details/5-keyboard-events/german-layout@2x.png b/2-ui/3-event-details/5-keyboard-events/german-layout@2x.png
deleted file mode 100644
index 30f6e0d1..00000000
Binary files a/2-ui/3-event-details/5-keyboard-events/german-layout@2x.png and /dev/null differ
diff --git a/2-ui/3-event-details/5-keyboard-events/us-layout.png b/2-ui/3-event-details/5-keyboard-events/us-layout.png
deleted file mode 100644
index a42dd80f..00000000
Binary files a/2-ui/3-event-details/5-keyboard-events/us-layout.png and /dev/null differ
diff --git a/2-ui/3-event-details/5-keyboard-events/us-layout.svg b/2-ui/3-event-details/5-keyboard-events/us-layout.svg
new file mode 100644
index 00000000..68a81474
--- /dev/null
+++ b/2-ui/3-event-details/5-keyboard-events/us-layout.svg
@@ -0,0 +1,167 @@
+
+
\ No newline at end of file
diff --git a/2-ui/3-event-details/5-keyboard-events/us-layout@2x.png b/2-ui/3-event-details/5-keyboard-events/us-layout@2x.png
deleted file mode 100644
index fd583b74..00000000
Binary files a/2-ui/3-event-details/5-keyboard-events/us-layout@2x.png and /dev/null differ