.formsection {
  padding-top: 80px;
}

.tableid {
  display: none;
}

.formValidationError {
  color: red;
}

#dloginbtn {
  display: none;
}

#projectlogout {
  display: none;
}

.loginerrors {
  color: red;
}
.w-5p {
  width: 50px;
}
.w-10p {
  width: 100px;
}
.w-20p {
  width: 200px;
}
.w-30p {
  width: 300px;
}
.w-60p {
  width: 600px;
}
.w-80pec {
  width: 80%;
}
.w-20pec {
  width: 20%;
}


/* === Container === */
.portfolio-item {
    position: relative;
    display: block;
    overflow: hidden;
}

/* === Strong image zoom effect === */
.portfolio-item img {
    width: 100%;
    height: 380px;
    display: block;
    transform: scale(1);
    transition: transform 1s ease; /* smoother + longer */
    z-index: 1;
    position: relative;
}


.portfolio-item:hover img {
    transform: scale(1.25); /* BIGGER movement on hover */
}

/* === Centered text overlay === */
.portfolio-item .caption {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%); /* perfect center */
    width: 100%;
    text-align: center;
    z-index: 5; /* stays above image */
    color: #fff; /* pure white text */
    padding: 0 20px;
}

/* === Text styling === */
.caption-content h2 {
    font-size: 2rem;
    font-weight: 700;
    text-shadow: 0 0 10px rgba(0, 0, 0, 0.35); /* makes text readable without background */
}

.caption-content p {
    font-size: 1rem;
    opacity: 0.9;
    text-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
}