/* Reset some default styles */
body, html {
    margin: 0;
    padding: 0;
    background-color: black;
}

/* Define styles for the parallax sections */
.parallax {
    height: 100vh;
    background-position: center;
    background-size: cover;
    display: flex;
    align-items: center;
    justify-content: center;
    color: black; /* Text color */
    font-size: 2rem; /* Adjust the font size as needed */
}

/* Style the parallax content */
.parallax-content {
    text-align: center;
}

/* Add a background image for section1 */
#section1 {
    background-image: url('img/trikiblinders3.jpg'); /* Replace with your band image */
    background-size: cover;
    background-position: top; /* Aligns the image to the top */
    background-attachment: fixed; /* Keeps the image fixed while content scrolls */
}

/* Style the band logo */
.logo img {
    width: 400px; /* Adjust the size as needed */
    height: auto;
    animation: fadeInUpLogo 2s ease-in-out; /* Add animation */
}

/* Style the animated text */
.animated-text img {
    width: 600px; /* Adjust the size as needed */
    height: auto;
    animation: fadeInUpTitre 2s ease-in-out; /* Add animation */
    margin-top: -80px;
}

@keyframes fadeInUpLogo {
    from {
        opacity: 0;
        transform: translateY(-80px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeInUpTitre {
    from {
        opacity: 0;
        transform: translateY(80px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Style the social media icons */
.social-icons {
    margin-top: 20px; /* Adjust the spacing as needed */
}

.social-icon {
    display: inline-block;
    margin: 0 10px; /* Adjust the spacing between icons */
    width: 100px; /* Adjust the width as needed */
    height: 100px; /* Adjust the height as needed */
}

.social-icon img {
    width: 100%;
    height: 100%;
}

/* Add the zoom effect on hover */
.social-icon:hover {
    transform: scale(1.1); /* Adjust the scale factor for the zoom effect */
}


/* Media query for responsive layout */
@media (max-width: 768px) {
    #section1 {
        /*background-image: url('img/trikiblinders3_alt.jpg'); /* Replace with your band image */
    }
    /* Style the band logo */
.logo img {
    width: 200px; /* Adjust the size as needed */
    
}

/* Style the animated text */
.animated-text img {
    width: 300px; /* Adjust the size as needed */
    margin-top: -40px;
}

.social-icon {
    display: inline-block;
    margin: 0 10px; /* Adjust the spacing between icons */
    width: 80px; /* Adjust the width as needed */
    height: 80px; /* Adjust the height as needed */
}

}

/* Media query for responsive layout */
@media (max-height: 768px) {
    #section1 {
        /*background-image: url('img/trikiblinders3_alt.jpg'); /* Replace with your band image */
    }
    /* Style the band logo */
.logo img {
    width: 200px; /* Adjust the size as needed */
    
}

/* Style the animated text */
.animated-text img {
    width: 300px; /* Adjust the size as needed */
    margin-top: -40px;
}

.social-icon {
    display: inline-block;
    margin: 0 10px; /* Adjust the spacing between icons */
    width: 80px; /* Adjust the width as needed */
    height: 80px; /* Adjust the height as needed */
}

}


/* Add styles for other sections as needed */