diff --git a/d2core/d2map/renderer.go b/d2core/d2map/renderer.go
index 9d1a36c3..e10cd5b4 100644
--- a/d2core/d2map/renderer.go
+++ b/d2core/d2map/renderer.go
@@ -58,3 +58,15 @@ func (m *MapRenderer) ScreenToOrtho(x, y int) (float64, float64) {
 func (m *MapRenderer) WorldToOrtho(x, y float64) (float64, float64) {
 	return m.viewport.WorldToOrtho(x, y)
 }
+
+func (m *MapRenderer) ViewportToLeft() {
+	m.viewport.toLeft()
+}
+
+func (m *MapRenderer) ViewportToRight() {
+	m.viewport.toRight()
+}
+
+func (m *MapRenderer) ViewportDefault() {
+	m.viewport.resetAlign()
+}
diff --git a/d2core/d2map/viewport.go b/d2core/d2map/viewport.go
index d3ffa5e6..768552c0 100644
--- a/d2core/d2map/viewport.go
+++ b/d2core/d2map/viewport.go
@@ -11,11 +11,19 @@ type worldTrans struct {
 	y float64
 }
 
+const (
+	center = 0
+	left   = 1
+	right  = 2
+)
+
 type Viewport struct {
-	screenRect   d2common.Rectangle
-	transStack   []worldTrans
-	transCurrent worldTrans
-	camera       *Camera
+	defaultScreenRect d2common.Rectangle
+	screenRect        d2common.Rectangle
+	transStack        []worldTrans
+	transCurrent      worldTrans
+	camera            *Camera
+	align             int
 }
 
 func NewViewport(x, y, width, height int) *Viewport {
@@ -26,6 +34,12 @@ func NewViewport(x, y, width, height int) *Viewport {
 			Width:  width,
 			Height: height,
 		},
+		defaultScreenRect: d2common.Rectangle{
+			Left:   x,
+			Top:    y,
+			Width:  width,
+			Height: height,
+		},
 	}
 }
 
@@ -130,3 +144,26 @@ func (v *Viewport) getCameraOffset() (float64, float64) {
 
 	return camX, camY
 }
+
+func (v *Viewport) toLeft() {
+	if v.align == left {
+		return
+	}
+	v.screenRect.Width = v.defaultScreenRect.Width / 2
+}
+
+func (v *Viewport) toRight() {
+	if v.align == right {
+		return
+	}
+	v.screenRect.Width = v.defaultScreenRect.Width / 2
+	v.screenRect.Left = v.defaultScreenRect.Left + v.defaultScreenRect.Width/2
+}
+
+func (v *Viewport) resetAlign() {
+	if v.align == center {
+		return
+	}
+	v.screenRect.Width = v.defaultScreenRect.Width
+	v.screenRect.Left = v.defaultScreenRect.Left
+}
diff --git a/d2game/d2player/game_controls.go b/d2game/d2player/game_controls.go
index 8bd1e4da..1195b99a 100644
--- a/d2game/d2player/game_controls.go
+++ b/d2game/d2player/game_controls.go
@@ -55,16 +55,35 @@ func NewGameControls(hero *d2map.Player, mapEngine *d2map.MapEngine, mapRenderer
 func (g *GameControls) OnKeyDown(event d2input.KeyEvent) bool {
 	if event.Key == d2input.KeyI {
 		g.inventory.Toggle()
+		g.updateLayout()
 		return true
 	}
 	if event.Key == d2input.KeyC {
 		g.heroStats.Toggle()
+		g.updateLayout()
 		return true
 	}
 
 	return false
 }
 
+func (g *GameControls) updateLayout() {
+	isRightPanelOpen := false
+	isLeftPanelOpen := false
+
+	// todo : add same logic when adding quest log and skill tree
+	isRightPanelOpen = g.inventory.isOpen || isRightPanelOpen
+	isLeftPanelOpen = g.heroStats.isOpen || isLeftPanelOpen
+
+	if isRightPanelOpen == isLeftPanelOpen {
+		g.mapRenderer.ViewportDefault()
+	} else if isRightPanelOpen == true {
+		g.mapRenderer.ViewportToLeft()
+	} else {
+		g.mapRenderer.ViewportToRight()
+	}
+}
+
 func (g *GameControls) OnMouseButtonDown(event d2input.MouseEvent) bool {
 	px, py := g.mapRenderer.ScreenToWorld(event.X, event.Y)
 	px = float64(int(px*10)) / 10.0