fixed details text scrolling under less button

assets/css/style.css

@@ -202,7 +202,8 @@ body {
 .card .details {
     flex: 1;
     overflow-y: auto;
-    padding: 0 50px 50px 50px;
+    padding: 0 50px 10px 50px;
+    margin-bottom: 40px;
 
     opacity: 0;
     visibility: hidden;
@@ -406,6 +407,13 @@ html:not(.js) .requires-js {
     display: none;
 }
 
+@media only screen and (max-width: 760px) {
+    #details:target + .card-container .back-main > ul,
+    #details:target + .card-container .back-main > hr {
+        display: none;
+    }
+}
+
 @media only screen and (max-width: 600px) {
     :root {
         --max-height: calc(100dvh - 110px);
@@ -454,6 +462,7 @@ html:not(.js) .requires-js {
         flex: none;
         overflow: visible;
         padding: 20px 25px 5px 25px;
+        margin-bottom: 0;
     }
     #details:target + .card-container .back-main {
         flex: none;
@@ -462,10 +471,6 @@ html:not(.js) .requires-js {
         justify-content: flex-start;
         padding: 15px 25px 0 25px;
     }
-    #details:target + .card-container .back-main > ul,
-    #details:target + .card-container .back-main > hr {
-        display: none;
-    }
     #details:target + .card-container .interests {
         grid-template-columns: 1fr;
         row-gap: 4px;