* {
    scroll-behavior: smooth;
}
:root {
    --cards: 4;
    --cardHeight: auto;
    --cardTopPadding: 1.5em;
    --cardMargin: 4vw;
}

.container {
    width: 90%;
    margin: 0 auto;
}

#cards {
    list-style: none;
    padding-left: 0;
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--cardMargin);
    padding-bottom: calc(var(--cards) * var(--cardTopPadding));
    margin-bottom: var(--cardMargin);
}

#card1 {
    --index: 1;
}
#card2 {
    --index: 2;
}
#card3 {
    --index: 3;
}
#card4 {
    --index: 4;
}

.card {
    position: sticky;
    top: 0;
    /* padding-top: calc(var(--index) * var(--cardTopPadding)); */
}

.card-body {
    box-sizing: border-box;
    /* height: var(--cardHeight); */
    transition: all 0.5s;
    display: flex;
    justify-content: center;
}

.card-content {
    border-radius: 1rem;
    /* width: 92%; */

    background-color: white;
}

.Rillakumacard-content {
    border-radius: 1rem;
    width: 92%;
    background-color: white;
}

/* Translate button Css */
.navbar {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 1rem;
}
.dropdown-container {
	position: relative;
	display: inline-block;
	margin-right: 1.5rem; /* Adjust margin as needed */
}
.dropdown-button {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	width: 3rem;
	height: 3rem;
	border-radius: 50%;
	border: 1px solid #ccc;
	background-color: white;
	cursor: pointer;
}
.dropdown-menu {
	display: none;
	position: absolute;
	right: 0;
	top: 3.5rem;
	z-index: 10;
	width: 12rem;
	background-color: white;
	border: 1px solid rgba(0, 0, 0, 0.1);
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
	border-radius: 0.5rem;
}
.dropdown-menu a {
	display: block;
	padding: 0.75rem 1rem;
	color: #333;
	text-decoration: none;
}
/* .dropdown-menu a:hover {
	background-color: #f0f0f0;
} */
.dropdown-menu.show {
	display: block;
}
.hide-scroll::-webkit-scrollbar {
    display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
.hide-scroll {
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
}
