/* HEADER MENU */
#divAppHeader #btnHeaderMenu
{
	background-image:url('../images/icons/menu.svg');
	background-position:center;
	background-position:center;
	background-repeat:no-repeat;
	background-size:24px;
	cursor:pointer;
	display:none;
    float:left;
	height:40px;
	margin:5px 0px 0px 50px;
    filter: drop-shadow(0px 0px 5px #7262f2) drop-shadow(0px 0px 10px #7262f2);
    opacity: 1;
	transition:filter 0.25s, opacity 0.25s;
	width:40px;
}

#divAppHeader #btnHeaderMenu:hover
{
	filter:drop-shadow(0px 0px 5px #e600ff);
	opacity:1;
}

.hideMenu #divAppHeader #btnHeaderMenu
{
	display:inline-block;
}

/* MAIN MENU */
#divAppMenu
{
	bottom:0px;
	left:0px;
	position:fixed;
	top:0px;
	transition:left 0.25s;
	user-select:none;
	-webkit-tap-highlight-color:rgba(0, 0, 0, 0);
	width:320px;
	z-index:3;
}

.hideMenu #divAppMenu
{
	left:-340px;
}

#divAppMenu #divMenuOverlay
{
	background-color:rgba(0, 0, 0, 0.5);
	display:none;
	height:100%;
	left:0px;
	opacity:0;
	position:fixed;
	top:0px;
	transition:opacity 0.25s;
	width:100%;
	z-index:-1;
}

#divAppMenu .divMenuContainer
{
	background-color:#292a2f;
	box-shadow:-10px 0px 30px rgba(0, 0, 0, 0.75);
	height:100%;
	left:0px;
	position:absolute;
	top:0px;
	width:100%;
	z-index:-1;
}

#divAppMenu .divMenuHeader
{
	height:105px;
	position:relative;
}

#divAppMenu #imgMenuLogo
{
	cursor:pointer;
	left:30px;
	position:absolute;
	top:25px;
	width:200px;
}

#divAppMenu #btnCloseMenu
{
	cursor:pointer;
	height:40px;
	position:absolute;
	right:10px;
	top:10px;
	width:40px;
}

#divAppMenu #btnCloseMenu:before
{
	background-color:#ffffff;
	box-shadow:0px 0px 5px #7262f2;
	content:"";
	height:2px;
	left:8px;
	position:absolute;
	top:20px;
	transform:rotate(45deg);
	width:24px;
}

#divAppMenu #btnCloseMenu:after
{
	background-color:#ffffff;
	box-shadow:0px 0px 5px #7262f2;
	content:"";
	height:2px;
	left:8px;
	position:absolute;
	top:20px;
	transform:rotate(-45deg);
	width:24px;
}

#divAppMenu #divMenuItemsContainer
{
	height:calc(100% - 100px);
	overflow-y:auto;
	padding-top:15px;
	-webkit-overflow-scrolling:touch;
}

#divAppMenu #divMenuItemsContainer::-webkit-scrollbar
{
	background:transparent;
	height:0px;
	width:0px;
}

#divAppMenu #divFeaturedItems
{
	background:transparent;
	border-radius:12px;
	filter:drop-shadow(0px 0px 8px rgba(160, 80, 255, 0.2)) drop-shadow(0px 0px 22px rgba(160, 80, 255, 0.05));
	margin:20px 15px 15px;
	min-height:185px;
	padding:5px 0px;
	position:relative;
}

#divAppMenu #divFeaturedItems:before
{
	color:#ffffff;
	content:"FEATURED";
	font-family:"JostBold", sans-serif;
	font-size:18px;
	font-weight:600;
	left:0px;
	position:absolute;
	right:0px;
	text-align:center;
	text-shadow:0px 0px 10px rgba(220, 160, 255, 0.7), 0px 1px 2px rgba(0, 0, 0, 0.8);
	top:-12px;
	z-index:1;
}

#divAppMenu #svgFeaturedBorder
{
	height:calc(100% + 26px);
	left:0;
	overflow:visible;
	pointer-events:none;
	position:absolute;
	top:-26px;
	width:100%;
	z-index:0;
}

#divAppMenu #btnMaldivesTrip
{
	background-image:url('../images/menu/maldivesTrip.webp');
	background-position:center;
	background-repeat:no-repeat;
	background-size:cover;
	border-radius:10px;
	box-shadow:inset 0px 20px 10px -20px rgba(255, 255, 255, 0.75), inset 0px -20px 10px -20px rgba(0, 0, 0, 0.75), 0px 0px 10px rgba(0, 0, 0, 0.5);
	cursor:pointer;
	float:left;
	height:70px;
	margin:20px 10px 15px 15px;
	padding-top:85px;
	position:relative;
	width:calc(50% - 25px);
}

#divAppMenu #btnLuckyStreakChallenge
{
	border-radius:10px;
	box-shadow:0px 0px 10px rgba(0, 0, 0, 0.5);
	color:#ffffff;
	cursor:pointer;
	float:left;
	height:40px;
	margin:20px 15px 15px 10px;
	padding-top:115px;
	position:relative;
	text-align:center;
	text-shadow:0px 0px 5px #000000;
	width:calc(50% - 25px);
}

#divAppMenu #btnLuckyStreakChallenge:before
{
	background-image:url('../images/menu/luckyStreakChallenge.webp');
	background-position:center;
	background-size:cover;
	border-radius:10px;
	box-shadow:inset 0px 20px 10px -20px #ffffff, inset 0px -20px 10px -20px #000000;
	content:"";
	display:block;
	height:100%;
	left:0px;
	opacity:0.85;
	position:absolute;
	top:0px;
	width:100%;
}

#divAppMenu #btnLuckyStreakChallenge:after
{
	background-image:url('../images/promotions/luckyStreakChallenge/luckyStreakHeading.webp');
	background-repeat:no-repeat;
	background-size:cover;
	content:"";
	display:block;
	filter:drop-shadow(0px 0px 2px #000000);
	height:32px;
	left:5px;
	position:absolute;
	top:8px;
	width:calc(100% - 10px);
}

/*
	Scratch Cards featured tile. It carries the .btnPromotionButton class in menu.blade.php so it
	presents exactly like the Predictors tile - full width, image-led - rather than the half-width
	floated shape used by #btnMaldivesTrip / #btnLuckyStreakChallenge. The banner is 480x120, so
	aspect-ratio + height:auto lets the whole artwork show at any menu width instead of being
	cropped by the shared 60px height.
*/
#divAppMenu #btnScratchCards
{
	aspect-ratio:4 / 1;
	background-color:#2a1140;
	background-image:url('../images/menu/scratchCards.webp');
	background-size:cover;
	height:auto;
}

/*
	Lucky Sports featured tile - the sports-themed sister of the Scratch Cards tile above, and the
	same shape and treatment because the two are the same kind of thing in the same list. The
	banner is PLACEHOLDER artwork: it is the Scratch Cards banner copied, so the tile has something
	to show until the Lucky Sports banner is drawn. Replace the file, keep the name.
*/
#divAppMenu #btnLuckySports
{
	aspect-ratio:4 / 1;
	background-color:#2a1140;
	background-image:url('../images/menu/luckySports.webp');
	background-size:cover;
	height:auto;
}

#divAppMenu #divBirthdayBonusButton
{
	background-image:url('../images/promotions/birthdayBonuses/background.webp');
	background-position:center;
	background-size:105%;
    border-radius:10px;
    box-shadow:inset 0px 20px 10px -20px rgba(255, 255, 255, 0.75), inset 0px -20px 10px -20px rgba(0, 0, 0, 0.75), 0px 0px 10px rgba(0, 0, 0, 0.5);
    cursor:pointer;
    clear:both;
    display:none;
    height:60px;
    margin:15px 15px 10px;
    position:relative;
    width:calc(100% - 30px);
}

#divAppMenu #divBirthdayBonusButton.show
{
	display:block;
}

#divAppMenu #divBirthdayBonusButton:before
{
	background-image:url('../images/promotions/birthdayBonuses/heading.webp');
	background-position:center;
	background-repeat:no-repeat;
	background-size:75%;
	content:"";
	display:block;
	height:100%;
	left:0px;
	position:absolute;
	top:0px;
	width:100%;
}

#divAppMenu #divVipClaimedPromotionsButton
{
    background-image:url('../images/menu/vipClaimedPromotions.webp');
	background-position:center;
    background-repeat:no-repeat;
    background-size:cover;
    border-radius:10px;
    box-shadow:inset 0px 20px 10px -20px rgba(255, 255, 255, 0.75), inset 0px -20px 10px -20px rgba(0, 0, 0, 0.75);
    cursor:pointer;
    clear:both;
    display:none;
    filter:drop-shadow(0px 0px 10px rgba(0, 0, 0, 0.5));
	height:60px;
    margin:15px 15px 10px;
    position:relative;
    width:calc(100% - 30px);
}

#divAppMenu #divVipClaimedPromotionsButton.show
{
	display:block;
}

#divAppMenu #divPromotionButtons
{
	clear:both;
}

#divAppMenu .btnPromotionButton
{
	animation:menuNeonTextPink 5s linear 2.5s infinite;
    background-position:center top;
    background-repeat:no-repeat;
    background-size:100%;
    border-radius:10px;
    box-shadow:inset 0px 20px 10px -20px rgba(255, 255, 255, 0.75), inset 0px -20px 10px -20px rgba(0, 0, 0, 0.75), 0px 0px 10px rgba(0, 0, 0, 0.5);
    color:#ffffff;
    cursor:pointer;
    clear:both;
    font-family:"Bayshore", sans-serif;
    font-size:30px;
    height:60px;
    line-height:22px;
    margin:15px 15px 10px;
    position:relative;
    text-align:center;
    width:calc(100% - 30px);
}

#divAppMenu .btnPromotionButton span
{
	display:inline-block;
	margin-top:8px;
}

#divAppMenu #divMenuItems
{
	clear:both;
	padding-bottom:80px;
}

#divAppMenu #divMenuItems a
{
	text-decoration:none;
}

#divAppMenu .divMenuItemContianer
{
	position:relative;
}

#divAppMenu .divMenuItem
{
	margin-top:15px;
	position:relative;
}

#divAppMenu .divSubmenuItems
{
	display:none;
	position:relative;
}

#divAppMenu .expanded .divSubmenuItems
{
	display:block;
}

#divAppMenu .btnExpandCollapse
{
	cursor:pointer;
	height:40px;
	position:absolute;
	right:20px;
	top:10px;
	width:40px;
}

#divAppMenu .btnExpandCollapse:before
{
	background-color:#ffffff;
	content:"";
	height:2px;
	position:absolute;
	right:12px;
	top:19px;
	transition:background-color 0.25s, box-shadow 0.25s;
	width:16px;
}

#divAppMenu .btnExpandCollapse:after
{
	background-color:#ffffff;
	content:"";
	height:2px;
	position:absolute;
	right:12px;
	top:19px;
	transform:rotate(90deg);
    transition:background-color 0.25s, box-shadow 0.25s, transform 0.25s;
	width:16px;
}

#divAppMenu .expanded .btnExpandCollapse:after
{
	transform:rotate(0deg);
}

#divAppMenu .btnExpandCollapse:hover:before, #divAppMenu .btnExpandCollapse:focus:before, #divAppMenu .btnExpandCollapse:hover:after, #divAppMenu .btnExpandCollapse:focus:after
{
	background-color:#cffdff;
    box-shadow:0px 0px 5px #01eff9;
}

#divAppMenu .divSubmenuItem
{
	position:relative;
}

#divAppMenu .divMenuItem.clickable, #divAppMenu .divSubmenuItem.clickable
{
	cursor:pointer;
}

#divAppMenu .divMenuItem.clickable:before, #divAppMenu .divSubmenuItem.clickable:before
{
	background:linear-gradient(90deg, #6b42de, #966dff);
	bottom:0px;
	content:"";
	display:block;
	left:0px;
	opacity:0;
	position:absolute;
	right:0px;
	top:0px;
	transition:opacity 0.25s;
	z-index:-1;
}

#divAppMenu .divMenuItem.clickable:hover:before, #divAppMenu .divMenuItem.clickable:focus:before, #divAppMenu .divMenuItem.clickable.selected:before, #divAppMenu .divSubmenuItem.clickable:hover:before, #divAppMenu .divSubmenuItem.clickable:focus:before, #divAppMenu .divSubmenuItem.clickable.selected:before
{
	opacity:1;
}

.signedIn #divAppMenu .divSubmenuItem.menuItemLobbySignedOut
{
	display:none;
}

#divAppMenu .divMenuItem.menuItemWelcomePackage, #divAppMenu .divSubmenuItem.menuItemWelcomePackage
{
	display:none;
}

.showWelcomePackage #divAppMenu .divMenuItem.menuItemWelcomePackage, .showWelcomePackage #divAppMenu .divSubmenuItem.menuItemWelcomePackage
{
	display:block;
}

#divAppMenu .divSubmenuItem.menuItemFullOpacity .divSubmenuItemIcon
{
	opacity:1;
}

#divAppMenu .divMenuItemLabel
{
	color:#ffffff;
	font-family:"JostBold", sans-serif;
	font-size:22px;
	line-height:30px;
	overflow:hidden;
	padding:15px 35px;
	position:relative;
	text-overflow:ellipsis;
	white-space:nowrap;
}

#divAppMenu .divSubmenuItemLabel
{
	color:#888b90;
	font-size:20px;
	line-height:30px;
	overflow:hidden;
	padding:15px 35px 15px 80px;
	position:relative;
	text-overflow:ellipsis;
	transition:color 0.25s;
	white-space:nowrap;
}

#divAppMenu .divSubmenuItem.clickable:hover .divSubmenuItemLabel, #divAppMenu .divSubmenuItem.clickable:focus .divSubmenuItemLabel, #divAppMenu .divSubmenuItem.clickable.selected .divSubmenuItemLabel
{
	color:#ffffff;
}

#divAppMenu .divSubmenuItemIcon
{
	background-position:center;
	background-repeat:no-repeat;
	background-size:100%;
	left:35px;
	height:20px;
	opacity:0.4;
	position:absolute;
	top:50%;
	transform:translateY(-50%);
	transition:opacity 0.25s;
	width:20px;
}

#divAppMenu .divSubmenuItem.clickable:hover .divSubmenuItemIcon, #divAppMenu .divSubmenuItem.clickable:focus .divSubmenuItemIcon, #divAppMenu .divSubmenuItem.clickable.selected .divSubmenuItemIcon
{
	opacity:1;
}

#divAppMenu .divMenuItemHr
{
	background-color:#6a6a6a;
	height:2px;
	margin:15px 35px;
}

#divAppMenu .spnSubmenuItemBonusCount
{
    background-color:#ee0000;
    border-radius:50%;
    color:#ffffff;
	display:none;
    font-size:9px;
    height:14px;
    line-height:14px;
	margin:-5px 0px 0px 5px;
    padding: 2px 7px;
    position:absolute;
    text-align:center;
}

#divAppMenu .spnSubmenuItemBonusCount.show
{
	display:inline;
}

#divAppMenu .spnTournamentsAvailable
{
    background-color:#ee0000;
    border-radius:50%;
    color:#ffffff;
    font-size:9px;
    height:14px;
    line-height:14px;
	margin:-5px 0px 0px 5px;
    padding: 2px 7px;
    position:absolute;
    text-align:center;
}

/* FEATURED BUTTONS STROKE AND BOUNCE */
#divAppMenu .divFeaturedStroke:before
{
	animation:featuredStrokeSpin 2s linear 0s infinite, featuredStrokeLifecycle 5s ease-in-out 0s 1 forwards;
	background:conic-gradient(from var(--featured-stroke-angle) at 50% 50%, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 44%, #aa00ff 48.5%, #f0aaff 50%, #aa00ff 51.5%, rgba(0, 0, 0, 0) 56%, rgba(0, 0, 0, 0) 100%);
	border-radius:13px;
	content:"";
	display:block;
	inset:-3px;
	-webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	-webkit-mask-composite:xor;
	mask-composite:exclude;
	opacity:0;
	padding:3px;
	pointer-events:none;
	position:absolute;
}

#divAppMenu .divFeaturedStroke:after
{
	animation:featuredStrokeSpin 2s linear 0s infinite, featuredStrokeLifecycle 5s ease-in-out 0s 1 forwards;
	background:conic-gradient(from var(--featured-stroke-angle) at 50% 50%, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 38%, rgba(119, 0, 187, 0.5) 47%, rgba(204, 102, 255, 0.5) 50%, rgba(119, 0, 187, 0.5) 53%, rgba(0, 0, 0, 0) 62%, rgba(0, 0, 0, 0) 100%);
	border-radius:14px;
	content:"";
	display:block;
	filter:blur(20px);
	inset:-5px;
	opacity:0;
	padding:0px;
	pointer-events:none;
	position:absolute;
}

#divAppMenu #btnMaldivesTrip .divFeaturedStroke:before
{
	background:conic-gradient(from var(--featured-stroke-angle) at 50% 50%, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 44%, #00bb44 48.5%, #ccffdd 50%, #00bb44 51.5%, rgba(0, 0, 0, 0) 56%, rgba(0, 0, 0, 0) 100%);
}

#divAppMenu #btnMaldivesTrip .divFeaturedStroke:after
{
	background:conic-gradient(from var(--featured-stroke-angle) at 50% 50%, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 38%, rgba(0, 136, 51, 0.5) 47%, rgba(136, 255, 170, 0.5) 50%, rgba(0, 136, 51, 0.5) 53%, rgba(0, 0, 0, 0) 62%, rgba(0, 0, 0, 0) 100%);
}

#divAppMenu #btnLuckyStreakChallenge .divFeaturedStroke:before
{
	background:conic-gradient(from var(--featured-stroke-angle) at 50% 50%, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 44%, #ff7700 48.5%, #ffffff 50%, #ff7700 51.5%, rgba(0, 0, 0, 0) 56%, rgba(0, 0, 0, 0) 100%);
}

#divAppMenu #btnLuckyStreakChallenge .divFeaturedStroke:after
{
	background:conic-gradient(from var(--featured-stroke-angle) at 50% 50%, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 38%, rgba(204, 85, 0, 0.5) 47%, rgba(255, 204, 136, 0.5) 50%, rgba(204, 85, 0, 0.5) 53%, rgba(0, 0, 0, 0) 62%, rgba(0, 0, 0, 0) 100%);
}

#divAppMenu #divBirthdayBonusButton .divFeaturedStroke:before
{
	background:conic-gradient(from var(--featured-stroke-angle) at 50% 50%, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 44%, #ddaa00 48.5%, #88ddff 50%, #ddaa00 51.5%, rgba(0, 0, 0, 0) 56%, rgba(0, 0, 0, 0) 100%);
}

#divAppMenu #divBirthdayBonusButton .divFeaturedStroke:after
{
	background:conic-gradient(from var(--featured-stroke-angle) at 50% 50%, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 38%, rgba(187, 136, 0, 0.5) 47%, rgba(85, 187, 255, 0.5) 50%, rgba(187, 136, 0, 0.5) 53%, rgba(0, 0, 0, 0) 62%, rgba(0, 0, 0, 0) 100%);
}

#divAppMenu #divVipClaimedPromotionsButton .divFeaturedStroke:before
{
	background:conic-gradient(from var(--featured-stroke-angle) at 50% 50%, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 44%, #ff44aa 48.5%, #ffffff 50%, #ff44aa 51.5%, rgba(0, 0, 0, 0) 56%, rgba(0, 0, 0, 0) 100%);
}

#divAppMenu #divVipClaimedPromotionsButton .divFeaturedStroke:after
{
	background:conic-gradient(from var(--featured-stroke-angle) at 50% 50%, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 38%, rgba(255, 34, 153, 0.5) 47%, rgba(255, 204, 238, 0.5) 50%, rgba(255, 34, 153, 0.5) 53%, rgba(0, 0, 0, 0) 62%, rgba(0, 0, 0, 0) 100%);
}

#divAppMenu .bounce
{
	animation:featuredButtonBounce 1s ease-in-out 0s infinite;
}

/* MENU ITEMS POP-IN ANIMATION */
#divAppMenu .popInItem, #divAppMenu #svgFeaturedBorder, #divAppMenu #divFeaturedItems:before
{
	opacity:0;
}

#divAppMenu.menuPopIn .popInItem
{
	animation:menuPopIn 0.5s cubic-bezier(0.34, 1.56, 0.64, 1) both;
}

#divAppMenu.menuPopIn #divMenuItems.popInItem
{
	animation-name:menuFadeUp;
	animation-timing-function:ease-out;
}

#divAppMenu.menuPopIn #svgFeaturedBorder, #divAppMenu.menuPopIn #divFeaturedItems:before
{
	animation:menuFadeUp 0.5s ease-out 0s both;
}

/* ANIMATION KEY FRAMES */
@keyframes showMenu
{
	0%   {opacity:0;}
	1%   {opacity:0;}
	100% {opacity:1;}
}

@keyframes menuNeonText
{
	0%   {text-shadow:0px 0px 1px #000000;}
	1%   {text-shadow:0px 0px 1px #000000, 0px 0px 5px #01eff9, 0px 0px 5px #01eff9, 0px 0px 10px #01eff9;}
    5%   {text-shadow:0px 0px 1px #000000, 0px 0px 5px #01eff9, 0px 0px 5px #01eff9, 0px 0px 10px #01eff9;}
    6%   {text-shadow:0px 0px 1px #000000;}
    9%   {text-shadow:0px 0px 1px #000000;}
    10%  {text-shadow:0px 0px 1px #000000, 0px 0px 5px #01eff9, 0px 0px 5px #01eff9, 0px 0px 10px #01eff9;}
    16%  {text-shadow:0px 0px 1px #000000, 0px 0px 5px #01eff9, 0px 0px 5px #01eff9, 0px 0px 10px #01eff9;}
    17%  {text-shadow:0px 0px 1px #000000;}
    20%  {text-shadow:0px 0px 1px #000000;}
    21%  {text-shadow:0px 0px 1px #000000, 0px 0px 5px #01eff9, 0px 0px 5px #01eff9, 0px 0px 10px #01eff9;}
    59%  {text-shadow:0px 0px 1px #000000, 0px 0px 5px #01eff9, 0px 0px 5px #01eff9, 0px 0px 10px #01eff9;}
    60%  {text-shadow:0px 0px 1px #000000;}
    64%  {text-shadow:0px 0px 1px #000000;}
	65%  {text-shadow:0px 0px 1px #000000, 0px 0px 5px #01eff9, 0px 0px 5px #01eff9, 0px 0px 10px #01eff9;}
    100% {text-shadow:0px 0px 1px #000000, 0px 0px 5px #01eff9, 0px 0px 5px #01eff9, 0px 0px 10px #01eff9;}
}

@keyframes menuNeonTextPink
{
	0%   {text-shadow:0px 0px 1px #000000;}
	1%   {text-shadow:0px 0px 1px #000000, 0px 0px 5px #e600ff, 0px 0px 5px #e600ff, 0px 0px 10px #e600ff;}
    5%   {text-shadow:0px 0px 1px #000000, 0px 0px 5px #e600ff, 0px 0px 5px #e600ff, 0px 0px 10px #e600ff;}
    6%   {text-shadow:0px 0px 1px #000000;}
    9%   {text-shadow:0px 0px 1px #000000;}
    10%  {text-shadow:0px 0px 1px #000000, 0px 0px 5px #e600ff, 0px 0px 5px #e600ff, 0px 0px 10px #e600ff;}
    16%  {text-shadow:0px 0px 1px #000000, 0px 0px 5px #e600ff, 0px 0px 5px #e600ff, 0px 0px 10px #e600ff;}
    17%  {text-shadow:0px 0px 1px #000000;}
    20%  {text-shadow:0px 0px 1px #000000;}
    21%  {text-shadow:0px 0px 1px #000000, 0px 0px 5px #e600ff, 0px 0px 5px #e600ff, 0px 0px 10px #e600ff;}
    59%  {text-shadow:0px 0px 1px #000000, 0px 0px 5px #e600ff, 0px 0px 5px #e600ff, 0px 0px 10px #e600ff;}
    60%  {text-shadow:0px 0px 1px #000000;}
    64%  {text-shadow:0px 0px 1px #000000;}
	65%  {text-shadow:0px 0px 1px #000000, 0px 0px 5px #e600ff, 0px 0px 5px #e600ff, 0px 0px 10px #e600ff;}
    100% {text-shadow:0px 0px 1px #000000, 0px 0px 5px #e600ff, 0px 0px 5px #e600ff, 0px 0px 10px #e600ff;}
}

@property --featured-stroke-angle
{
	syntax:'<angle>';
	initial-value:0deg;
	inherits:false;
}

@keyframes featuredStrokeSpin
{
	to { --featured-stroke-angle:360deg; }
}

@keyframes featuredStrokeLifecycle
{
	0%   { opacity:0; }
	10%  { opacity:1; }
	80%  { opacity:1; }
	100% { opacity:0; }
}

@keyframes featuredButtonBounce
{
	0%   { transform: translateY(0);    }
	30%  { transform: translateY(-3px); }
	60%  { transform: translateY(0);    }
	80%  { transform: translateY(-2px); }
	100% { transform: translateY(0);    }
}

@keyframes menuPopIn
{
	0%   { opacity:0; transform:scale(0.8) translateY(10px); }
	100% { opacity:1; transform:scale(1) translateY(0); }
}

@keyframes menuFadeUp
{
	0%   { opacity:0; transform:translateY(10px); }
	100% { opacity:1; transform:translateY(0); }
}

/* MEDIA QUERIES */
@media (max-width: 1400px)
{
	#divAppMenu .divMenuContainer
	{
		width:320px;
	}
}

@media (max-width: 1200px)
{
	/* HEADER MENU */
	#divAppHeader #btnHeaderMenu
	{
		display:inline-block;
		margin:5px 0px 0px 15px;
	}

	/* MAIN MENU */
	body:not(.hideMenu) #divAppMenu #divMenuOverlay
	{
		animation:showMenu 0.25s;
		display:block;
		opacity:1;
	}

}

@media (max-width: 600px)
{
	/* HEADER MENU */
	#divAppHeader #btnHeaderMenu
	{
		margin:5px 0px 0px 10px;
	}
}

@media (max-width: 540px)
{
	/* MAIN MENU */
	#divAppMenu .divMenuContainer
	{
		width:300px;
	}

	#divAppMenu .divMenuHeader
	{
		height:60px;
	}

	#divAppMenu #imgMenuLogo
	{
		left:30px;
		top:15px;
		width:134px;
	}

	#divAppMenu #btnCloseMenu
	{
		right:20px;
		top:20px;
	}

	#divAppMenu #divFeaturedItems
	{
		min-height:190px;
	}

	#divAppMenu #btnMaldivesTrip
	{
		margin:20px 0px 10px 15px;
		padding-top:90px;
		width:calc(50% - 20px);
	}

	#divAppMenu #btnLuckyStreakChallenge
	{
		height:55px;
		margin:20px 15px 10px 10px;
		padding-top:105px;
		width:calc(50% - 20px);
	}

	#divAppMenu #btnLuckyStreakChallenge:after
	{
		height:29px;
	}

	#divAppMenu #divBirthdayBonusButton, #divAppMenu #divVipClaimedPromotionsButton
	{
		margin:10px 15px;
	}

	#divAppMenu .btnPromotionButton
	{
		margin:10px 15px;
	}

	#divAppMenu .divMenuItem
	{
		margin-top:0px;
	}

	#divAppMenu .divMenuItemLabel
	{
		font-size:18px;
		padding:10px 35px;
	}

	#divAppMenu .divSubmenuItemLabel
	{
		font-size:16px;
		line-height:20px;
		padding:10px 35px 10px 70px;
	}

	#divAppMenu .btnExpandCollapse
	{
		top:5px;
	}
}