diff --git a/src/components/backButton/backButton.tsx b/src/components/backButton/backButton.tsx
index 5f33ddf..5eeeb84 100644
--- a/src/components/backButton/backButton.tsx
+++ b/src/components/backButton/backButton.tsx
@@ -11,7 +11,7 @@ const BackButton: React.FC = () => {
   return (
     <button
       onClick={handleBack}
-      className="absolute left-5 top-20 z-50 flex flex-row gap-2 rounded-full bg-slate-600 bg-opacity-80 px-5 py-3 text-white duration-100 hover:scale-105 hover:cursor-pointer hover:bg-slate-800 hover:bg-opacity-95"
+      className="absolute left-5 top-20 z-40 flex flex-row gap-2 rounded-full bg-slate-600 bg-opacity-80 px-5 py-3 text-white duration-100 hover:scale-105 hover:cursor-pointer hover:bg-slate-800 hover:bg-opacity-95"
     >
       <CircleArrowLeft />
       <p>Back</p>
diff --git a/src/components/header/header.tsx b/src/components/header/header.tsx
index 4d58f9a..b219a89 100644
--- a/src/components/header/header.tsx
+++ b/src/components/header/header.tsx
@@ -51,7 +51,7 @@ const Header: React.FC = () => {
   return (
     <header
       className={`fixed top-0 z-50 w-full transition-all duration-500 ${
-        isScrolled ? 'bg-opacity-100' : 'bg-opacity-10'
+        isScrolled ? 'bg-opacity-100' : 'bg-opacity-100 md:bg-opacity-10'
       } bg-slate-800`}
     >
       <div className="container mx-auto flex h-10 items-center justify-between px-4 py-8 text-white md:h-16 md:px-6">