static/css/index.css

@@ -46,13 +46,11 @@
 
 /* breakpoint */
 @media only screen and (max-width: 640px) {
-  .avatar {
+  #avatar {
     position: absolute;
     width: calc(var(--font-size) * 4);
-    transform: translate(
-      calc(var(--font-size) * -19),
-      calc(var(--font-size) * -3.7)
-    );
+    left: 10px;
+    top: -30px;
   }
 }
 

static/css/style.css

@@ -16,6 +16,7 @@ a:hover {
 }
 
 main {
+  position: relative;
   color: var(--font-color);
   font-size: var(--font-size);
   padding: 2em 1em;