.box {
  background-color: #FFFFFF;
  border-radius: 30px; /* Add rounded corners */
  transition: transform 0.3s ease, background-color 0.3s ease; /* Add transition for transform and background-color */
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.3); /* Add a box shadow */
  margin: -10px;
}
/* Apply styles when hovering over the box */
.box:hover {
  background-color: #F6F4EB; /* Change the background color to gray */
  transform: scale(1.05); /* Scale up the box by 5% on hover */
  box-shadow: 0 15px 30px rgba(0, 0, 0, 0.4);
}
@media (max-width: 768px) {
  .box {
    margin: 10px; /* Add spacing between stacked boxes */
  }
  
  /* Increase spacing on hover for a medium screen */
@media (max-width: 768px) {
  .box:hover {
    margin: 20px; /* Adjust the margin on hover for a medium screen */
  }
}

/* Increase spacing on hover for a small screen */
@media (max-width: 480px) {
  .box:hover {
    margin: 15px; /* Adjust the margin on hover for a small screen */
  }
}

  /* Increase spacing on hover for a small screen */
  @media (max-width: 480px) {
    .box:hover {
      margin: 15px; /* Adjust the margin on hover for a small screen */
    }
  }
}
.gradient-text {
  font-size: 36px;
  font-weight: bold;
  background: linear-gradient(to right, #ff00cc, #3333ff);
}


.job-opportunity-redesign .zpcontainer-fluid{
    padding: 0px;
    margin: 0px;
}

.job-opportunity-redesign .zpelem-codesnippet{
    padding: 0px;
    margin: 0px;
}


/* Middle Menu Styles */
.toll{
    margin-top: -25px;
}

.tnh{
    margin-top: 24px;
}

.container {
  width: 100%; /* Set the width of the container */
  height: 85%;
  padding: 20px; /* Add padding to the container */
  background-color: #ffffff; /* Set the background color of the container */
  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2); /* Add shadow to the container */
}

/* Additional styles for text inside the container */
.container p {
  font-size: 16px;
  color: #333333;
}

@media (max-width: 768px) {
  .container p {
    font-size: 14px; /* Adjust font size for small screens */
    margin: 20px
  }
}

.container:hover {
  background-color: #F6F4EB; /* Change the background color to gray */
}