html,
body {
    height: 100%;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

.iframe-container {
    width: 100%;
    height: 100%;
    /* top: -10%; */
    position: relative;
}

.iframe {
    top: -15%;
    width: 100%;
    height: 140%;
    border: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    /* z-index: 1; */
    position: relative;
}

/* Button container (positioned in the bottom-right) */
.button-container {
    position: fixed;
    display: flex;
    flex-direction: row;
    gap: 1vw;
    bottom: 2vw;
    /* Adjust for spacing */
    right: 2vw;
}

/* Button styling */
.icon-button {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #183661;
    border: none;
    border-radius: 15%;
    /* Slightly rounded */
    width: 8vw;
    /* Square shape */
    height: 8vw;
    /* Same as width */
    max-width: 80px;
    /* Limit max size */
    max-height: 80px;
    cursor: pointer;
    transition: 0.3s;
}

.icon-button img {
    width: 60%;
    /* Makes sure the icon scales within the button */
    height: auto;
    max-width: 50px;
    max-height: 50px;
}

/* Hover effect */
.icon-button:hover {
    background-color: #0056b3;
}

/* Media Query for smaller screens */
@media (max-width: 600px) {
    .icon-button {
        width: 12vw;
        height: 12vw;
    }

    .icon-button img {
        width: 70%;
    }
}