@charset "utf-8";
/* Navigation Styling when the user is logged in */
/* Author: Max van Doorn */

/* Z INDEX GUIDE */
/*
Loading animation = 101
Menus = 100
Popup shadow layer = 99
Navigation = 98
Shadow layer behind dropdowns = 97
Subnav = 96
Body Content = 2
Animation layer = 1
*/

/* LINKS */
a {
	text-decoration: none;
}

.nav-top-logoff__2020,.logoff-dropdown__2020/*,.footer__2020*/ {
	display:none; /* These divs display the navigation when users are logged out, so they should not be visible when a user is logged in. */
}

.container {
	position:relative;
	width:100%;
	margin:auto;
	max-width:1080px;
	min-height:100vh;
	z-index:2;
}

.animated-bg__2020 {
	width:100%;
	height:100%;
	position:fixed;
	top:0;
	overflow:hidden;
	z-index:1;
	pointer-events: none;
}

/* 02/24/2020 Profile Menu Tests */
/*.nav-profile-grid__2020 {
	width:260px;
	height:auto;
	margin:10px;
	display:grid;
}
.nav-profile-grid-small__2020 {
	grid-template-columns:30% 70%;
	grid-template-rows:auto;
}
.nav-profile-grid-large__2020 {

}*/

/* SHARED STYLING */
#navProfilePetExpandIcon__2020 {
	background-position:center;
	background-repeat:no-repeat;
	background-size:60%;
	position:absolute;
	overflow:hidden;
	z-index:2;
}
#navProfilePetBox__2020 {
	position:relative;
	transition:all 0.5s;
	margin:10px;
}
#navProfilePet__2020 {
	background-position:center;
	background-repeat:no-repeat;
	width:100%;
	height:100%;
	margin:auto;
}

/* SMALL ACTIVE PET */
.nav-profile-pet-box-sm__2020 {
	border-radius:10px;
	box-sizing:border-box;
	width:80px;
	height:80px;
	padding:5px;
	float:left;
}
.nav-profile-pet-sm__2020 {
	overflow:hidden;
	border-radius:5px;
	background-size:130%;
}
.nav-profile-pet-expand__2020 {
	width:25px;
	height:25px;
	bottom:1px;
	right:1px;
	border-radius:50%;
}

/* LARGE ACTIVE PET */
.nav-profile-pet-box-lg__2020 {
	float:none;
	padding:0px;
	width:260px;
	height:260px;
}
.nav-profile-pet-lg__2020 {
	border-radius:0px;
	background-size:100%;
}
.nav-profile-pet-contract__2020 {
	width:45px;
	height:45px;
	bottom:-2px;
	right:-2px;
	border-radius:50% 50% 0;
}

/* PROFILE MENU DROPDOWN */
.nav-profile-dropdown__2020 {
	display:none;
	position:fixed;
	width:280px;
	z-index:98;
	overflow:auto; /*Will make it scrollable when the contents are taller than the height*/
}
.nav-profile-dropdown-text {
	line-height:15pt;
	margin-left:20px;
}
.nav-profile-dropdown-text a {
	text-decoration:none;
}

.nav-dropdown-activepet__2020 {

}

.nav-profile-dropdown__2020 ul {
	position:relative;
	margin:0 0 10px;
	list-style-type:none;
	width:100%;
	padding:0;
	clear:left;
}
.nav-profile-dropdown__2020 ul a {
    text-decoration:none;
}

.nav-profile-dropdown__2020 ul li {
	float:none;
	text-align:left;
	width:100%;
	margin:0;
	padding: 5px 0px 5px 15px;
	line-height:35px;
	cursor:pointer;
	box-sizing:border-box;

}
.nav-profile-dropdown__2020 .profile-linkgrid {
	display:grid;
	grid-template-columns:auto 45px;
}
.nav-profile-dropdown__2020 .profile-linkflex {
	display:flex;
	flex-direction:row;
	align-items:center;
}
.nav-profile-dropdown__2020 ul li h3 {
	font-size:18pt;
	margin:0;
	text-align:left;
	letter-spacing: 0.5pt;
}
.nav-profile-dropdown__2020 ul li h4 {
	font-size:16pt;
	margin:0;
	text-align:left;
	letter-spacing: 0.5pt;
}
.nav-profile-dropdown__2020 .profile-dropdown-subsection {
	padding: 5px 0px 5px 40px;
	display:flex;
	flex-direction:row;
	align-items:center;
}

/* New Profile Menu Icons */
.nav-profile-dropdown__2020 .profile-dropdown-arrow {
	height:100%;
	min-height:45px;
	width:45px;
	background-repeat:no-repeat;
	background-position:center;
	transition: all 0.25s;
}
.nav-profile-dropdown__2020 .profile-dropdown-link-icon {
	width:40px;
	height:35px;
	background-position: center;
    background-repeat: no-repeat;
	background-size: contain;
	margin-right:20px;
}
.nav-profile-dropdown__2020 .profile-dropdown-link-icon:hover {
	transform:rotate(-10deg);
}
.nav-neopass-icon {
    background-image:url(../basic/images/neopass-icon.svg);
}

/* OLD profile menu icons */
/*
.nav-userlookup-icon__2020,.nav-inventory-icon__2020,.nav-neomail-icon__2020,.nav-beta-icon__2020,.nav-signout-icon__2020,.nav-petcentral-icon__2020,.nav-createpet-icon__2020,.nav-adopt-icon__2020,.nav-customise-icon__2020,.nav-settings-icon__2020 {
	float:left;
	height:35px;
	width:40px;
	margin:0 20px 0 20px;
    background-position:center;
    background-repeat:no-repeat;
    background-size:contain;
	cursor:pointer;
}
.nav-userlookup-icon__2020:hover,.nav-inventory-icon__2020:hover,.nav-neomail-icon__2020:hover,.nav-beta-icon__2020:hover,.nav-signout-icon__2020:hover,.nav-petcentral-icon__2020:hover,.nav-createpet-icon__2020:hover,.nav-adopt-icon__2020:hover,.nav-customise-icon__2020:hover,.nav-calendar-icon__2020:hover,.nav-settings-icon__2020:hover {
	transform:rotate(-10deg);
}
*/

.nav-profile-dropdown-clock__2020 {
	padding:10px 0;
	clear:left;
}
.nav-calendar-icon__2020 {
	width:25px;
	height:25px;
    background-position:center;
    background-repeat:no-repeat;
    background-size:contain;
	cursor:pointer;
	margin: 0 10px 0 20px;
	float:left;
}
.nav-profile-dropdown-clock__2020 .nav-profile-dropdown-text {
	line-height:25px !important;
}

/* NEWS & ALERTS MENU DROPDOWN */
#navnewsdropdown__2020, #navquestsdropdown__2023 {
	display:none;
	position:fixed;
	width:280px;
	background:#fff;
	z-index:98;
	right:0;
}
#navnewsdropdown__2020 a, #navquestsdropdown__2023 a {
    text-decoration:none;
}
.news-tab-select__2020,.alerts-tab-select__2020,.quests-tab-select__2020 {
	position:relative;
	width:140px;
	display:inline-block;
	margin:0;
	height:40px;
}
.news-alerts-tab:not(.tabActive__2020) {
	display: none;
}
.news-alerts-select:not(.tabActive__2020) {
	cursor: pointer;
}
.news-alerts-select:not(.tabActive__2020) .news-alerts-notif {
	display: none;
}
.news-tab-select__2020 {
	float:left;
	border-radius:0px 15px 0px 0px;
}
.alerts-tab-select__2020,.quests-tab-select__2020 {
	border-radius:15px 0px 0px 0px;
	cursor:pointer;
}
.news-tab-viewall__2020,.alerts-tab-viewall__2020,.quests-tab-viewall__2020 {
	position:relative;
	width:100%;
	height:40px;
	padding:10px 0 0;
}
/*#newstab__2020 {
	display:none;
}*/
#alertstab__2020, #queststab__2020 {
	display:block;
}
.news-tab-content__2020,.alerts-tab-content__2020,.quests-tab-content__2020 {
	overflow:auto;
	position:relative;
	font-family: "MuseoSansRounded500", 'Arial', sans-serif;
	box-sizing:border-box;
}
.alerts-tab-content__2020,.quests-tab-content__2020 {
    padding:10px;
}
.news-tab-viewclick__2020, .alerts-tab-viewclick__2020, .quests-tab-viewclick__2020 {
	margin:auto;
	cursor:pointer;
	text-align:center;
}
.news-tab-viewclick__2020:hover, .alerts-tab-viewclick__2020:hover, .quests-tab-viewclick__2020:hover {
	transform:scale(1.1);
}
.alerts-tab-icon__2020, #navnewsdropdown__2020 .news-tab-icon__2020, .quests-tab-icon__2020 {
	display:inline-block;
	width:25px;
	height:25px;
	margin-bottom:-5px;
	margin-right:5px;
}
#navnewsdropdown__2020 .news-tab-icon__2020 {
	background-image:url(../basic/images/v3/news-icon.svg);
	background-size:contain;
	background-repeat:no-repeat;
	background-position:center;
}
.news-dropdown-text__2020 {
	display:inline-block;
	width:auto;
}
.news-tab-select__2020 .news-dropdown-text__2020 {
	text-align:center;
	display:inline-block;
}
.alerts-tab-select__2020 .news-dropdown-text__2020, .quests-dropdown-text__2020 {
	text-align:center;
	display:inline-block;
}
#alerts-notif__2020,#news-notif__2020, #quests-notif__2020 {
	width:auto;
	min-width:18px;
	height:auto;
	padding:4px;
	border-radius:18px;
	text-align:center;
	font-family: "MuseoSansRounded700", 'Arial', sans-serif;
	display:inline-block;
	margin-top:5px;
	float:left;
	margin-right:5px;
}
#news-notif__2020 {
	margin-left:25%;
}
#alerts-notif__2020, #quests-notif__2020 {
	margin-left:30px;
}
.news-tab-title__2020, .alerts-tab-title__2020, .quests-tab-title__2020 {
	margin: 2px auto auto;
	text-align:center;
}
.news-tab-title__2020 .news-dropdown-text__2020, .alerts-tab-title__2020 .news-dropdown-text__2020, .quests-tab-title__2020 .quests-dropdown-text__2020 {
	margin-top:4px;
}
/* News Items Styling */

#newstab__2020 {

}

#newstab__2020 ul {
    list-style:none;
	padding:0;
	margin:auto;
	width:100%;
}

#newstab__2020 ul li {
    width:100%;
    height:auto;
    padding: 15px 10px;
    box-sizing:border-box;
}

#newstab__2020 ul li .nf-img__2020 {
    background-position:center;
    background-repeat:no-repeat;
    background-size:100%;
}

#newstab__2020 ul li h4 {
    margin: 0 0 5px;
    font-size:13pt;
    font-family: "MuseoSansRounded700", 'Arial', sans-serif;
}
#newstab__2020 ul li p {
    margin: 5px 0;
    font-size:11pt;
}
#newstab__2020 ul li a {
    font-family: "MuseoSansRounded700", 'Arial', sans-serif;
    text-decoration:none;
}

.nf-type1 {} /* text only */

.nf-type2 {} /* large image only */

.nf-type2 .nf-img__2020, .nf-type3 .nf-img__2020 {
    width:100%;
    height:0;
    padding-bottom:56%;
    margin-top:10px;
}

.nf-type3 .nf-img__2020 { /* large image with text */
    margin-bottom:10px;
}

.nf-type4 .nf-img__2020 { /* Small image with text */
    float:left;
    width:80px;
    height:80px;
    margin-right:10px;
}

/* Alert Items styling. */
.alerts-tab-item-icon__2020 {
	float:left;
	width:50px;
	height:50px;
	background-size:100%;
	background-repeat:no-repeat;
	background-position:center;
	margin-right:10px;
	cursor:pointer;
}

#alertstab__2020 ul .alert-x {
    background: url(../basic/images/x-icon.svg) center center no-repeat;
    background-size: 100%;
    position:absolute;
    width:20px;
    height:20px;
    top:5px;
    right:5px;
    cursor:pointer;
}

#alertstab__2020 ul, #queststab__2020 ul {
	list-style:none;
	padding:0;
	margin:auto;
	width:100%;
}
#alertstab__2020 ul li {
	box-sizing:border-box;
	border-radius:10px;
	width:100%;
	height:auto;
	padding:10px;
	margin-bottom:15px;
	min-height:85px; /*Because the icon within this div is floating left, the height of this div is only determined by the text within. This is a problem if the height of the text is less than the height of the icon, so we make sure that the div is at least as tall as the icon plus padding. */
    position:relative;
}

#alertstab__2020 h4 {
	font-size: 12pt;
    margin: 4px 30px 4px 0px; /*By having extra right margin, we keep the title from overlapping the 'X' icon.*/
}

#alertstab__2020 p {
	margin:0;
	font-size:10pt;
}

#alertstab__2020 h5 {
	font-size: 11pt;
    margin: 5px 0 0;
}

/* ALERT ICONS */
#alerts.alerts-tab-content__2020 .alerts-tab-eventcode-13000 { /* Neopets birthday nc grant */
    background-image:url(../basic/images/alert/nc-icon.svg);
}
#alerts.alerts-tab-content__2020 .alerts-tab-eventcode-12000, #alerts.alerts-tab-content__2020 .alerts-tab-eventcode-4000, .alerts-tab-eventcode-4001 { /* Trudy's Surprise, Item Gifted */
    background-image:url(../basic/images/alert/gift-icon.svg);
}
#alerts.alerts-tab-content__2020 .alerts-tab-eventcode-1000 { /* Neomail */
    background-image:url(../basic/images/alert/neomail-icon.svg);
}
#alerts.alerts-tab-content__2020 .alerts-tab-eventcode-2000 { /* Warning */
    background-image:url(../basic/images/alert/warning-icon.svg);
}
#alerts.alerts-tab-content__2020 .alerts-tab-eventcode-3000 { /* Guild Invite */
    background-image:url(../basic/images/alert/friendrequest-icon.svg); /* TEMP */
}

/* Neofriends */
#alerts.alerts-tab-content__2020 .alerts-tab-eventcode-5000, /* Neofriend Request */
#alerts.alerts-tab-content__2020 .alerts-tab-eventcode-5002 { /* Neofriend Rejected */
    background-image:url(../basic/images/alert/friendrequest-icon.svg); /* TEMP */
}
#alerts.alerts-tab-content__2020 .alerts-tab-eventcode-5001 { /* Neofriend Accept */
    background-image:url(../basic/images/alert/friendaccepted-icon.svg);
}

/* Trading */
#alerts.alerts-tab-content__2020 .alerts-tab-eventcode-6000 { /* Trade Offer Made */
    background-image:url(../basic/images/alert/tradeoffer-icon.svg);
}
#alerts.alerts-tab-content__2020 .alerts-tab-eventcode-6001 { /* Trade Offer Withdrawn */
    background-image:url(../basic/images/alert/tradewithdrawn-icon.svg);
}
#alerts.alerts-tab-content__2020 .alerts-tab-eventcode-6003, /* Trade Offer Rejected */
#alerts.alerts-tab-content__2020 .alerts-tab-eventcode-6004 { /* Trade Closed */
    background-image:url(../basic/images/alert/traderejected-icon.svg);
}
#alerts.alerts-tab-content__2020 .alerts-tab-eventcode-6002, /* Trade Offer Approved */
#alerts.alerts-tab-content__2020 .alerts-tab-eventcode-6005 { /* Trade Completed */
    background-image:url(../basic/images/alert/tradeaccepted-icon.svg);
}
#alerts.alerts-tab-content__2020 .alerts-tab-eventcode-6006 { /* Trade Offer warning expired */
    background-image:url(../basic/images/alert/tradeoffer-icon.svg);
}
#alerts.alerts-tab-content__2020 .alerts-tab-eventcode-6007 { /* Trade Offer expired */
    background-image:url(../basic/images/alert/tradeoffer-icon.svg);
}
#alerts.alerts-tab-content__2020 .alerts-tab-eventcode-6008 { /* Trade Offer warning expired in 24h */
    background-image:url(../basic/images/alert/tradeoffer-icon.svg);
}
#alerts.alerts-tab-content__2020 .alerts-tab-eventcode-6009 { /* Trade Instant Buy */
    background-image:url(../basic/images/alert/tradeaccepted-icon.svg);
}

/* Battledome */
#alerts.alerts-tab-content__2020 .alerts-tab-eventcode-7000, /* Battledome Challenge */
#alerts.alerts-tab-content__2020 .alerts-tab-eventcode-7002 { /* Battledome Challenge Rejected */
    background-image:url(../basic/images/alert/challengerecieved-icon.svg);
}
#alerts.alerts-tab-content__2020 .alerts-tab-eventcode-7001, /* Battledome Challenge Accepted */
#alerts.alerts-tab-content__2020 .alerts-tab-eventcode-7003 { /* Battledome Opponent Waiting */
    background-image:url(../basic/images/alert/challengeaccepted-icon.svg);
}

/* Flash Challenge Events */
#alerts.alerts-tab-content__2020 .alerts-tab-eventcode-8000, /* Flash challenge sent */
#alerts.alerts-tab-content__2020 .alerts-tab-eventcode-8001, /* Flash challenge accepted */
#alerts.alerts-tab-content__2020 .alerts-tab-eventcode-8002, /* Flash challenge result */
#alerts.alerts-tab-content__2020 .alerts-tab-eventcode-8003, /* flash challenge declined */
#alerts.alerts-tab-content__2020 .alerts-tab-eventcode-8004 { /* flash challenge withdrawn */
    background-image:url(../basic/images/alert/warning-icon.svg);
}

/* Pet Stuff */
#alerts.alerts-tab-content__2020 .alerts-tab-eventcode-9000, /* pet transfer offer */
#alerts.alerts-tab-content__2020 .alerts-tab-eventcode-9001, /* pet transfer accepted */
#alerts.alerts-tab-content__2020 .alerts-tab-eventcode-9002, /* pet transfer rejected */
#alerts.alerts-tab-content__2020 .alerts-tab-eventcode-9003 { /* pet transfer cancelled due to inactivity */
    background-image:url(../basic/images/alert/adoptoffer-icon.svg);
}

/* Miscellaneous */
#alerts.alerts-tab-content__2020 .alerts-tab-eventcode-10000, /* Altador cup team invited */
#alerts.alerts-tab-content__2020 .alerts-tab-eventcode-10001, /* cocoa crispies challenge invite */
#alerts.alerts-tab-content__2020 .alerts-tab-eventcode-10002, /* style showdown invite */
#alerts.alerts-tab-content__2020 .alerts-tab-eventcode-10003, /* daily dare team challenge sent */
#alerts.alerts-tab-content__2020 .alerts-tab-eventcode-10004, /* daily dare team challenge accepted */
#alerts.alerts-tab-content__2020 .alerts-tab-eventcode-10005, /* daily dare team challenge declined */
#alerts.alerts-tab-content__2020 .alerts-tab-eventcode-10006, /* daily dare team challenge withdrawn */
#alerts.alerts-tab-content__2020 .alerts-tab-eventcode-10007, /* daily dare team challenge completed */
#alerts.alerts-tab-content__2020 .alerts-tab-eventcode-10008, /* daily dare team partner? */
#alerts.alerts-tab-content__2020 .alerts-tab-eventcode-10009 { /* NeoHospital Volunteer Centre */
    background-image:url(../basic/images/alert/warning-icon.svg);
}

/* QUESTS DROPDOWN */
#questsPane {
	font-family: "Cafeteria", 'Arial Bold', sans-serif;
}

#questsPane .questpane-quests {
	display: flex;
	flex-direction: column;
	gap: 1em;
}

#questsPane .questpane-quest {
	background: #dcc484;
	border: 2px solid #67593b;
	border-radius: 15px;
	height: max-content;
	padding: .5em .5em 1em;
	transition: height .3s;
	overflow: hidden;
	box-sizing: border-box;
}

/*#questsPane .questpane-quest.questpane-ready {
	height: 10em;
}*/

#questsPane .questpane-quest.questpane-hidden {
	height: 3em !important;
}

#questsPane .questpane-quest .questpane-top {
	display: grid;
	grid-template: auto / 30px auto 10%;
	align-items: center;
	gap: .5em;
}

#questsPane .questpane-quest .questpane-category img {
	max-width: 30px;
	max-height: 30px;
	vertical-align: bottom;
}

#questsPane .questpane-quest .questpane-title {
	font-size: 15pt;
}

#questsPane .questpane-quest .questpane-toggle {
	position: relative;
	width: 1.5em;
	height: 1.5em;
	background: #fdecc1;
	border-radius: 15px;
	cursor: pointer;
}

#questsPane .questpane-quest .questpane-toggle .questpane-arrow {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 25%;
	height: 25%;
	margin: auto;
	border: solid #67593b;
	border-width: 0 3px 3px 0;
	display: inline-block;
	padding: 1px;
	transition: transform .3s;
}

#questsPane .questpane-quest .questpane-toggle.arrow-up .questpane-arrow {
	transform: rotate(-135deg) translate(-.12em, -.12em);
	-webkit-transform: rotate(-135deg) translate(-.12em, -.12em);
}

#questsPane .questpane-quest .questpane-toggle.arrow-down .questpane-arrow {
	transform: rotate(45deg) translate(-.12em, -.12em);
	-webkit-transform: rotate(45deg) translate(-.12em, -.12em);
}

#questsPane .questpane-quest .questpane-tasks {
	margin-top: 1em;
	padding: 0 .5em;
	display: flex;
	flex-direction: column;
	gap: .5em;
}

#questsPane .questpane-quest .questpane-tasks .questpane-task {
	background: #fdecc1;
	border-radius: 15px;
	padding: .5em;
	display: grid;
	grid-template: auto / calc(1em + 4px) calc(90% - 2.5em) 5%;
	align-items: center;
	gap: 1em;
}

#questsPane .questpane-quest .questpane-tasks .questpane-task .questpane-task-check {
	position: relative;
	width: 1em;
	height: 1em;
	background: white;
	border: 2px solid black;
	border-radius: 5px;
}

#questsPane .questpane-quest .questpane-tasks .questpane-task .questpane-task-check .questpane-task-complete {
	position: absolute;
	left: -45%;
	right: 0;
	bottom: 0;
	width: 200%;
	padding-top: 200%;
	margin: auto;
	background: url(/neggfest/y23/np/negg-found.svg) center / 100% no-repeat;
}

#questsPane .questpane-quest .questpane-tasks .questpane-task .questpane-task-num {
	justify-self: end;
}

#questsPane .questpane-quest .questpane-claim {
	padding: 2px 2px 5px;
    max-width: 150px;
	margin: .5em auto;
}

#questsPane .questpane-quest.questpane-hidden .questpane-tasks, #questsPane .questpane-quest.questpane-hidden .questpane-claim-reward {
	display: none;
}

#QuestPaneRewardPopup .ql-reward-np {
	width: 80px;
	height: 80px;
	background: url(/quests/images/neopoints-stack.png) center / 100% no-repeat;
}


/*Universal styling for all dropdown tails from the top navbar*/
.dropdown-triangle-up__2020 {
	width:0;
	height:0;
	position:fixed;
	border-left:15px solid transparent;
	border-right:15px solid transparent;
}

/* Header Navigation */
.nav-top__2020 {
	position:fixed;
	top:0;
	width:100%;
	height:65px;
	/*height:100px;*/
	/* overflow:hidden; */
	z-index:98;
}
.nav-top__2020 a, .nav-bottom__2020 a {
    text-decoration:none;
}
.nav-top-pattern__2020 {
	position:absolute;
	width:100%;
	height:100%;
	z-index:-2;
}

/* Navigation Icons */
.nav-neofriends-dot__2020 {
	border-radius:50%;
	width:auto;
	min-width:15px;
	height:auto;
	padding:3px;
	font-size:10pt;
	position:absolute;
	top:0px;
	right:0px;
	text-align:center;
}
.nav-pet-menu-icon__2020 {
	border-radius:50%;
	overflow:hidden;
	background: #000;
	position:absolute;
	left:10px;
	cursor:pointer;
	background-size:100%;
}
.nav-logo__2020 {
	position:fixed;
	cursor:pointer;
}

.nav-link-icon,.nav-search-icon__2020,.nav-quest-icon__2020,.nav-bell-icon__2020 {
	height:40px;
	display:inline-block;
}
.nav-search-icon__2020:hover {
	transform:rotate(-10deg);
	cursor:pointer;
}
.nav-bell-icon__2020:hover, .nav-quest-icon__2020:hover {
	transform:scale(1.1);
	cursor:pointer;
}
.nav-notif-dot__2020 {
	/*border-radius:50%;
	width:15px;
	height:15px;*/
    display: block;
    width: auto;
    min-width: 14px;
    height: auto;
    padding: 3px;
    border-radius: 14px;
    text-align: center;
    font-family: "MuseoSansRounded700", 'Arial', sans-serif;
    font-size: 9pt;
    position: absolute;
    right:-5px;
}
.nav-dropdown-button {
	position:relative;
}
.nav-button:hover {
	transform:scale(1.1);
	cursor:pointer;
}

.nav-link-icon:hover {
	transform:rotate(-10deg);
}

/* Cleanup & Dropdown Arrows */
.nav-dropdown-arrow__2020 {
	width:18px;
	height:18px;
	background-size:contain;
	background-position:center;
	background-repeat:no-repeat;
	margin-left:10px;
	transition: all 0.25s;
}

.nav-top__2020 .nav-dropdown-arrow-rotate, .nav-profile-dropdown__2020 .nav-dropdown-arrow-rotate {
	transform:rotate(-180deg);
}

.nav-button {
	display:flex;
	align-items:center;
	justify-content:center;
	height:100%;
}

/* Dropdown Menus */
.dropdownshade-below__2020 {
	z-index:96 !important;
}
.nav-dropdown-shade__2020.dropdownshade-bottom__2020 {
	z-index:98 !important;
}
.dropdownshade-above__2020 {
	z-index:9999999999 !important; /* Before Venatus integration is 99 */
}

.nav-dropdown__2020 {
	position:absolute;
	top:calc(100% + 5px);
	left:50%;
	width:180px;
	margin-left:-90px;
	max-height: calc(100vh - 100%);
	border-radius:0 0 5px 5px;
	color:#000; /* Remove once theme-specific styling is in place. */
	overflow-x:hidden;
	overflow-y: scroll;
	box-sizing:border-box;
}
.nav-dropdown__2020:not(.shop-dropdown) {
	overflow-y: unset;
}
.nav-dropdown__2020.nav-dropdown-bottom__2020 {
	border-radius:5px 5px 0 0;
}
.nav-dropdown__2020::-webkit-scrollbar {
	width:0;
}
.nav-dropdown__2020.nav-dropdown-bottom__2020 {
	top: unset;
	bottom:100%;
}
.nav-dropdown__2020.premium-dropdown {
	width: max-content;
}.nav-dropdown__2020.nav-dropdown-bottom__2020.shop-dropdown {
	left:0;
}
.nav-dropdown__2020.nav-dropdown-bottom__2020.premium-dropdown {
	left:-50%;
}

.nav-dropdown__2020 ul {
	list-style-type: none;
	margin:0;
	padding:0;
}
.nav-dropdown__2020 ul h4 {
	margin: 5px 0;
	font-family: "Cafeteria", 'Arial Bold', sans-serif; /* Remove once theme-specific styling is in place. */
	font-size:13pt;
	letter-spacing:0.5pt;
}
.nav-dropdown__2020 ul li {
	cursor:pointer;
	display:grid;
	width:100%;
	grid-template-columns:30px 1fr;
	grid-gap:10px;
	align-items:center;
	justify-content:center;
	padding:5px 5px 5px 10px;
	box-sizing:border-box;
}
.nav-dropdown__2020:not(.community-dropdown) ul a:last-child li {
	border-bottom: none !important;
}
.nav-dropdown__2020 ul li .dropdown-icon {
	height:100%;
	width:30px;
	min-height:30px;
	background-size:contain;
	background-position:center;
	background-repeat:no-repeat;
}

.nav-toggle-dropdown__2020 {
	display: none !important;
}

.nav-toggle-dropdown__2020.nav-dropdown-active {
	display: block !important;
}

/* Community Dropdown */
.nav-dropdown__2020.community-dropdown .community-central-icon {
	background-image:url(../basic/images/communitycentral-icon.png);
}
.nav-dropdown__2020.community-dropdown .neomail-icon {
	background-image:url(../basic/images/v3/neomail-icon.svg);
}
.nav-dropdown__2020.community-dropdown .community-neoboards-icon {
	background-image:url(../basic/images/neoboards-icon.png);
}
.nav-dropdown__2020.community-dropdown .community-spotlights-icon {
	background-image:url(../basic/images/spotlights-icon.png);
}
.nav-dropdown__2020.community-dropdown .community-guilds-icon {
	background-image:url(../basic/images/guilds-icon.png);
}
.nav-dropdown__2020.community-dropdown .communitydropdown-social {
	display:flex;
	flex-direction:row;
	align-items:center;
	justify-content:center;
	padding: 5px 5px 5px 10px;
    box-sizing: border-box;
}
.nav-dropdown__2020.community-dropdown .twitter-icon, .nav-dropdown__2020.community-dropdown .facebook-icon, .nav-dropdown__2020.community-dropdown .instagram-icon {
	width:35px;
	height:35px;
	background-size:contain;
	background-position:center;
	background-repeat:no-repeat;
	margin: auto 5px;
}
.nav-dropdown__2020.community-dropdown .twitter-icon {
	background-image:url(../../../images/social/twitter.svg);
}
.nav-dropdown__2020.community-dropdown .facebook-icon {
	background-image:url(../../../images/social/facebook.svg?v=2);
}
.nav-dropdown__2020.community-dropdown .instagram-icon {
	background-image:url(../../../images/social/instagram.png);
}
.nav-dropdown__2020.community-dropdown .neofriendStatus {
	display:flex;
	justify-content:center;
	align-items:center;
	margin: 5px auto;
}
.nav-dropdown__2020.community-dropdown .neofriendStatus .neofriendStatus-dot {
	width:12px;
	height:12px;
	border-radius:50%;
	margin-right:5px;
}
.nav-dropdown__2020.community-dropdown .neofriendStatus .neofriendStatus-dot-offline {
	background-color:#b42727;
}
.nav-dropdown__2020.community-dropdown .neofriendStatus .neofriendStatus-dot-online {
	background-color:#27b432;
}
.nav-dropdown__2020.community-dropdown .neofriendStatus p {
	font-family: "MuseoSansRounded700", 'Arial Bold', sans-serif;
	margin: 5px 0;
    font-size: 10pt;
}
.nav-dropdown__2020.community-dropdown .neofriendsOnline {
	overflow-x:auto;
	white-space: nowrap;
	padding: 0 10px;
	box-sizing:border-box;
}
.nav-dropdown__2020.community-dropdown .neofriend {
	display:inline-block;
    margin: 0 5px;
}
.nav-dropdown__2020.community-dropdown .neofriendAv {
	width: 50px;
    height: 50px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}
.nav-dropdown__2020.community-dropdown .neofriendsOnline p {
	font-size:7pt;
	font-family: "MuseoSansRounded700", 'Arial Bold', sans-serif;
	text-decoration:none;
	text-align:center;
	word-wrap: break-word;
	word-break: break-word;
	margin:5px auto;
}

@media screen and (max-width:460px) {
	#communitydropdownbottom__2020 {
		position:fixed;
		bottom:68px;
		left:20px;
		margin-left:0;
		max-height: calc(100vh - 68px);
	}
}

/* Games Dropdown */
.nav-dropdown__2020.games-dropdown .gamesroom-icon {
	background-image: url(../basic/images/gamesroom-icon.svg);
}

.nav-dropdown__2020.games-dropdown .battledome-icon {
  	background-image: url(../basic/images/battledome-icon.png);
}

.nav-dropdown__2020.games-dropdown .hiscores-icon {
  	background-image: url(../basic/images/highscore-icon.png);
}

.nav-dropdown__2020.games-dropdown .fragments-icon {
  	background-image: url(../basic/images/fragments-icon.png);
}

.nav-dropdown__2020.games-dropdown .tada-icon {
  	background-image: url(../basic/images/tada-icon.png);
}

/* Explore Dropdown */
.nav-dropdown__2020.explore-dropdown .explore-icon {
	background-image: url(../basic/images/explore-icon.svg);
}

.nav-dropdown__2020.explore-dropdown .neggfest-icon {
	background-image: url(../basic/images/fon-icon.png);
}

.nav-dropdown__2020.explore-dropdown .neggfest-nc-icon {
	background-image: url(../basic/images/fondipdye-icon.png);
}

.nav-dropdown__2020.explore-dropdown .tvw-icon {
  	background-image: url(../basic/images/tvw-icon.png);
}

.nav-dropdown__2020.explore-dropdown .altador-cup-greyyear-icon {
	background-image: url(../basic/images/altadorcup-icon.png);
}

.nav-dropdown__2020.explore-dropdown .altador-clouds-icon {
  background-image: url(../basic/images/altadorcupvip-icon.png);
}

.nav-dropdown__2020.explore-dropdown .neopies-icon {
  	background-image: url(../basic/images/neopies-icon.png);
}

.nav-dropdown__2020.explore-dropdown .neopies-nc-icon {
  	background-image: url(../basic/images/neopiesraffle-icon.png);
}

.nav-dropdown__2020.explore-dropdown .faerie-festival-icon {
  	background-image: url(../basic/images/faeriefestival-icon.png);
}

.nav-dropdown__2020.explore-dropdown .free-the-faeries-icon {
    background-image: url(../basic/images/ff-nc-icon.png);
}

.nav-dropdown__2020.explore-dropdown .festival-of-fears-icon {
	background-image: url(../basic/images/fof-icon.png);
}

.nav-dropdown__2020.explore-dropdown .haunted-mansion-icon {
  	background-image: url(../basic/images/hauntedmansion-icon.png);
}

.nav-dropdown__2020.explore-dropdown .birthday-25-icon {
  	background-image: url(../basic/images/birthday25-icon.png);
}

.nav-dropdown__2020.explore-dropdown .treasure-map-icon {
    background-image: url(../basic/images/treasure-icon.png);
}

.nav-dropdown__2020.explore-dropdown .winter-starlight-icon {
  	background-image: url(../basic/images/advent-icon.png);
	width: 35px;
	margin-left: -2px;
}

.nav-dropdown__2020.explore-dropdown .solitaire-soiree-icon {
	background-image: url(../basic/images/sakhmetsoiree-icon.png);
}

.nav-dropdown__2020.explore-dropdown .lovestruck-icon {
	background-image: url(../basic/images/lovestruck-icon.png);
}

/* Shop Dropdown */
.nav-dropdown__2020.shop-dropdown .shop-np-icon, .nav-dropdown__2020.shop-dropdown .shop-nc-icon {
	width:30px;
	height:30px;
	background-size:contain;
	background-repeat:no-repeat;
	background-position:center;
	margin-right:10px;
}
.nav-dropdown__2020.shop-dropdown  h3 {
	margin: 5px 0;
	font-family: "Cafeteria", 'Arial Bold', sans-serif; /* Remove once theme-specific styling is in place. */
	letter-spacing:0.5pt;
}
.nav-dropdown__2020.shop-dropdown  .shop-np-icon {
	background-image:url(../basic/images/np-icon.svg);
}
.nav-dropdown__2020.shop-dropdown  .shop-nc-icon {
	background-image:url(../basic/images/nc-icon.svg);
}
.nav-dropdown__2020.shop-dropdown  .shopdropdown-tabs {
	display:grid;
	grid-template-columns:auto auto;
	width:100%;
}
.nav-dropdown__2020.shop-dropdown  .shopdropdown-tab-np, .nav-dropdown__2020.shop-dropdown  .shopdropdown-tab-nc {
	cursor:pointer;
	width:100%;
	display:flex;
	justify-content:center;
	align-items:center;
	padding:5px;
	box-sizing:border-box;
}
.nav-dropdown__2020.shop-dropdown  .shopdropdown-tab-np {
	border-radius: 0 15px 0 0;
}
.nav-dropdown__2020.shop-dropdown  .shopdropdown-tab-nc {
	border-radius: 15px  0 0;
}
.nav-dropdown__2020.shop-dropdown .shopdropdown-tab-active {
    cursor:auto !important;
}

/* NP Tab */
.nav-dropdown__2020.shop-dropdown  .shop-sw-icon {
	background-image:url(../basic/images/shopwizard-icon.png);
}
.nav-dropdown__2020.shop-dropdown  .shop-usershop-icon {
	background-image:url(../basic/images/myshop-icon.png);
}
.nav-dropdown__2020.shop-dropdown  .shop-auction-icon {
	background-image:url(../basic/images/auction-icon.png);
}
.nav-dropdown__2020.shop-dropdown  .shop-trading-icon {
	background-image:url(../basic/images/tradingpost-icon.png);
}
.nav-dropdown__2020.shop-dropdown  .shop-bank-icon {
	background-image:url(../../../premium/portal/images/banktotal-icon.png);
}
.nav-dropdown__2020.shop-dropdown  .shop-npcodes-icon {
	background-image:url(../basic/images/redeemcode-icon.png);
}
/* NC Tab */
.nav-dropdown__2020.shop-dropdown  .shop-ncmall-icon {
	background-image:url(../basic/images/ncmall-icon.png);
}
.nav-dropdown__2020.shop-dropdown  .shop-buync-icon {
	background-image:url(../basic/images/buync-icon.png);
}
.nav-dropdown__2020.shop-dropdown  .shop-redeemnc-icon {
	background-image:url(../basic/images/redeemnc-icon.png);
}
.nav-dropdown__2020.shop-dropdown  .shop-merch-icon {
	background-image:url(../basic/images/merch-icon.png);
}
.nav-dropdown__2020.shop-dropdown  .shop-merchshop-icon {
    background-image: url(../basic/images/merchshop-icon.png);
}
.nav-dropdown__2020.shop-dropdown  .shop-shenanigifts-icon {
	background-image:url(../basic/images/shenanigifts-icon.png);
}
/*#shopdropdown__2020 .shop-patapult-icon, #shopdropdownbottom__2020 .shop-patapult-icon {
	background-image:url(../basic/images/patapult-icon.png);
}*/
.nav-dropdown__2020.shop-dropdown  .shop-stylingstudio-icon {
	background-image:url(../basic/images/stylingstudio-icon.png);
}
.nav-dropdown__2020.shop-dropdown  .shop-wonderclaw-icon {
	background-image:url(../basic/images/wonderclaw-icon.png);
}

/* Premium Dropdown */
.nav-dropdown__2020.premium-dropdown .portal-icon {
  	background-image: url(../basic/images/premiumportal-icon.png);
}

.nav-dropdown__2020.premium-dropdown .ssw-icon {
	background-image: url(../basic/images/ssw-icon.svg);
}

.nav-dropdown__2020.premium-dropdown .bankroll-icon {
  	background-image: url(../basic/images/bankroll-icon.png);
}

.nav-dropdown__2020.premium-dropdown .feat-game-icon {
  	background-image: url(../basic/images/featuredgame-icon.png);
}

.nav-dropdown__2020.premium-dropdown .species-icon {
  	background-image: url(../basic/images/specieschange-icon.png);
}

.nav-dropdown__2020.premium-dropdown .sc-icon {
  	background-image: url(../basic/images/scratchcards-icon.png);
}

.nav-dropdown__2020.premium-dropdown .journal-icon {
  	background-image: url(../basic/images/journal-icon.png);
}

.nav-dropdown__2020.premium-dropdown .premiumwheel-icon {
  	background-image: url(../basic/images/premiumwheel-icon.png);
}

.nav-dropdown__2020.premium-dropdown .neodeck-icon {
  	background-image: url(../basic/images/neodeck-icon.png);
}

.nav-dropdown__2020.premium-dropdown .spacefaerievending-icon {
	background-image: url(../basic/images/spacefaerievending-icon.png);
}

.nav-dropdown__2020.premium-dropdown .dailies-icon {
	background-image: url(../basic/images/dailies-widget/dailieswidget-icon.png);
}

/* Bottom Navigation */
.nav-npc-left__2020, .nav-npc-right__2020 {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 15%;
	max-width: 200px;
	height: 0;
	padding-top: min(12.5%, 167px);
	background-position: left bottom;
	background-repeat: no-repeat;
	background-size: contain;
	pointer-events: none;
}
.nav-npc-right__2020 {
	left: unset;
	right:0;
	background-position: right bottom;
}


/* Sub Navigation */
/*.nav-sub__2020 {
	width:100%;
	max-width:1080px;
	height:45px;
	left: 50%;
	transform: translateX(-50%);
	z-index:96;
	position:fixed;
}*/
.container::before {
	content:'';
	display:block;
}
#navsub-buffer__2020 {
	width:100%;
	position:relative;
	display:block;
	height:45px;
}
.navsub-left__2020,.navsub-right__2020 {
	width:auto;
	height:auto;
	z-index:96;
	position:fixed;
	transition: margin 0.25s;
}
.navsub-left__2020 {
	left:10px;
}
.navsub-right__2020 {
	right:5px;
}
.navsub-bookmark-icon__2020 {
	background: url(../basic/images/bookmark-icon.svg) center center no-repeat;
    background-size: 100%;
	height:30px;
	width:20px;
	display:inline-block;
	cursor:pointer;
	margin-right:10px;
}
.navsub-fav-icon__2020 {
    background-size: 100%;
	height:30px;
	width:34px;
	display:inline-block;
	cursor:pointer;
}
.navsub-fav-icon-false__2020 {
	background: url(../basic/images/fav-icon-false.svg) center center no-repeat;
}
.navsub-fav-icon-true__2020 {
	background: url(../basic/images/fav-icon-true.svg) center center no-repeat;
}
.navsub-np-meter__2020,.navsub-nc-meter__2020 {
	background:#fff;
	border-radius:10px;
	height:auto;
	display:inline-block;
	cursor:pointer;
	padding: 2px 5px;
	width:auto;
}
.navsub-np-meter__2020 {
	min-width:50px;
}
.navsub-np-icon__2020 {
	background: url(../basic/images/np-icon.svg) center center no-repeat;
    background-size: 100% auto;
	height:25px;
	width:23px;
	margin: auto 4px auto 0;
	float:left;
	vertical-align:middle;
}
.np-text__2020,.nc-text__2020 {
	color:#363636;
	font-family: "Cafeteria", 'Arial Bold', sans-serif;
	font-weight:900;
	line-height:26px;
	font-size:10.5pt;
}
.navsub-nc-icon__2020 {
	background: url(../basic/images/nc-icon.svg) center center no-repeat;
    background-size: 100% auto;
	height:25px;
	width:25px;
	margin: auto 4px auto 0;
	float:left;
}

.navsub-add-nc__2020 {
	width:18px;
	height:26px;
	/*border-radius:50%;*/
	/*background:#5AC152;*/
	background: url(../basic/images/plus-circle.svg) center center no-repeat;
	background-size: 100% auto;
	display:inline-block;
	vertical-align:middle;
}

/* Bookmark Dropdown */
/* https://stackoverflow.com/questions/152975/how-do-i-detect-a-click-outside-an-element/3028037#3028037 */
.bookmark-dropdown__2020 {
	width:200px;
	height:auto;
	position:absolute;
	/*-webkit-box-shadow: 0px 0px 10px 1px rgba(0,0,0,0.25);
	-moz-box-shadow: 0px 0px 10px 1px rgba(0,0,0,0.25);
	box-shadow: 0px 0px 10px 1px rgba(0,0,0,0.25);*/
	border-radius: 15px;
	/*border: 2px solid #faa819;*/
	display:none;
}
.bookmark-dropdown__2020 a {
	text-decoration:none;
}
.bookmark-dropdown-tail__2020 {
	position:absolute;
	top:-8px;
	left:8px;
	width:0;
	height:0;
	border-left:px solid transparent;
	border-right:25px solid transparent;
	border-bottom:13px solid #fed123;
}
.bookmark-dropdown-header__2020 {
	box-sizing:border-box;
	width:100%;
	height:auto;
	background:#fed123;
	border-radius: 15px 15px 0 0;
	text-align:center;
	font-family: "Cafeteria", 'Arial Bold', sans-serif;
	padding: 8px 5px 10px 5px;
	font-size:18pt;
	border-bottom: 3px solid #faa819;
}
.bookmark-dropdown-content__2020 {
	background:#FFFACD;
	border-radius: 0 0 15px 15px;
	padding: 10px;
	/*padding-bottom:1px;
	padding-top:1px;*/
	font-family: "MuseoSansRounded700", 'Arial', sans-serif;
	box-sizing:border-box;
	width:100%;
	position:relative;
	height:auto;
	max-height:350px;
	overflow:auto;
	color:#000;
}
.bookmark-dropdown-link__2020 {
	border: 2px solid #faa819;
	border-radius:10px;
	box-sizing:border-box;
	width:100%;
	height:auto;
	margin:auto;
	background:#FFFACD;
	-webkit-box-shadow: 0px 3px 0px 0px rgba(250,168,25,1);
	-moz-box-shadow: 0px 3px 0px 0px rgba(250,168,25,1);
	box-shadow: 0px 3px 0px 0px rgba(250,168,25,1);
	cursor:pointer;
	margin-bottom:10px;
	padding:5px;
	/*overflow-wrap:break-word;*/
}
.bookmark-dropdown-link__2020:hover {
	background:#fed123;
}
.bookmark-dropdown-link__2020:active {
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
	margin-bottom:7px;
	margin-top:3px;
}
.bookmark-dropdown-content__2020 h4 {
	font-size:11pt;
	margin:8px 0 6px 4px;
}
.bookmark-dropdown-content__2020 ul {
	list-style:none;
	padding:0;
	margin:auto;
	width:100%;
}

.bookmark-dropdown-icon__2020 {
	width:30px;
	height:30px;
	background-size:100%;
	border-radius:5px;
	float:left;
	margin-right:5px;
}
.bookmark-dropdown-shade__2020 {
	position:fixed;
	width:100%;
	height:100%;
	opacity:0;
	left:0;
	top:0;
	z-index:-1;
}

/* CUSTOMIZE SCROLLBARS */
/*::-webkit-scrollbar {

}
::-webkit-scrollbar-track {

}
::-webkit-scrollbar-thumb {

}
::-webkit-scrollbar-thumb:hover {

}*/

/* Search Bar */

#navSearchH5 {
	grid-column:2/8;
	display:flex;
	flex-direction:row;
	align-items:center;
	width:95%;
	margin:auto;
	height:100%;
}
#navSearchBack {
	display:none;
	width:50px;
	height:100%;
	background-image:url(../basic/images/back-icon.svg);
	background-size:auto 50%;
	background-repeat:no-repeat;
	background-position:center;
	cursor:pointer;
}
#navSearchH5 input[type=text] {
	width:0px;
	height:30px;
	transition:all 0.5s;
	-webkit-transform-origin: center right; /* Ch <36, Saf 5.1+, iOS < 9.2, An =<4.4.4 */
    -ms-transform-origin: center right; /* IE 9 */
	transform-origin:center right;
	margin: auto 10px auto auto; /* Used to ensure that transition animates from right to left as input field grows. */
}
.nav-top__2020.navSearchActive #navSearchH5 input[type=text] {
	/*width:calc(100% - 120px);*/
}
.nav-search-button__H5 {
	display:none;
	width:50px !important;
	height:100%;
	/*background-image:url(../basic/images/v3/search-icon.svg);*/
	background-size:auto 50%;
}

.nav-top__2020.navSearchActive .nav-dropdown-button, .nav-top__2020.navSearchActive .nav-link-button, .nav-top__2020.navSearchActive .nav-top-nst {
	display:none;
}

/* MEDIA QUERIES */

@media screen and (max-width:824px) { /* When the device is small, and should display the bottom bar */
	.nav-bottom__2020 {
		position:fixed;
		bottom:0;
		width:100%;
		height:65px;
		display:grid;
		grid-template-columns:auto 60px 60px 60px 60px 60px auto;
		grid-template-rows:auto;
		column-gap:10px;
		z-index:97;
		box-sizing: border-box;
	}
	.nav-bottom-pattern__2020 {
		position:absolute;
		width:100%;
		height:100%;
		z-index:-2;
	}
	.nav-community__2020 {
		grid-column:2/3;
	}
	.nav-games__2020 {
		grid-column:3/4;
	}
	.nav-explore__2020 {
		grid-column:4/5;
	}
	.nav-shop__2020 {
		grid-column:5/6;
	}
	.nav-premium__2020 {
		grid-column:6/7;
	}
	.nav-notif-dot__2020 {
		/*margin-left:20px;
		margin-top:-5px;*/
		top:-4px;

	}
	.nav-link-icon {
		width:100%; /*The image should span the whole grid space width to avoid images becoming unaligned when switching between media queries. This is a bug on Chrome when using margin:auto; to align contents within a grid space*/
		height:32px;
	}
	.nav-community__2020,.nav-games__2020,.nav-explore__2020,.nav-shop__2020,.nav-premium__2020 {
		/*margin-top:5px;*/
	}
	.nav-top__2020 {
		height:50px; /* Reduce the height of the top navigation bar for mobile devices */
	}
	.navsub-left__2020,.navsub-right__2020 {
		margin-top: 10px;
		top:50px;
	}
	.container::before { /* Adjust the height of the page template top spacer so that the top navigation never covers important page content */
		height:50px;
	}
	.nav-sub__2020 {
		top:50px;
	}
	.container::after {
		content:'';
		display:block;
		/*height:65px;*/
	}
	.nav-pet-menu-icon__2020 {
		width:40px;
		height:40px;
		margin-top:5px;
	}
	.nav-logo__2020 {
		left:49%;
	}

	.nav-bell-icon__2020 {
		position:fixed;
		right:10px;
		margin-top:10px;
		height:30px;
		width:30px;
	}

	.nav-quest-icon__2020 {
		position:fixed;
		right:45px;
		margin-top:10px;
		height:30px;
		width:30px;
	}

	.nav-search-icon__2020 {
		position:fixed;
		right:80px;
		margin-top:7px;
		height:35px;
		width:27px;
	}
	/* Search Bar Open */
	.nav-top__2020.navSearchActive .nav-logo__2020, .nav-top__2020.navSearchActive .nav-pet-menu-icon__2020, .nav-top__2020.navSearchActive .nav-bell-icon__2020, .nav-top__2020.navSearchActive .nav-quest-icon__2020, .nav-top__2020.navSearchActive .nav-search-icon__2020 {
		display:none;
	}
	.nav-top-grid__2020 {
		height:100%;
	}
	#navSearchBack {
		display:block;
	}

	.nav-top__2020 .nav-community__2020,.nav-top__2020 .nav-games__2020,.nav-top__2020 .nav-explore__2020,.nav-top__2020 .nav-shop__2020,.nav-top__2020 .nav-premium__2020  {
		display:none;
	}
	.np-text__2020,.nc-text__2020 {
		font-size:10.5pt;
	}
	/*Profile Menu Dropdown*/
	.nav-profile-dropdown__2020 {
		height:calc(100vh - 50px);
		left:0;
		top:calc(50px + 3px); /*height of the navbar + the height of the navbar bottom border*/
	}
	/*Positioning for the Profile menu dropdown tail*/
	.nav-profile-dropdown__2020 .dropdown-triangle-up__2020 {
		left:calc(20px + 10px - 15px); /*Half the width of the profile menu icon plus the left offset of the profile menu icon minus half the width of this triangle div (half the width is already shown by border left or border right)*/
	}
	/* NEWS & ALERTS MENU DROPDOWN */
	#navnewsdropdown__2020, #navquestsdropdown__2023 {
		height:calc(100vh - 50px);
		top:calc(50px + 3px);
	}
	#navnewsdropdown__2020 .dropdown-triangle-up__2020 {
		right:calc(15px + 10px - 15px);
	}
	#navquestsdropdown__2023 .dropdown-triangle-up__2020 {
		right:calc(15px + 35px + 10px + 10px - 15px);
	}
	.news-tab-content__2020,.alerts-tab-content__2020,.quests-tab-content__2020 {
		height:calc(100vh - 50px - 90px); /*Viewport height minus navigation minus the static dropdown content*/
	}

}
@media screen and (max-width:530px) and (min-width:490px) { /*Make the space between nav icons transition fluidly from 10px to 5px*/
	.nav-bottom__2020 {
		grid-template-columns:auto 11% 11% 11% 11% 11% auto;
	}
}
@media screen and (max-width:489px) { /*Make the theme characters disappear on the smallest devices*/
	.nav-bottom__2020 {
		grid-template-columns:auto 60px 60px 60px 60px 60px auto;
		column-gap:2px;
	}
	.nav-bottom__2020 .nav-npc-left__2020,.nav-bottom__2020 .nav-npc-right__2020 {
		display:none;
	}
}

@media screen and (min-width:825px) {
	.nav-bottom__2020 {
		display:none; /* Hide the bottom navigation bar on larger devices */
	}
	.container::before {
		height:65px;
		/*height:100px;*/
	}
	.container::after { /*Used so that any bottom margins on the last element within the container don't overflow past the container bounds*/
		content:'';
		display:block;
		height:1px;
	}
	.navsub-left__2020,.navsub-right__2020 {
		margin-top: 10px; /* the height of the top navigation + a 10px buffer*/
		top:65px;
	}
	.nav-sub__2020 {
		top:65px;
	}
	.nav-pet-menu-icon__2020 {
		width:50px;
		height:50px;
		margin-top:7px;
	}
	.nav-logo__2020 {
		left:75px;
	}
	.np-text__2020,.nc-text__2020 {
		font-size:12pt;
	}
	.nav-top-grid__2020 {
		position:absolute;
		width:100%;
		/*height:90%;
		right:10px;
		top:5px;*/
		/*height:100%;*/
		height:65px;
		padding:5px 10px;
		box-sizing:border-box;
		display:grid;
		grid-template-columns:auto 60px 60px 60px 60px 60px 140px 35px 35px 35px;
		grid-template-rows:auto;
		column-gap:10px;
		z-index:-1;
	}

	.nav-community__2020 {
		grid-column:2/3;
	}
	.nav-games__2020 {
		grid-column:3/4;
	}
	.nav-explore__2020 {
		grid-column:4/5;
	}
	.nav-shop__2020 {
		grid-column:5/6;
	}
	.nav-premium__2020 {
		grid-column:6/7;
	}
	.nav-search-icon__2020 {
		margin-top:8px;
		grid-column:8/9;
	}
	.nav-quest-icon__2020 {
		grid-column:9/10;
		margin-top:8px;
		position:relative;
	}
	.nav-bell-icon__2020 {
		grid-column:10/11;
		margin-top:8px;
		position:relative;
	}
	.nav-top__2020 .nav-top-nst {
		grid-column:7/8;
	}
	/*.nav-notif-dot__2020 {
		margin-left:25px;
		margin-top:-2px;
	}*/
	/*Profile Menu Dropdown*/
	.nav-profile-dropdown__2020 {
		height:calc(100vh - 65px);
		left:0;
		top:calc(65px + 3px); /*height of the navbar + the height of the navbar bottom border*/
	}

	/*Positioning for the Profile menu dropdown tail*/
	.nav-profile-dropdown__2020 .dropdown-triangle-up__2020 {
		left:calc(25px + 10px - 15px); /*Half the width of the profile menu icon plus the left offset of the profile menu icon minus half the width of this triangle div (half the width is already shown by border left or border right)*/
	}
	/* NEWS & ALERTS MENU DROPDOWN */
	#navnewsdropdown__2020, #navquestsdropdown__2023 {
		height:calc(100vh - 65px);
		top:calc(65px + 3px);
	}
	#navnewsdropdown__2020 .dropdown-triangle-up__2020 {
		right:calc(18px + 10px - 15px);
	}
	#navquestsdropdown__2023 .dropdown-triangle-up__2020 {
		right:calc(18px + 35px + 10px + 10px - 15px);
	}
	.news-tab-content__2020,.alerts-tab-content__2020,.quests-tab-content__2020 {
		height:calc(100vh - 65px - 90px); /*Viewport height minus navigation minus the static dropdown content*/
	}
}

@media screen and (min-width:825px) and (max-width:1179px) {
	.nav-link-icon {
		width:100%; /*The image should span the whole grid space width to avoid images becoming unaligned when switching between media queries. This is a bug on Chrome when using margin:auto; to align contents within a grid space*/
		height:32px;
		margin-top:3px;
	}

	.nav-dropdown-arrow__2020 {
		display:none;
	}

}





@media screen and (max-width:1179px) {
	.nav-button {
		flex-direction: column;
	}
}

@media screen and (min-width:1180px) {
	.nav-top-grid__2020 {
		grid-template-columns:auto 200px 120px 125px 105px 130px 140px 35px 35px 35px;
	}
	.nav-text__2020 {
		/*position:absolute;
		margin-top:10px;*/
		display:inline-block;
		width:auto;
		font-size:17pt;
	}
	.nav-community__2020,.nav-games__2020,.nav-explore__2020,.nav-shop__2020,.nav-premium__2020 {
		/*margin-top:7px;*/
	}
	.nav-community-icon__2020 {
		width:50px;
		margin-right:10px;
	}
	.nav-games-icon__2020 {
		width:34px;
		margin-right:10px;
	}
	.nav-explore-icon__2020 {
		width:36px;
		margin-right:10px;
	}
	.nav-shop-icon__2020 {
		width:36px;
		margin-right:10px;
	}
	.nav-premium-icon__2020 {
		width:40px;
		margin-right:10px;
	}
}

/* TEMPORARY adding logged-out footer to logged-in view. Need to restyle in the future. */
/* FOOTER */
.footer__2020 {
	display: block;
	position: relative;
	width: 100%;
	height: min-content;
	padding: 20px 0;
	bottom: 0;
	overflow: visible;
	box-sizing: border-box;
}
.footer-pattern__2020 {
	position: absolute;
	top: 0;
	width: 100%;
	height: 100%;
	padding: inherit;
	right: 0;
	box-sizing: border-box;
}
.footer-logo__2020 {
	position:relative;
    background-position:center;
    background-repeat:no-repeat;
	background-size:contain;
	width:160px;
	height:54px;
	margin: 10px auto;
}
.footer-copyright__2020 {
	position: relative;
	text-align: center;
	margin: auto;
	max-width: calc(64%);
	padding: 0 0 10px;
	box-sizing: border-box;
}
.footer-links__2020 {
	position: relative;
	margin: auto;
	max-width: 350px;
	width: 90%;
	padding: 0;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	box-sizing: border-box;
}
.footer-link__2020 {
	display:inline-block;
	/*max-width:50%;*/
	margin:auto 10px;
	text-align:center;
	cursor:pointer;
	text-decoration:none;
}
.footer__2020 a {
	text-decoration:none;
}
.footer-link__2020:hover {
	transform:scale(1.1);
}
.footer-npcs__2020 {
	position: absolute;
	bottom: 0;
	width: 100%;
	z-index: 2;
}

@media screen and (max-width: 824px) {
    .footer__2020 {
        padding-bottom: 80px;
	}
	.footer-navhidden__2020 {
		margin-bottom:0 !important;
	}
	.footer__2020 .nav-npc-left__2020, .footer__2020 .nav-npc-right__2020 {
		display: none;
	}
	.footer-copyright__2020 {
		max-width: 90%;
	}

}
@media screen and (max-width:489px) {
	.footer-npcs__2020 {
		bottom: unset;
	}
	.footer__2020 .nav-npc-right__2020 {
		display: initial;
		bottom: -20px;
		width: 45%;
		padding-top: min(37.8%, 170px);
		background-position: .5em bottom;
		max-width: 200px;
		min-width: 90px;
		min-height: 75px;
	}
	.footer-copyright__2020 {
		margin: auto 0;
		/*max-width: 90%;*/
		max-width: 55%;
		padding: 5px 0 5px 20px;
	}
	.footer-links__2020 {
		margin: auto 0;
		max-width: 55%;
		width: auto;
		padding: 5px 0 10px 20px;
	}
}
@media screen and (max-width:378px) {
	.footer__2020 .nav-npc-right__2020 {
		bottom: -15px;
		width: 40%;
		padding-top: 33.7%;
		right: 0;
		max-width: 200px;
	}
	.footer-copyright__2020 {
		max-width: 90%;
		margin: 0 auto;
		padding: 0 0 30px;
	}
	.footer-links__2020 {
		max-width: 60%;
		padding: 0 0 10px;
		flex-direction: column;
		align-items: center;
	}
}

/* SUPER SHOP WIZARD - Premium Users Only */

    /* Subnav Icon for Super Shop Wizard */
.navsub-ssw-icon__2020 {
    height: 30px;
    width: 30px;
    background-image: url(../../../premium/shopwizard/ssw-icon.svg);
    background-size:contain;
    display: inline-block;
    cursor: pointer;
}

.premium-widget__2024 {
    position:fixed;
    z-index:101;
    bottom:-2px;
    right:5%;
    width:90%;
    max-width:400px;
    border:2px solid #1C4070;
    box-sizing:border-box;
    border-radius: 10px 10px 0 0;
    display:none;
}

#ssw__2020 .ssw-loading {
    width:24px;
    height:24px;
    margin:20px auto;
    background-image:url(//images.neopets.com/games/pages/Z8AGM.gif);
    background-size:100%;
    background-position:center;
    background-repeat:no-repeat;
}

.premium-widget__2024 p {
    font-family: "MuseoSansRounded700", 'Arial', sans-serif;
}

#ssw__2020 .widget-header__2020 {
    background-color:#5088d1;
    background-image:url(../../../premium/shopwizard/ssw-pattern.svg);
    height:auto;
    min-height:50px;
    width:100%;
    display:flex;
    border-radius: 8px 8px 0 0;
    position:relative;
}
#ssw__2020 .ssw-char__2020 {
    background-image: url(../../../premium/shopwizard/ssw-icon.svg);
    background-size:contain;
    background-repeat:no-repeat;
    position:absolute;
    left:5;
    bottom:0;
    height:60px;
    width:65px;
}
.premium-widget__2024 .widget-header__2020 h3 {
    text-shadow: 0px 0px 4px #000;
    max-width:calc(100% - 150px);
    margin:10px auto;
    font-size:16pt;
    font-family: "Cafeteria", 'Arial Bold', sans-serif;
    text-align:center;
    color:#fff;
    letter-spacing:1pt;
}
.premium-widget__2024 .widget-button-exit__2020 {
    max-width:55px;
    height:70%;
    position:absolute;
    right:10px;
    top:15%;
}
.premium-widget__2024 .widget-body__2020 {
    height:auto;
    width:100%;
    background: rgb(168,183,195);
    background: -webkit-linear-gradient(bottom, rgba(168,183,195,1) 0%, rgba(255,255,255,1) 100%);
    background: -o-linear-gradient(bottom, rgba(168,183,195,1) 0%, rgba(255,255,255,1) 100%);
    background: linear-gradient(to top, rgba(168,183,195,1) 0%, rgba(255,255,255,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#a8b7c3",endColorstr="#ffffff",GradientType=1);
    padding-bottom:1px;
    padding-top:1px;
}
.premium-widget__2024 .widget-body__2020 fieldset {
    box-sizing: border-box;
    min-inline-size: unset;
    border: none;
    width: 100%;
}
#ssw__2020 input[type=text] {
    border:1px solid #1C4070;
    border-radius:5px;
    font-family: "MuseoSansRounded700", 'Arial', sans-serif;
}
#ssw__2020 input[type=text] {

}
#ssw__2020 .ssw-button-search__2020 {
    display: inline-block;
    width: 50px;
    margin-left: 10px;
    min-height: 25px;
    border-radius: 12px;
    padding: 2px 5px 7px 5px !important;
}
#ssw__2020 .button-search-white__2020 {
    background-image: url(../basic/images/v3/search-icon.svg);
    height: 100%;
    min-height:19px;
    width: 100%;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}
#ssw__2020 select {
    border:1px solid #1C4070;
    border-radius:5px;
    color:#1c4070;
    /*-webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image:url();*/
}
#ssw__2020 select option:hover {
    background-color:#ecf2f7;
}
#ssw__2020 checkbox {
    border:1px solid #1C4070;
    border-radius:3px;
}

#ssw__2020 .ssw-search__2020, #ssw__2020 .ssw-filters__2020, #ssw__2020 .ssw-price__2020, #ssw__2020 .ssw-priceonly__2020 {
    width:90%;
    margin:auto;
}
#ssw__2020 .ssw-search__2020 {
    display:flex;
    padding-top:15px;
}
#ssw__2020 #searchstr {
    width: calc(100% - 65px);
    min-height: 30px;
}
#ssw__2020 .ssw-filters__2020 {
    width:87%;
    margin:15px auto;
}
#ssw__2020 .ssw-filters__2020 #ssw-criteria {
    margin-right:5px;
}
#ssw__2020 .ssw-filters__2020 select {
    font-family: "MuseoSansRounded700", 'Arial', sans-serif;
    width: calc(50% - 5px);
    min-height:30px;
}
#ssw__2020 .ssw-price__2020 {
    display:grid;
    width:70%;
    text-align:center;
}
#ssw__2020 .ssw-price__2020 p {
    margin:auto;
}
#ssw__2020 .ssw-price__2020 input {
    height:30px;
}
#ssw__2020 .ssw-price__2020 p, #ssw__2020 .ssw-priceonly__2020 p {
    font-size:10pt;
}
#ssw__2020 .ssw-price__2020 .ssw-dash__2020 {
    background-color:#1c4070;
    width:100%;
    height:4px;
    border-radius:5px;
    margin-top: 11px;
}
#ssw__2020 .ssw-priceonly__2020 {
    display:flex;
    justify-content:center;
    margin:15px auto;
}
#ssw__2020 .ssw-priceonly__2020 p {
    margin:0;
}
#ssw__2020 .ssw-priceonly__2020 input {
    margin:0 0 0 10px;
    height:15px;
    width:15px;
}

@media screen and (min-width: 400px) {
    #ssw__2020 .ssw-price__2020 {
        grid-template-columns:20% 30% 5% 30%;
        grid-gap:5%;
    }
}
@media screen and (max-width: 399px) {
    #ssw__2020 .ssw-price__2020 {
        grid-template-columns:43% 4% 43%;
        grid-gap:5%;
    }
    #ssw__2020 .ssw-price__2020 .ssw-price-text__2020 {
        grid-column:1/4;
        grid-row:1/2;
    }
}

/* SSW Results Styling */
#ssw__2020 .ssw-results-header {
    background-color:#fff;
    width:100%;
    padding: 1px;
    box-sizing: border-box;
}
#ssw__2020 .ssw-results-header p {
    font-family: "MuseoSansRounded700", 'Arial', sans-serif;
    color:#000;
    margin:5px auto;
    width:90%;
    text-align:center;
    font-size:11pt;
}
#ssw__2020 .ssw-results-body {
    /* Used to ensure that the contents of the results are never cut off on shorter screens.
    This is a quick fix, since technically we would need to subtract the heights of the dynamic elements, so there may still be issues in landscape orientation on phones.
    Search results are limited to 10 items, so its doubtfull we'd ever run into this issue on portrait mode devices.
    */
    max-height: 50vh;
    overflow: auto;
}
#ssw__2020 .ssw-results-body p {
    text-align:center;
}
#ssw__2020 .ssw-results-grid {

}
#ssw__2020 .ssw-results-grid-h { /* Replacing .ssw_col1 - 3 */
    color:#fff;
    font-family: "MuseoSansRounded700", 'Arial', sans-serif;
    font-size:11pt;
    padding-top:5px;
    padding-bottom:5px;
}
#ssw__2020 .ssw-results-grid-stock, #ssw__2020 .ssw-results-grid-price {
    font-family: "MuseoSansRounded500", 'Arial', sans-serif;
    font-size:10pt;
    padding:3px 0;
    box-sizing:border-box;
    word-break: break-word;
    display: flex;
    justify-content: center;
    align-items: center;
}
#ssw__2020 .ssw-results-body ul {
    list-style-type: none;
    margin:0;
    padding:0;
}
#ssw__2020 .ssw-results-grid ul li {
    display:grid;
    grid-template-columns:40% auto 40%;
    grid-gap:5px;
    text-align:center;
    padding: 0 5px;
    box-sizing:border-box;
}
#ssw__2020 .ssw-results-grid-gallery ul li {
    display:grid;
    grid-template-columns:100%;
    text-align:center;
    padding: 0 5px;
    box-sizing:border-box;
}
#ssw__2020 .ssw-results-body ul li p {
    margin:5px auto;
    font-family: "MuseoSansRounded500", 'Arial', sans-serif;
}
#ssw__2020 .ssw-results-grid-user {
    padding:3px 0;
    display: flex;
    justify-content: center;
    align-items: center;
}
#ssw__2020 .ssw-results-body ul li a {
    color:#528cd3;
    font-family: "MuseoSansRounded700", 'Arial', sans-serif;
    text-decoration:none;
    font-size:10pt;
    word-break: break-word;
}
#ssw__2020 .ssw-results-body ul li:nth-child(even) {
    background-color:#fff;
}
#ssw__2020 .ssw-results-body ul li:nth-child(odd) {
    background-color:#ecf2f7;
}
#ssw__2020 .ssw-results-body ul li.ssw-results-grid-header {
    background-color:#3b79d6;
}
/*#ssw__2020 .ssw-results-error,*/ #ssw_error_result, #ssw__2020 .ssw-result-priceonly {
    font-family: "MuseoSansRounded500", 'Arial', sans-serif;
    color:#000;
    width:90%;
    margin:auto;
    text-align:center;
    min-height:75px;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    font-size:11pt;
}

#ssw__2020 .ssw-button {
    text-transform: uppercase;
    text-shadow: 0px 0px 4px #000;
}
#ssw__2020 .button-grid2__2020 {
    max-width:300px;
}

#ssw__2020 .ssw-hide, #ssw__2020 .ssw-tabs-header {
    display:none;
}

@media screen and (max-width: 399px) {
    #ssw__2020 .ssw-results-grid-stock, #ssw__2020 .ssw-results-grid-price, #ssw__2020 .ssw-results-grid ul li a {
        font-size:9pt;
    }
}

/* BANK ROLL */
#bankroll__2020 {
	max-width: 500px;
	border-color: #281407;
}

#bankroll__2020 .widget-header__2020 {
	background: #985629 url(../../../premium/portal/images/molding.svg) center / auto 100%;
    height:auto;
    min-height:50px;
    width:100%;
    display:flex;
    border-radius: 8px 8px 0 0;
    position:relative;
}
#bankroll__2020.premium-widget__2024 .widget-header__2020 h3 {
	color: #ffd500;
}

#bankroll__2020 .widget-body__2020 {
	padding: 1em;
    background: #fff url(../../../premium/portal/images/bank-pattern.svg) center / 30%;
	box-sizing: border-box;
}

/* Bankroll Currencies */
.bankroll-currencygrid__2020 {
    display:grid;
    grid-gap:15px;
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.bankroll-currencygrid__2020 p {
    font-family: "Cafeteria", 'Arial Bold', sans-serif;
    color:#f7ddd1; /* Unofficial Value */
    margin: 5px 10px 5px 35px;
    font-size:14pt;
    text-align:center;
}
#bankroll__2020 .widget-body__2020 .bankroll-currencygrid__2020 .bankroll-currencybar p {
    margin: 0 auto;
	padding: 0 20px 10px;
}
#bankroll__2020 .widget-body__2020 .bankroll-currencygrid__2020 .bankroll-currencybar {
    position: relative;
	background: #985629;
	border: 2px solid transparent;
	border-radius: 10px;
    border-image: url(../../../premium/portal/images/backing-wood.svg) 20 fill / 20px / 0 stretch;
    display: flex;
	flex-direction: column;
    justify-content: center;
    align-items: center;
}
#bankroll__2020 .widget-body__2020 .bankroll-np-icon, #bankroll__2020 .widget-body__2020 .bankroll-bank-icon, #bankroll__2020 .widget-body__2020 .bankroll-till-icon {
    background-size:contain;
    background-repeat:no-repeat;
    background-position:center;
    width:60px;
    height:60px;
	margin-top: -1em;
}
#bankroll__2020 .widget-body__2020 .bankroll-np-icon {
    background-image:url(../../../premium/portal/images/nptotal-icon.png);
}
#bankroll__2020 .widget-body__2020 .bankroll-bank-icon {
    background-image:url(../../../premium/portal/images/banktotal-icon.png);
}
#bankroll__2020 .widget-body__2020 .bankroll-till-icon {
    background-image:url(../../../premium/portal/images/shoptill-icon.png);
}

#bankroll__2020 .bankroll-interest {
    width: 30px;
    height: 30px;
	background: url(../../../premium/portal/images/interest-loading.svg) center / 100% auto no-repeat;
    position: absolute;
    top: 0;
    right: 5px;
}
#bankroll__2020 .bankroll-interest-true {
    background-image: url(../../../premium/portal/images/interest-true.svg);
}
#bankroll__2020 .bankroll-interest-loading {
	background-image: url(../../../premium/portal/images/interest-loading.svg);
	animation: interest-icon-loading .5s infinite;
}
#bankroll__2020 .bankroll-interest-false {
    background-image: url(../../../premium/portal/images/interest-false.svg);
	cursor: pointer;
}
#bankroll__2020 .bankroll-interest-false::before {
	content: '';
	background: url(../../../premium/portal/images/interest-false.svg);
}
#bankroll__2020 .bankroll-interest-false::after {
	content: '';
	background-image:url(../../../premium/portal/images/interest-true.svg);
}

/* The animation code */
@keyframes interest-icon-loading {
  from {filter: brightness(50%);}
  to {filter: brightness(100%);}
}

@media screen and (max-width:479px) {
    #bankroll__2020 .widget-body__2020 .bankroll-currencygrid__2020 {
        display: flex;
        flex-wrap: wrap;
    }
	#bankroll__2020 .widget-body__2020 .bankroll-currencygrid__2020 .bankroll-currencybar {
		flex: 1 1 33%;
	}
	#bankroll__2020 .widget-body__2020 .bankroll-currencygrid__2020 .bankroll-currencybar.bankroll-currencybar-np {
		flex: 1 1 100%;
	}
}
@media screen and (max-width:340px) {
	#bankroll__2020 .widget-body__2020 .bankroll-currencygrid__2020 .bankroll-currencybar {
		flex: 1 1 100%;
	}
}

/* Bankroll Interest Collection */
#bankroll__2020 .widget-body__2020 .bankroll-interest-container {
	width: calc(100% - 14px);
	margin: 14px auto 7px;
    border-image: url(../../../premium/portal/images/backing-wood.svg) 20 / 20px / 7px repeat;
}

#bankroll__2020 .widget-body__2020 .bankroll-interest-collect {
	width: 100%;
	min-height: calc(1em + 24px);
	padding: .5em;
	background: #fff url(../common/bank/images/info-marble.svg);
	border-radius: 5px;
	display: flex;
	justify-content: center;
	align-items: center;
	gap: .5em;
	box-sizing: border-box;
}

#bankroll__2020 .widget-body__2020 .bankroll-interest-collect p {
	margin: 0;
}

#bankroll__2020 .widget-body__2020 .bankroll-interest-collect .bankroll-daily-interest {
	padding: .5em 1.5em;
	border-radius: 10px;
	background-color: #c5c0b5;
	text-align: center;
	display: flex;
	justify-content: center;
	align-items: center;
	gap: .25em;
	box-sizing: border-box;
}

#bankroll__2020 .widget-body__2020 .bankroll-interest-collect .bankroll-btn {
	border-radius: 12px !important;
	padding: 2px 5px 7px 5px !important;
	max-width: 120px;
}

@media screen and (max-width:479px) {
	#bankroll__2020 .widget-body__2020 .bankroll-interest-collect {
		flex-direction: column;
	}
}
@media screen and (max-width:320px) {
	#bankroll__2020 .widget-body__2020 .bankroll-interest-collect .bankroll-daily-interest {
		flex-direction: column;
	}
}

/* Bankroll Stocks */
#bankroll__2020 .widget-body__2020 .bankroll-stockscontainer {
    display:grid;
    width:100%;
    max-width:800px;
    grid-template-columns:20% auto;
    grid-gap:15px;
    margin:15px auto auto;
}

#bankroll__2020 .widget-body__2020 .bankroll-stockschart {
    max-width: 200px;
    margin: auto;
    width: 100%;
}

#bankroll__2020 .widget-body__2020 .bankroll-stocksgrid {
    display:grid;
    width:calc(100% - 14px);
    height:calc(100% - 14px);
    grid-template-columns: 25% 25% 25% 25%;
    grid-template-rows: repeat(3, minmax(0, 1fr));
    border: 1px solid #1C4070;
    box-sizing:border-box;
    margin:auto;
    border-image: url(../../../premium/portal/images/backing-wood.svg) 20 / 20px / 7px repeat;
}
#bankroll__2020 .widget-body__2020 .bankroll-stocksgrid h3, #bankroll__2020 .widget-body__2020 .bankroll-stocksgrid h4, #bankroll__2020 .widget-body__2020 .bankroll-stocksgrid p {
    margin:5px;
}
#bankroll__2020 .widget-body__2020 .bankroll-stocksgrid h4, #bankroll__2020 .widget-body__2020 .bankroll-stocksgrid p {
    font-size:10pt;
}
#bankroll__2020 .widget-body__2020 .bankroll-stocksgrid h3 {
    color:#fff;
    font-size:11pt;
}
#bankroll__2020 .widget-body__2020 .bankroll-stockscontainer p.bankroll-emptyfolio {
    font-family: "MuseoSansRounded700", 'Arial', sans-serif;
    grid-column: 1/3;
    text-align: center;
}

#bankroll__2020 .widget-body__2020 .bankroll-stocksgrid .bankroll-holdings, #bankroll__2020 .widget-body__2020 .bankroll-stocksgrid .bankroll-overall {
    font-family: "MuseoSansRounded700", 'Arial', sans-serif;
    text-align:center;
    background-color:#3B5CA7;
    border: 1px solid #1C4070;
    box-sizing:border-box;
    display: flex;
    justify-content: center;
    align-items: center;
}

#bankroll__2020 .widget-body__2020 .bankroll-stocksgrid .bankroll-stocksgrid-cell {
    font-family: "MuseoSansRounded700", 'Arial', sans-serif;
    text-align:center;
    background-color:#fff;
    border: 1px solid #1C4070;
    box-sizing:border-box;
    display: flex;
    justify-content: center;
    align-items: center;
}

#bankroll__2020 .widget-body__2020 .bankroll-stockslabel {
    display: flex;
    justify-content: center;
    width: 90%;
    max-width: 100px;
    margin: -10px auto;
    background-color:#fad541;
    border:2px solid #e4870f;
    letter-spacing:1px;
}
#bankroll__2020 .widget-body__2020 .bankroll-stockslabel-text {
    font-family: "Cafeteria", 'Arial Bold', sans-serif;
    font-size:16pt;
    color:#000;
}

#bankroll__2020 .widget-body__2020 .bankroll-stocksgraph {
    width:100%;
    height:0;
    padding-bottom:80%;
    background-repeat:no-repeat;
    background-size:contain;

}
#bankroll__2020 .widget-body__2020 .bankroll-stocksgraph-up {
    background-image:url(../../../premium/portal/images/stocks-positive.svg);
}
#bankroll__2020 .widget-body__2020 .bankroll-stocksgraph-flat {
    background-image:url(../../../premium/portal/images/stocks-neutral.svg);
}
#bankroll__2020 .widget-body__2020 .bankroll-stocksgraph-down {
    background-image:url(../../../premium/portal/images/stocks-negative.svg);
}
#bankroll__2020 .widget-body__2020 .bankroll-stocksgraph-stonks {
    background-image:url(../../../premium/portal/images/stocks-random.png);
}

#bankroll__2020 .widget-body__2020 .bankroll-stockstext-down {
    color:#AD0002;
}
#bankroll__2020 .widget-body__2020 .bankroll-stockstext-up {
    color:#058200;
}

@media screen and (max-width:479px) {
	#bankroll__2020 .widget-body__2020 .bankroll-stockscontainer {
        grid-template-columns:100%;
    }
	#bankroll__2020 .widget-body__2020 .bankroll-stockschart {
		display: grid;
		grid-template: auto / auto auto;
		align-items: center;
	}
	#bankroll__2020 .widget-body__2020 .bankroll-stockschart a {
		height: max-content;
	}
	#bankroll__2020 .widget-body__2020 .bankroll-stocksgraph {
		width: 100%;
		padding-bottom: 50%;
		margin: auto;
		background-position: center right;
	}
	#bankroll__2020 .widget-body__2020 .bankroll-stockslabel {
		margin: auto;
	}
    #bankroll__2020 .widget-body__2020 .bankroll-stocksgrid {
        grid-template-columns:50% 50%;
        grid-template-rows: repeat(6, minmax(0, 1fr));
	    height: auto;
    }
    #bankroll__2020 .widget-body__2020 .bankroll-holdings {
        grid-column:1/3;
        grid-row:1/2;
    }
    #bankroll__2020 .widget-body__2020 .bankroll-overall {
        grid-column:1/3;
        grid-row:4/5;
    }

}
@media screen and (min-width:480px) {
    #bankroll__2020 .widget-body__2020 .bankroll-holdings {
        grid-column:1/3;
        grid-row:1/2;
    }
    #bankroll__2020 .widget-body__2020 .bankroll-overall {
        grid-column:3/5;
        grid-row:1/2;
    }
}

/* Nav Bar Clock */
.nav-top__2020 .nav-top-nst {
	position:relative;
	/*bottom:5px;
	right:10px;*/
	padding:5px;
	box-sizing:border-box;
	font-size:11pt;
	width:140px;
	margin:auto;
	text-align:center;
}
@media screen and (max-width: 824px) {
	.nav-top__2020 .nav-top-nst {
		display:none;
	}
}