@charset "UTF-8";
/* CSS Document */
body {
      font-family: 'Montserrat', sans-serif;
      background-color: white;
      color: black;
      padding: 60px 20px;
      text-align: center;
    }

    /* Hamburger icon */
    .hamburger {
      font-size: 32px;
      position: fixed;
      top: 20px;
      right: 25px;
      z-index: 1001;
      cursor: pointer;
      color: black;
      transition: color 0.3s ease;
    }

    /* Slide-out menu */
    .side-menu {
      height: 100%;
      width: 0;
      position: fixed;
      top: 0;
      right: 0;
      background-color: #000;
      overflow-x: hidden;
      transition: 0.4s;
      padding-top: 60px;
      z-index: 1000;
    }

    .side-menu a {
      padding: 12px 30px;
      text-decoration: none;
      font-size: 22px;
      color: white;
      display: block;
      transition: 0.3s;
    }

    .side-menu a:hover {
      background-color: #333;
    }
    .content-section {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      align-items: center;
      margin-top: 50px;
      gap: 40px;
    }
  footer {
        background-color: #f5f5f5;
        padding: 20px 0;
        font-size: 14px;
        color: #333;
        border-top: 1px solid #ddd;
      }

    .about-image {
      max-width: 100%;
      width: 400px;
      border-radius: 12px;
    }

    .about-text-box {
      max-width: 500px;
      text-align: left;
    }

    @media (max-width: 768px) {
      .about-text-box {
        text-align: center;
      }
    }
  
   .card {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
  }

  .card:hover {
    transform: translateY(-10px);
    box-shadow: 0 0 20px 4px rgba(0, 255, 255, 1); 
    border: 1px solid rgba(0, 255, 255, 1); 
  }
  .list-group-item.uniform {
    min-width: 150px;   
    text-align: center;
  }
	  
  .list-group {
    display: inline-flex;
    justify-content: center;
    transition: all 0.3s ease;
    box-shadow: 0 0 20px 4px rgba(0, 255, 255, 0); 
    border: 1px solid transparent; 
    margin: 10px auto; 
    border-radius: 12px; 
  }

  .list-group:hover {
    transform: translateY(-8px);
    transition: transform 0.3s ease, box-shadow 0.3s ease, border 0.3s ease;
    box-shadow: 0 0 20px 4px rgba(0, 255, 255, 0.6); 
    border: 1px solid rgba(0, 255, 255, 0.6);       
  }