* {
    --mobileThumbSize: 25px;
}

/* Smartphones vertical */
@media (max-width: 575.98px) {
    .bottomRightButtons {
        /* align-items: flex-start; */
        top: auto !important;
        bottom: -70px !important;
        transition: bottom 500ms ease-in-out !important;
    }

    .bottomRightButtons.visible {
        bottom: 5px !important;
    }

    .bottomRightButtons>div {
        margin: 5px;
    }

    .bottomRightButtons>div:nth-child(2) {
        margin-right: 10px;
    }

    .infobox {
        width: calc(100% - 10px) !important;
    }
}

/* Smartphones horizontal */
@media (max-height: 575.98px) {
    .menuTop {
        display: none !important;
    }

    .menuCloseButton {
        display: none !important;
    }

    .menuCenter {
        top: 0 !important;
        height: calc(100% - 95px) !important;
    }
}

/* Smartphones horizontal or vertical */
@media (max-width: 1023px) {

    /* Theumbnails */
    .bottomClonerText,
    .bottomCLonerGrayFilter,
    .bottomClonerImage,
    .bottomCLonerGradient {
        display: none !important;
    }

    .bottomCloner {
        justify-content: flex-start !important;
        left: 10px !important;
    }

    .bottomCloner>div {
        width: var(--mobileThumbSize) !important;
        height: var(--mobileThumbSize) !important;
    }

    .bottomClonerItem {
        border-radius: 50% !important;
        background-color: #00000080 !important;
        background-color: var(--colorBeige) !important;
    }

    .bottomClonerVisited {
        top: 50% !important;
        left: 50% !important;
        transform: translate(-50%, -50%) !important;
        box-shadow: none !important;
        background: none !important;
        display: flex !important;
        align-items: center;
        justify-content: center;
    }

    .bottomClonerVisited .ggskin_svg {
        width: 80% !important;
        height: 80% !important;
        left: 0 !important;
        top: 0 !important;
        position: relative !important;
    }

    .bottomClonerVisited .ggskin_svg img {
        width: 100% !important;
        height: 100% !important;
        display: block;
        filter: invert(100%);
    }

    .showHideThumbs {
        display: none !important;
    }

    .bottomClonerItem.active {
        box-shadow: 0 0 0 3px #ffffff80 !important;
        background-color: var(--colorRed) !important;
        opacity: 0.7 !important;
    }

    .bottomClonerItem.active .ggskin_svg img {
        filter: none;
    }

    /* Theumbnails */
}