#topMenuContainer{
	margin-top:10px;
}

.button-container {
    position: relative;
    display: inline-block;
    text-align: left;
    margin-right: 10px; /* Optional: Add some spacing between the buttons */
}

.button-value {
    position: absolute;
    top: 30%;
    right: 20%;
    color: #000; /* Optional: Text color for the value */
    padding: 3px 6px;
}

.settings-container {
    position: relative;
    display: inline-block;
    text-align: right;
	float: right; /* Align the settings container to the right */
	margin-top:10px;
}

.button-container:hover, .settings-container:hover {
    cursor: pointer;
	opacity:0.8;
}

.friends-container {
    position: relative;
    display: inline-block;
    text-align: left;
    margin-right: 10px; /* Optional: Add some spacing between the buttons */
}

.friends-container:hover {
    cursor: pointer;
	opacity:0.8;
}


#mainMenuContainer{
	text-align:center;
	margin-top:80px;
}

#startBetButtonID{
	text-align:center;
	padding:10px;
}

#startBetButtonID:hover{
	cursor:pointer;
	opacity:0.8;
}







#challengeMenu1ButtonsID{
	text-align:center;	
	padding:10px;
}

#challengeMenu1ButtonsID:hover{
	cursor:pointer;
	opacity:0.8;
}



/* Friend Challenge Menu Styling Start */

.challengeFriendMenuStartClass{
	display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.8); /* White semi-transparent background */
    justify-content: center;
    align-items: center;
	z-index:999;
}

#challengeFriendMenuStart{
	
}

#popupMessageFriendChallengeTitle{
	font-size:24px;
	text-align:center;
}

#friendChallengeDescTop{
	font-size:14px;
	text-align:center;
}

#friendChallengeMenuPopButtonID:hover{
	cursor:pointer;
	opacity:0.8;
}

/* Friend Challenge Menu Styling End */





/* Look for random Challenge Menu Styling Start */

.challengeLookRandomMenuStartClass{
	display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.8); /* White semi-transparent background */
    justify-content: center;
    align-items: center;
	z-index:999;
}

#lookForRandomChallengeMenuStart{
	
}

#popupMessageLookRandomChallengeTitle{
	font-size:24px;
	text-align:center;
}

#userProfileImageID{
	position: relative;
    display: inline-block;
	margin-right:18px;
	margin-top:-85px;
}

#randomChallengeInfoTextID{
	position: relative;
    display: inline-block;
	top:-15px;
	border: 1px solid #ccc; 
	border-radius:5px;
	padding:10px;
}

#friendlyChallengeInfoTextID{
	position: relative;
    display: inline-block;
	top:-15px;
	border: 1px solid #ccc; 
	border-radius:5px;
	padding:10px;
}

#randomChallengeTextInfoID{
	position: relative;
    display: inline-block;
	font-size:16px;
}

#friendChallengeFTextInfoID{
	position: relative;
    display: inline-block;
	font-size:16px;
	padding-right:5px;
}

#userTextInfoValue{
	position: relative;
    display: inline-block;
	font-size:16px;
}

#userFriendPickTextInfoValue{
	position: relative;
    display: inline-block;
	font-size:16px;
}

#gameTextInfoValue{
	position: relative;
    display: inline-block;
	font-size:16px;
}


#userTextInfoValueFriAccChal{
	position: relative;
    display: inline-block;
	font-size:16px;
}

#gameTextInfoValueFriAccChal{
	position: relative;
    display: inline-block;
	font-size:16px;
}



#gameFriendPickTextInfoValue{
	position: relative;
    display: inline-block;
	font-size:16px;
}

#betTextInfoValue{
	position: relative;
    display: inline-block;
	font-size:16px;
}

#betTextInfoValueFriAccChal{
	position: relative;
    display: inline-block;
	font-size:16px;
}

#gamesPlayedTextInfoValue{
	position: relative;
    display: inline-block;
	font-size:16px;
}

#shortLineBreak{
	margin-top:-18px;
}

#randomChallengeUserElementFull{
	padding:5px;
	padding-left:20px;
	padding-right:20px;
}

#randomChallengeUserElementFull:hover{
	cursor:pointer;
	opacity:0.8;
}

/* Look for random Challenge Menu Styling End */

/* Start random Challenge Menu Styling */

.challengeStartRandomMenuStartClass {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.8); /* White semi-transparent background */
    justify-content: center;
    align-items: center;
    z-index: 999;
}


.popup-content-scroll {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    max-height: 80%; /* Set a maximum height for the popup */
    overflow-y: auto; /* Enable vertical scrolling if content overflows */
    background: rgba(0, 0, 0, 0.8); /* Black/Grey semi-transparent background */
    padding: 20px;
    border-radius: 5px;
    color: #fff; /* Text color for the popup content */
    z-index: 999;
    
    scrollbar-width: thin;
    scrollbar-color: #888 #5B5B5B;
}

.popup-content-scroll-friendChalAcc {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    max-height: 80%; /* Set a maximum height for the popup */
    overflow-y: auto; /* Enable vertical scrolling if content overflows */
    background: rgba(0, 0, 0, 0.8); /* Black/Grey semi-transparent background */
    padding: 20px;
    border-radius: 5px;
    color: #fff; /* Text color for the popup content */
    z-index: 999;
    
    scrollbar-width: thin;
    scrollbar-color: #888 #5B5B5B;
}

/* Optional media queries for fine-tuning on different screen sizes */
@media (max-width: 768px) {
    .popup-content-scroll {
        width: 90%;
    }

    #centerGameIconOnSmartphoneID {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .gameIconStartRandomChallengeMenu {
        float: none; /* Ensure float is not applied on mobile */
        margin: 0 auto; /* Center the image within the flex container */
    }
}

@media (max-width: 1170px) {
    .popup-content-scroll {
        width: 80%;
    }

    #centerGameIconOnSmartphoneID {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .gameIconStartRandomChallengeMenu {
        float: none; /* Ensure float is not applied on tablet */
        margin: 0 auto; /* Center the image within the flex container */
    }
}

@media (min-width: 1180px) {
    .gameIconStartRandomChallengeMenu {
        position: relative;
        display: inline-block;
        float: left;
        margin-right: 20px;
    }
}

.popup-content-scroll-friendChalAcc:hover {
    scrollbar-color: #888 #5B5B5B;
}


.popup-content-scroll:hover {
    scrollbar-color: #888 #5B5B5B;
}





#popupMessageStartRandomChallengeTitle {
    font-size: 24px;
    text-align: center;
}

.gameMenuContainer {
    text-align: center;
    margin-bottom: 5px; /* Add margin between game entries */
	Padding:20px;
	border: 1px solid #ccc; /* Optional: Add borders for better visibility */
	border-radius:10px;
}

.gameMenuContainer:hover {
    cursor:pointer;
	opacity:0.8;
}

.gameInfoTextStartRandomChallenge {
    position: relative;
    display: inline-block;
	margin-top:15px;
}

.randomChallengeStartMenuGameTitle {
    font-weight: bold;
    margin: 0; /* Remove default margin for paragraphs */
}

/* Scrollbar Track */
.popup-content-scroll::-webkit-scrollbar {
    width: 8px; /* Set the width of the scrollbar */
}

/* Handle on hover */
.popup-content-scroll::-webkit-scrollbar-thumb:hover {
    background: #555; /* Change color on hover */
}

/* Handle */
.popup-content-scroll::-webkit-scrollbar-thumb {
    background: #888; /* Set the color of the scrollbar handle */
}

/* Handle on active state */
.popup-content-scroll::-webkit-scrollbar-thumb:active {
    background: #666; /* Change color on click */
}

/* Track */
.popup-content-scroll::-webkit-scrollbar-track {
    background: #5B5B5B; /* Set the color of the scrollbar track */
}

/* Track on hover */
.popup-content-scroll::-webkit-scrollbar-track:hover {
    background: #5B5B5B; /* Change color on hover */
}

/* Start random Challenge Menu Styling End*/



/* Accept friend challenge menu start */

.challengeFriendAcceptMenuClass{
	display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.8); /* White semi-transparent background */
    justify-content: center;
    align-items: center;
    z-index: 999;
	
	flex-direction: column; /* Ensures child divs are stacked vertically */
}

#centerChallengeMenuItemsID{
	text-align:center;
}

#acceptChalButID{
	position: relative;
    display: inline-block;
}

#acceptChalButID:hover{
	cursor:pointer;
	opacity:0.8;
}

#passChalButID:hover{
	cursor:pointer;
	opacity:0.8;
}

#passChalButID{
	position: relative;
    display: inline-block;
}

#mediumLineBreak{
	margin-top:-6px;
}

#randomChallengeTextInfoIDCenter{
	text-align:center;
}

/* END */

/* Start friend challenge menu start */

.challengeFriendStartChalMenuClass{
	display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.8); /* White semi-transparent background */
    justify-content: center;
    align-items: center;
    z-index: 999;
}

#challengeFriendStartChalMenuID{
	
}

#userIconFriendImageID{
	position: relative;
    display: inline-block;
	margin-top:-30px;
	margin-right:8px;
}

#friendChallengeStartInfoTextID{
	position: relative;
    display: inline-block;
}

#userContainerFriendID{
	padding:10px;
	border: 1px solid #ccc; /* Optional: Add borders for better visibility */
	border-radius:10px;
}

#userContainerFriendID:hover{
	cursor:pointer;
	opacity:0.8;
}

/* END */

/* Start Friend Challenge Select Game */

.challengeStartFriendChallengeGameSelectMenuStartClass{
	display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.8); /* White semi-transparent background */
    justify-content: center;
    align-items: center;
    z-index: 999;
}

#challengeStartFriendChallengeGameSelectMenuStartID{
	
}

/* END */

/* Accept game friend start challenge small Menu */

.challengeFriendMenuAcceptChalClass{
	display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.8); /* White semi-transparent background */
    justify-content: center;
    align-items: center;
    z-index: 999;
}

#challengeFriendMenuAcceptChalID{
	
}

#accFriendGameChalStartGameMenuGameSectionID{
	text-align:center;
	padding:10px;
	border: 1px solid #ccc;
	border-radius:10px;
}

#friendChalAccGameIconID{
	position: relative;
    display: inline-block;
	margin-right:10px;
}

#randomChalAccGameIconID{
	position: relative;
    display: inline-block;
	margin-right:10px;
}

#randomChalAccCurIconID{
	position: relative;
    display: inline-block;
	margin-right:10px;
}

#gameTitlePopMenuID{
	position: relative;
    display: inline-block;
	font-size:20px;
	font-weight:bold;
}

#randomGameAcTitlePopMenuID{
	position: relative;
    display: inline-block;
	font-size:20px;
	font-weight:bold;
}

#accFriendGameChalStartGameMenuBetSectionID{
	text-align:center;
	padding:10px;
	border: 1px solid #ccc;
	border-radius:10px;
}

#smallSpaceTopThings{
	margin-top:15px;
}

#friendChalAccCurIconID{
	position: relative;
    display: inline-block;
	margin-right:10px;
}

#currencyBetValuePopMenuID{
	position: relative;
    display: inline-block;
	font-size:20px;
	font-weight:bold;
}

#randomGameACcurrencyBetValuePopMenuID{
	position: relative;
    display: inline-block;
	font-size:20px;
	font-weight:bold;
}

#startChalMenuPopButton{
	text-align:center;
}

#startChalMenuPopButton:hover{
	cursor:pointer;
	opacity:0.8;
}

/* END */

/* Start Random Challenge Pick Bet Menu Start */


.pickBetStartRandomChalMenuClass{
	display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.8); /* White semi-transparent background */
    justify-content: center;
    align-items: center;
    z-index: 999;
}

#pickBetStartRandomChalMenuID{
	
}


/* END */

/* Start Friend Chal Pick Bet Menu Start */

.pickBetStartFriendChalMenuClass{
	display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.8);
    justify-content: center;
    align-items: center;
    z-index: 999;
}

#pickBetStartFriendChalMenuID{
	
}

/* END */

/* Accept Random Challenge Start Game Menu */



.challengeRandomMenuAcceptChalClass{
	display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.8);
    justify-content: center;
    align-items: center;
    z-index: 999;
}

#challengeRandomMenuAcceptChalID{
	
}



/* END */