A:link {COLOR: #491813;TEXT-DECORATION: none; FONT-WEIGHT: bold; cursor: url('../main/cursor/cursorD.gif') 6 2, pointer;}
A:visited {COLOR: #491813; TEXT-DECORATION: underline; FONT-WEIGHT: bold; cursor: url('../main/cursor/cursorD.gif') 6 2, pointer;}
A:active {COLOR: #491813; TEXT-DECORATION: none; FONT-WEIGHT: bold; cursor: url('../main/cursor/cursorD.gif') 6 2, pointer;}
A:hover {COLOR: #491813; TEXT-DECORATION: underline; FONT-WEIGHT: bold; cursor: url('../main/cursor/cursorD.gif') 6 2, pointer;}

A.white_link: {color:white;}
A.white_link:link {text-decoration: none; color: white;}
A.white_link:visited {text-decoration: none; color: white;}
A.white_link:hover {text-decoration: underline; color: white;}
A.white_link:active {text-decoration: none; color: white;}

BODY {margin=5; SCROLLBAR-FACE-COLOR: #FFFFFF; FONT-WEIGHT: normal; 
  SCROLLBAR-HIGHLIGHT-COLOR: #FFFFFF; 
  SCROLLBAR-SHADOW-COLOR: #FFFFFF; 
  COLOR: #666666 ; /*#666666; */
  FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif; 
  SCROLLBAR-3DLIGHT-COLOR: #AAAAAA; 
  SCROLLBAR-ARROW-COLOR: #999999; 
  SCROLLBAR-TRACK-COLOR: #EEEEEE; 
SCROLLBAR-DARKSHADOW-COLOR: #555555;}

/* { cursor: url('../main/cursor/cursorD.gif'), auto; }*/

BODY, a, button, input[type="submit"], input[type="button"], .clickable, [role="button"], [onclick] {
  cursor: url('../main/cursor/cursorP.gif') 6 2, pointer;}

   .cl_borger img {border: 2px solid #666666; border-radius: 4px; /*transparent Прозрачная рамка для картинок */ }
   .cl_borger img:hover {border-color: #ffb400; border-radius: 4px;}

.small {COLOR: #491813; FONT-SIZE: 10pt; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif;}
.smalls {COLOR: #000000; background-color: #e3eaff; FONT-SIZE: 10pt; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif;}
.large {COLOR: #000000; FONT-SIZE: 12pt; FONT-FAMILY: Arial, Helvetica, sans-serif}
.big {COLOR: #491813; FONT-SIZE: 20pt; FONT-WEIGHT: bold; FONT-FAMILY: Arial, Helvetica, sans-serif}
.title_h3{FONT-SIZE: 16pt; FONT-WEIGHT: bold; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif}
.menub {COLOR: #000000; FONT-SIZE: 12pt; line-height: 16px; FONT-WEIGHT: bold;}

.smalls12 {COLOR: #000000; background-color: #e3eaff; FONT-SIZE: 10pt; FONT-FAMILY: Arial, Helvetica, sans-serif;}
.smalls02 {COLOR: #000000; background-color: #ffedc7; FONT-SIZE: 10pt; FONT-FAMILY: Arial, Helvetica, sans-serif;}
.smalls03 {COLOR: #000000; background-color: #f3ffe1; FONT-SIZE: 10pt; FONT-FAMILY: Arial, Helvetica, sans-serif;}
.abzac {text-indent: 30px;}

.micro {COLOR: #000000; FONT-SIZE: 8pt; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif;}

.munch_core_set  {text-align: left; padding-left: 30px; font-size: 25px;}
.munch_accessories    {text-align: left; padding-left: 30px; font-size: 25px;}
.munch_expansions      {text-align: left; padding-left: 30px; font-size: 25px;}
.munch_envelope  {text-align: left; padding-left: 30px; font-size: 25px;}
.munch_miniexpansions       {text-align: left; padding-left: 30px; font-size: 25px;}
.munch_standalone_games   {text-align: left; padding-left: 30px; font-size: 25px;}
.munch_promo       {text-align: left; padding-left: 30px; font-size: 25px;}
.munch_bonus       {text-align: left; padding-left: 30px; font-size: 25px;}

/*>>>Styled to cards main menu sheets */
#main_menu_card_container {
	display: flex;
    width: 1024px;
	height: 140px;
    margin: auto;
    position: relative;
    align-items: flex-end;
    justify-content: center;
    align-content: flex-end;
    flex-direction: row;
    flex-wrap: nowrap;
	/*border: 1px solid #fff; */

}

/* Shared card styles */
.main_menu_card_out  {
	COLOR: #491813;TEXT-DECORATION: none; FONT-WEIGHT: bold;
	cursor: url('../main/cursor/cursorP.gif') 6 2, pointer;
	/*width :191px;
	/*width: calc(16.7% - 10px); /* reduce to padding: 10px*/
    height: 42%;
    position: absolute;
	
	padding: 20px 20px 0px 20px;
	
	border-radius:  20px 20px 0px 0px; 
	/*border: 20px 20px 0px 0px ;*/
    border-top-width: 20px solid #491813;
    border-right-width: 20px solid #491813;
	border-bottom-width: 0px;	
    border-left-width: 20px solid #491813;
    
	background: #491813; 
	
    text-align: center;
    font-family: sans-serif;
    /*width: 162px; /* We'll calculate this below */

    transition: all 0.9s ease;

    /*z-index: 1;*/
}

.main_menu_card_inn {

	justify-content: center;    /* Horizontally center items */ 
	
	padding: 10px 15px 0px 15px; 
	height: calc(100% - 10px); /* reduce to padding: 10px*/
	border-radius: 15px 15px 0px 0px; 
	border: 0px ;
	background: #fff3e5;
}


/* Active card */
.main_menu_card_out#thisPage {
	/*cursor: auto;*/
	height: calc(100% - 20px); /* reduce to padding: 20px*/ /*tall one*/

	border-Left  : 1px solid #fff; 
	border-Right : 1px solid #fff;
	  
	font-size: 16pt;
}

/* Hover effect for inactive cards */
.main_menu_card_out:not(#thisPage):hover {
    height: calc(80% - 20px); /* reduce to padding: 20px*/ /*tall one*/ /*change one*/
    font-size: 14pt;
}

/* This will be applied by JS */
.main_menu_card_out .hover-left:hover {
  transform: translateX(-20px); /*change in js*/
}
.main_menu_card_out#leftPage:hover {
  transform: translateX(-20px); /*change in js*/
}

.main_menu_card_out .hover-right:hover {
  transform: translateX(20px); /*change in js*/
}
.main_menu_card_out#rightPage:hover {
  transform: translateX(20px); /*change in js*/
}
/*<<< Styled to cards main menu sheets */


/*>>> STYLED SELECT BOX */

/*background-color: #c3c7cb;  Typical Win98 gray */

/* Container for multiple dropdowns and text */
.dropdown-container {
    display: flex; /* Align elements horizontally */
    align-items: center; /* Vertically center text and dropdowns */
    gap: 10px;  /*Add spacing between elements */
    font-size: 14px;
    /*background-color: #c3c7cb;  Typical Win98 gray */
    margin: 20px;
    color: #000;
}

/* Dropdown container */
.win98-dropdown {
    position: relative;
    display: inline-block;
    border: 2px solid #b0b0b0;
    border-right-color: #ffffff;
    border-bottom-color: #ffffff;
    background-color: #e4e4e4;
	
    box-shadow: 1px 1px 0px #fff inset, -1px -1px 0px #7d7d7d inset;
	 z-index: 1000;
}

/* Styled dropdown label (button) */
.selected {
    padding: 5px 10px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    white-space: nowrap;
	 z-index: 1000;

}
.win98-dropdown > .selected {
    padding: 5px 10px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    white-space: nowrap;
}

/* Triangle arrow for dropdown */
.win98-dropdown > .selected::after {
    content: "";
    width: 0;
    height: 18px;
	align-items: center;
    /*border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 6px solid #000;  Black triangle */
    margin-left: 10px;
	z-index: 1000;
}

/* Dropdown options (hidden by default) */
.win98-dropdown ul {
    display: none;
    position: absolute;
    top: 100%;
    left: 5px;
    margin: 0;
    padding: 0;
    list-style: none;
    border: 2px solid #b0b0b0;
    border-right-color: #ffffff;
    border-bottom-color: #ffffff;
    background-color: #e4e4e4;
	box-shadow: 1px 1px #fff inset, -1px -1px 0px #7d7d7d inset;
    z-index: 1000;
}

/* Change button color when hovering over the dropdown list */
.win98-dropdown:hover .selected {
	/*padding: 5px 10px;*/
	height: 18px;
    background-color: #d6d6d6;
	 z-index: 10;
}

/* Show dropdown on hover */
.win98-dropdown:hover ul {
    display: block;
}

/* Dropdown option styling */
.win98-dropdown ul li {
	display: block;
    height: 30px;
    background-color: #e4e4e4;
	border-left: 3px solid #e4e4e4;
	border-right: 3px solid #e4e4e4;
	border-top: 3px solid #e4e4e4;
	border-bottom: 3px solid #e4e4e4;
	
}

/* Links inside dropdown options */
.win98-dropdown ul li a {
    display: block; /* Makes the entire li clickable */
	position: relative;
    text-decoration: none;
    color: #000;
	height: 100%;
	padding: 5px 10px;
    white-space: nowrap; /* Prevents text wrapping */
	z-index: 1000;
}

/* Show dropdown on hover */
.win98-dropdown:hover ul {
    display: block;
}

/* Dropdown option styling 
.win98-dropdown ul li {
    padding: 5px 10px;
	border: 3px solid #e4e4e4; /* это связано со .win98-dropdown ul li:hover { и его border свойством
}*/


/* Hover effect for options */
.win98-dropdown ul li:hover {
    background-color: #d6d6d6;
	border-left: 3px solid #b0b0b0;
	border-right: 3px solid #b0b0b0;
	border-top: 3px solid #b0b0b0;
	border-bottom: 3px solid #fff;
	z-index: 1000;
}
/*<<< END STYLED SELECT BOX */


.munch_table_out {
	background: #9c9652; /* Цвет фона */
	padding: 5px; /* Поля вокруг текста */
	border-radius: 20px; /* Уголки */
	border: 20px solid #9c9652; /* Параметры контура */
}
.munch_table_inn {
	background: #dddddd url(../main_menu/mt_bg.jpg) top left ; /* Цвет фона */
	padding: 5px; /* Поля вокруг текста */
	border-radius: 15px; /* Уголки */
	border: 0px /* Параметры контура */
}

.munch_table_fantasy_out { background: #491813; padding: 5px; border-radius: 20px; border: 20px solid #491813; }
.munch_table_fantasy_inn { background: #fff3e5; padding: 5px; border-radius: 15px; border: 0px }

.munch_table_gold_out {background: #9c9652; padding: 5px; border-radius: 20px; border: 20px solid #9c9652; }
.munch_table_gold_inn {background: #dddddd url(bg/mt_bg.jpg) top left ; padding: 5px; border-radius: 15px; border: 0px}


#dataContainer {
	width: 800px;
	/*border: 20px solid #9c9652; /* Параметры контура */
}

#cloud-circle {
width: 500px;
height: 275px;
border-radius: 50%;
filter: url(#filter);
box-shadow: 400px 400px 60px 0px #fff;
position: absolute;
top: -320px;
left: -320px;
}

