diff --git a/src/assets/css/portfolio.css b/src/assets/css/portfolio.css
index 8f01b28..f78d479 100644
--- a/src/assets/css/portfolio.css
+++ b/src/assets/css/portfolio.css
@@ -976,7 +976,7 @@ body.dragging-scroll {
   display: flex;
   flex-direction: column;
   gap: 24px;
-  max-width: 600px;
+  /* max-width: 600px; */
 }
 .itemc,
 .itemr {
@@ -994,6 +994,7 @@ body.dragging-scroll {
   background-repeat: no-repeat;
   background-position: bottom;
   background-size: auto;
+  /* flex-basis: 100%; */
 }
 .itemr {
   background-color: #e5efff;
diff --git a/src/assets/js/portfolio.js b/src/assets/js/portfolio.js
index e72a9e1..a4d1ba5 100644
--- a/src/assets/js/portfolio.js
+++ b/src/assets/js/portfolio.js
@@ -1101,22 +1101,38 @@ function handleMobilePopupView() {
 
   window.addEventListener('resize', updateOrientationState);
   window.addEventListener('orientationchange', updateOrientationState);
-
-updateOrientationState();
+  
 
   function updateOrientationState() {
     const isLandscape = window.innerWidth > window.innerHeight;
-
+ const desktopBtn = document.querySelector('.desktop-btn');
+ const phoneBtn = document.querySelector('.phone-btn');
+ const desktopUse = document.getElementById('desktopIcon');
+ const phoneUse = document.getElementById('phoneIcon');
     if (isLandscape) {
       portfolioWrapper.classList.remove('mobile-view');
       sideWrapper.classList.add('rotated-desktop');
       sideWrapper.classList.add('is-rotated');
       overlay.classList.add('is-rotated2');
+
+        desktopBtn?.classList.add('active');
+        phoneBtn?.classList.remove('active');
+
+        desktopUse?.setAttribute('href', './src/assets/icons/portfolioP.svg#descktop-icon-active');
+
+        phoneUse?.setAttribute('href', './src/assets/icons/portfolioP.svg#phone-icon');
     } else {
       portfolioWrapper.classList.add('mobile-view');
       sideWrapper.classList.remove('rotated-desktop');
       sideWrapper.classList.remove('is-rotated');
       overlay.classList.remove('is-rotated2');
+
+          phoneBtn?.classList.add('active');
+          desktopBtn?.classList.remove('active');
+
+          phoneUse?.setAttribute('href', './src/assets/icons/portfolioP.svg#phone-icon-active');
+
+          desktopUse?.setAttribute('href', './src/assets/icons/portfolioP.svg#descktop-icon');
     }
   }
   updateOrientationState();