* {
    box-sizing: border-box; /* Include padding and border in the element's dimensions */
}

body {
    font-family: Arial, sans-serif;
    display: flex;
    justify-content: center; /* Center content horizontally */
    align-items: center; /* Center content vertically */
    height: 100vh;
    margin: 0;
    background-color: #f0f0f0;
    overflow: hidden; /* Hide any overflow, preventing scroll bars */
}

.video {
    position: fixed;
    top: 0;
    right: 0;
    width: 50vw; /* Covers half the viewport width */
    height: 100vh; /* Covers the full viewport height */
    object-fit: cover; /* Ensures the video covers the assigned area fully */
    z-index: -1; /* Keeps the video behind other content */
}

.rolodex {
    display: flex;
    flex-direction: column;
    align-items: center;
    overflow: hidden;
    width: 800px; /* Width of the rolodex */
    height: 600px; /* Height of the rolodex */
    position: relative; /* Allows precise positioning within the flex container */
    margin: 0; /* Ensure no external margins affect the layout */
}

#card28DM img {
    transition: transform 0.3s ease;
}

#card28DM img:hover {
    transform: scale(1.6) translateY(-108px) translateX(108px);
}

#card66 img {
    transform: translateY(128px);
}


.card {
    position: absolute;
    width: 100%;
    height: 100%;
    background: transparent;
    .card { box-shadow: none !important; }
    border-radius: 0px; /* No rounded corners */
    transition: transform 0.5s, z-index 0.5s;
    transform-origin: bottom center;
    cursor: pointer;
    padding: 0; /* Remove any padding */
    margin: 0; /* Remove any margin */
}

.card img {
    width: 100%;
    height: 100%;
    object-fit: contain; /* Make sure the image fits within the card */
}

button {
    padding: 10px 20px;
    font-size: 16px;
    cursor: pointer;
    position: relative;
    z-index: 10;
}

rotcoin6 {
    width: 40%; /* Adjust this to enlarge the image */
    height: auto; /* Maintain the aspect ratio */
    bottom: -64px; /* Position the image at the bottom */
    left: 84px; /* Move the image to the right  */
}

.dm15slide {
    position: relative;
    left: 216px;
    top: 156px;
}


