#myBtn {
    /* Hidden by default, will be shown by JS */
    display: none; 
    /* Fixed/sticky position */
    position: fixed; 
    /* Place the button 50px from the bottom to give some margin */
    bottom: 50px; 
    /* Place the button 50px from the right */
    right: 50px; 
    /* Make sure it does not overlap */
    z-index: 1000; /* Increased z-index to ensure it's on top of almost everything */
    
    /* Remove default button styles for a seamless GIF appearance */
    border: none; 
    outline: none; 
    background-color: transparent; /* No background color */
    padding: 0; /* Remove default padding */
    cursor: pointer; /* Add a mouse pointer on hover */
    
    /* Optional: A subtle glow effect for a space-themed element */
    /* box-shadow: 0 0 10px rgba(255, 100, 0, 0.7); 
    border-radius: 50%; */
    
    /* Ensure the image within the button doesn't affect the size */
    line-height: 0; 
}


/* --- FLAPPING BIRD ANIMATION CONTAINER --- */
#flappingBird {
    width: 100px; /* Must match the width of your individual image frames */
    height: 100px; /* Must match the height of your individual image frames */
    
    /* Initial styling for the bird */
    background-image: url('https://static.igem.wiki/teams/5634/wiki/astroowl/scrolltotop/fly0.webp'); /* Start with the first frame */
    background-size: contain; /* Ensure the image fits the container */
    background-repeat: no-repeat;
    /* Mars theme styling */
    /* border: 3px solid #ff4500; 
    border-radius: 50%; 
    transition: transform 0.3s ease-in-out; */
}

/* #myBtn:hover #flappingBird {
    transform: scale(1.1) rotate(5deg); 
} */


/* ------------CONTACT------ */

.Contact{
    text-align: center;
}

.Contact p {
    margin-top: 0;
    margin-bottom: 0;
    /* Optional: Tightly pack the lines by adjusting line height */
    line-height: 1.5; 
}
.Contact h4 {
    margin-top: 0;
    margin-bottom: 0;
    /* Optional: Tightly pack the lines by adjusting line height */
    line-height: 2; 
}
/* .contact-box {
    border: 2px solid white; 
    
    padding: 15px; 
    border-radius: 8px; 
} */
.logo-container {
        display: flex;
        align-items: center;
        height: 100%;
        padding-bottom: 10%;
    }
    
    .logo-container img {
        max-width: 100%;
        height: auto;
        object-fit: contain;
    }
    
.social-buttons {
            display: flex;
            gap: 10px;
            flex-wrap: wrap;
            align-items: center;
            justify-content: center;
            
        }
        
        .social-btn {
            
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 8px;
            /* color: white; */
            text-decoration: none;
            transition: transform 0.3s, opacity 0.3s;
            position: relative;
            overflow: hidden;
        }
        
        .social-btn:hover {
            transform: translateY(-3px);
            opacity: 0.9;
        }
        
        .instagram {
            /* background: linear-gradient(45deg, #405DE6, #5851DB, #833AB4, #C13584, #E1306C, #FD1D1D); */
            width: 50px;
            height: 50px;
        }
        
        .website {
            /* background-color: #2c5aa0; */
            width: 100px;
            height: 50px;
        }
        
        .email {
            /* background-color: #d44638; */
            width: 50px;
            height: 50px;
        }
        
        .social-logo {
            /* width: 24px;
            height: 24px;
            filter: brightness(0) invert(1); */
            

            height: 50px;
            margin: 0 40px;
            /* box-shadow: 0 0 10px 2px rgba(255, 255, 255, 0.55); 
            border-radius: 5px;  */
        }
        
        