
             .card {
                transition: transform 0.3s;
                box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
                margin-bottom: 40px; /* Adjust as needed */
            }

            .card:hover {
                transform: translateY(-20px);
            }

            .btn-danger {
                    background-color: #dc3545; /* Red color */
                    border-color: #dc3545; /* Red color */
                }

                .btn-effect {
                    transition: transform 0.3s, box-shadow 0.3s;
                }

                .btn-effect:hover {
                    transform: translateY(-3px);
                    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
                }

                .black-background {
                    margin-top: 20px; /* Adjust as needed */
                    margin-bottom: 40px; /* Adjust as needed */
                }

section {
	background-color: #006eb5;
	width: 100%;
	display: flex;
	justify-content: center;
	padding: 10px;
}
.home_about_section {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 50%;
	padding: 8rem 0;
}

.home_about_section p {
	width: 95%;
	text-align: center;
	color: #fff;
	font-size: 1.8rem;
	font-weight: 600;
}
.intro {
	background-color: white;
}
.intro-section {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	width: 50%;
	padding: 4rem 0;
}
.intro-section h2 {
	font-size: 2.2rem;
	padding-bottom: 2rem;
}
.intro-section h5 {
	font-weight: lighter;
	font-size: 1.3rem;
	padding-bottom: 0.5rem;
	text-align: center;
}
.intro_buttom {
	width: 60%;
	text-align: center;
	font-size: 1.3rem;
	padding-top: 2rem;
}
.options p {
	text-align: center;
}
.intro_options {
	display: flex !important;
	flex-wrap: wrap !important;
	justify-content: space-between !important;
	align-items: center !important;
	flex-direction: column;
	gap: 0.9em;
}
.intro_options span {
	width: 100%;
	display: flex;
	justify-content: center;
}
.intro_icons {
	width: 2rem;
	height: 2rem;
	margin: 0.4rem 0;
}
.community_section {
	background-color: #006eb5;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	width: 50%;
	padding: 8rem 0;
	color: white;
}
.community_section h2 {
	font-size: 2rem;
	padding-bottom: 1rem;
}
.community_section p {
	text-align: center;
}
.community_section .links {
	color: white;
	padding-bottom: 3px;
	text-decoration: underline red;
}

@media screen and (max-width: 768px) {
	.home_about_section {
		width: 100%;
	}
	.intro-section {
		width: 100%;
	}
	.intro_buttom {
		width: 90%;
	}
	.community_section {
		width: 100%;
	}
}



/* CSS for text-container */
.text-container {
    padding: 40px;
	font-size: 16px;
}

/* CSS for black background section */
.black-background {
    background-color: black;
    color: white;
    padding: 60px 0;
}

.black-background h2,
.black-background p {
    color: white;
}


.item img {
	max-width: 100%;
	height: auto;
	animation: slideAnimation 10s infinite alternate;
}


.container {
  position: relative;
  max-width: 800px;
  margin: 0 auto;
}

        .section-content {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            color: white;
            text-align: center;
            z-index: 1; /* Keep the text on top of the video */
        }

                .blue-background {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 255, 0.5); /* Adjust opacity as needed */
        }
.container img {vertical-align: middle;}

.container .content {
  position: absolute;
  bottom: 0;
  background: rgb(0, 0, 0); /* Fallback color */
  background: rgba(0, 0, 0, 0.5); /* Black background with 0.5 opacity */
  color: #f1f1f1;
  width: 100%;
  padding: 20px;
}
}