body, h1,h2,h3,h4,h5,h6 {font-family: "Montserrat", sans-serif}
.w3-row-padding img {margin-bottom: 12px}
/* Set the width of the sidebar to 120px */
.w3-sidebar {width: 120px;background: #222;}
/* Add a left margin to the "page content" that matches the width of the sidebar (120px) */
#main {margin-left: 120px}
/* Remove margins from "page content" on small screens */
@media only screen and (max-width: 600px) {#main {margin-left: 0}}

html {
  scroll-behavior: smooth;
}

/* Applies rounded corners to all project images */
#projects img {
  border-radius: 10px;
  box-shadow: 0 4px 8px rgba(0,0,0,0.2); 
  width: 100%;
  height: 300px;       
  object-fit: cover;
}



#projects_utsm .project-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;   /* centers both image and text */
  text-align: center;
}

#projects_utsm {
  text-align: center;          /* center text & image container */
}

#projects_utsm .project-wide {
  display: inline-block;       /* makes the whole block centerable */
}

#projects_utsm img {
  width: 500px;                /* your wider size */
  height: 300px;
  object-fit: cover;
  border-radius: 10px;
  box-shadow: 0 4px 8px rgba(0,0,0,0.2);
}

#projects_utsm .caption {
  margin-top: 8px;
  color: white;
  font-size: 16px;
  text-align: center;
}