.box {
  margin: 10px;
  background-color: #13657a;
  position: relative;
  overflow: hidden;
  transition: all 0.3s ease;
  border: 1px solid #13657a;
  border-radius: 8px;
  box-shadow: 0 0 29px 0 #023B6D;
}

.box-content {
    height: 150px;
    position: relative;
    z-index: 2; /* Keep content above the hover effect */
    /*color:#0364b8;*/
    color:#D08C08;
	color:white;
    font-weight: bold;
    text-align: center;
    /*line-height: 150px; /* Center text vertically */

    font-size: 24px;
    padding: 10px;

    display: grid;
    align-items: center;
}

.box::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #289ba0;
     /* Hover color */
    transform: translateY(100%); /* Start off-screen */
    transition: transform 0.5s ease-in-out; /* Smooth transition */
    z-index: 1;
}

.box:hover::after {
    transform: translateY(0); /* Move up to cover the box */
}
/* Popup Overlay */
    .popup-overlay {
        position: fixed;
        top: 0; left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0,0,0,0.6);
        display: none; /* Hidden by default */
        justify-content: center;
        align-items: center;
        z-index: 9999;
    }

    /* Popup Content */
    .popup-content {
        background: #fff;
        padding: 20px;
        border-radius: 6px;
        text-align: center;
        width: 800px;
        position: relative;
    }

    .popup-content img {
        max-width: 100%;
        border-radius: 6px;
    }

    .popup-content h2 {
        margin: 15px 0 10px;
        font-size: 22px;
    }

    .popup-content p {
        font-size: 16px;
        color: #555;
        margin-bottom: 20px;
    }

    .popup-content button {
        background: #007BFF;
        color: white;
        border: none;
        padding: 10px 20px;
        font-size: 16px;
        border-radius: 4px;
        cursor: pointer;
    }

    .popup-content button:hover {
        background: #0056b3;
    }

    /* Close Button */
    .close-btn {
        
        top: 10px;
        right: 15px;
        font-size: 30px;
        cursor: pointer;
        color: #333;
    }