.view-change {
  position: fixed;
  top: 80px;
  right: 20px;
  background: #ac001d;
	background: rgba(0,0,0,0.10);
	background: rgba(34,28,20,0.74);
	background: rgba(255,165,0,1.00); 
	background: #9ecdcc;
  border: none;
  border-radius: 0px;
  cursor: pointer;
  z-index: 99;
  padding: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
  width: 51px;
  height: 41px;
/*	border-radius: 25px;*/
}
	
@media (max-width: 750px) {
  .view-change {
    display: none;
  }
}

.view-change:hover {
  background: rgba(172, 0, 29, 0.75);
	background: rgba(0,0,0,0.30);
	background: #221c14;
	background: rgba(255,165,0,0.50); 
	background: orange;
}

.view-icon {
  display: none;
  width: 20px;
  height: 20px;
}

.view-icon svg {
  display: block;
  width: 100%;
  height: 100%;
}

/* DEFAULT STATE SHOWS PLUS ICON */
.view-change .view-minus {
  display: block;
}

/* WHEN ACTIVE (minus class added) SHOWS MINUS ICON */
.view-change.minus .view-minus {
  display: none;
}

.view-change.minus .view-plus {
  display: block;
}

/* Rest of your styles remain unchanged */
.portfolio-art-grid {
  transition: all 0.3s ease;
  width: 100%;
}

.portfolio-art-grid.focused-view {
  max-width: 480px;
  margin: 0 auto;
  position: relative;
/*  background: white;*/
  z-index: 95;
  padding: 20px;
  box-shadow: 0 0 20px rgba(0,0,0,0.0);
}

body.focused-view::before {
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.0);
  z-index: 90;
  pointer-events: none;
}

body.focused-view {
  overflow: hidden;
}

/* Add these styles to your portfolio-pages.css or create a new CSS rule */

.artwork-disc-one,
.artwork-disc-60,
.artwork-disc-two {
  width: 100%;
  padding: 20px;
  box-sizing: border-box; /* This ensures padding is included in the width */
}

/* If you want these divs to be full width even in the focused view */
/*
.portfolio-art-grid.focused-view .artwork-disc-60,
.portfolio-art-grid.focused-view .artwork-disc-two {
  max-width: 100%;
*/
 /* margin-left: -20px;  Counteract the focused-view padding */
 /* margin-right: -20px;  Counteract the focused-view padding */
 /* width: calc(100% + 40px);  Alternative to negative margins */
}

/* If you want the text to span full width but maintain the image constraints */
/*
.img2, .img4 {
  width: 100%;
}*/
