/* User Nav*/	
	.side-nav {
		position: fixed;
		top: 112px;
		width: 350px;
		right: -350px;
		height: 100%;
		background-color: #908489;
		overflow-x: hidden;
		transition: 0.3s;
		z-index: 9999;
		background: var(--theme-color-secondary);
		border: var(--border-1px);
	}

	.side-nav.show {
		right: 0;
	}

	.side-nav .menu-content {
		color: #f1f1f1;
	}

.side-nav a {
	    color: var(--link-color-primary);
}


	.side-nav .menu-content .avatar {
		overflow: hidden;
		border-radius: 50%;
		background-color: rgba(255, 255, 255, 0.31);
		margin-right: 10px;
	}

	.side-nav .menu-content .avatar img {
		object-fit: cover;
		width: 42px;
		height: 42px;
	}

	/* UserBlock */
	.user-button {
		background: none;
		border: none;
		display: flex;
		align-items: center;
		cursor: pointer;
		font-family: 'FSElliotPro-Heavy';
	}

.user-button .avatar {
    overflow: hidden;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.31);
    margin-right: 10px;
    height: 55px;
    width: 55px;
    transition: all 0.4s ease;
    border: 2px solid transparent;
    box-shadow: 0 0 0 rgba(255, 255, 255, 0);
    transform: rotate(0deg);
}

.user-button .avatar:hover {
    border: 2px solid #ae8435;
    box-shadow: 0 0 12px rgb(196 116 79);
    transform: rotate(5deg) scale(1.05);
}
.user-button .avatar:active {
     transform: scale(1.25);
    box-shadow: 0 0 20px rgba(0, 209, 255, 0.8);
}


	.user-button .avatar img {
	}

	.user-button .chevron {
		margin-left: 10px;
		transition: transform 0.3s;
		font-family: 'Minecraft Bold';
		color: #ac6343;
	}

	.user-button .chevron[data-opened="true"] {
		transform: rotate(180deg);
	}

	#usrMenu > .pages a {
		height: 42px;
		padding: 10px;
		display: block;
	}
	
	#usrMenu > .pages a:hover {
		background: #cac2b5;
	}
	
	/* Full Profile */
	
	.userProfile {
	background: var(--theme-content-pane);
	-webkit-box-shadow: 0 14px 43px rgba(79, 45, 31, .2);
	-moz-box-shadow: 0 14px 43px rgba(79, 45, 31, .2);
	box-shadow: 0 14px 43px rgba(79, 45, 31, .2);
	border: 3px solid #ddd4bc;
	padding: 5px;
	}
	
	.userData {
		font-family: 'Intro-Black';
		background: var(--theme-color-primary);
		background-size: cover;
		padding: 3px;
	}
	
	#profileContents .pageItem:nth-child(even) {
		background: #fefdfd
	}

	#profileContents .pageItem:nth-child(odd) {
		background: #f4f2ef
	}

	#profileContents .itemTitle {
		width: 50%;
		display: inline-block;
		vertical-align: top;
		padding: 0 10px 0 15px;
		line-height: 32px;
		font-size: 14px;
		color: #5d5a57
	}

	#profileContents .itemDetail {
		width: 40%;
		display: inline-block;
		vertical-align: top;
		padding: 0 10px;
		font-weight: 600;
		line-height: 32px;
		color: #5d5a57;
		font-size: 14px
	}
	
	@media screen and (max-width: 767px) {
    .foxesResponsive_pull {
        margin-left:-10px;
        margin-right: -10px;
    }

    .foxesResponsive_pull .foxesResponsive_pull {
        margin-left: 0;
        margin-right: 0;
    }

    .foxesResponsive_pull, .foxesResponsive_pull .foxesBox:not( .foxesBox--child ), .foxesResponsive_pull .foxesStreamItem {
        border-radius: 0;
        border-left-width: 0;
        border-right-width: 0;
    }

    #foxesLayout_mainArea {
        padding: 10px;
    }
	
    html[dir] #foxesLayout_sidebar.foxesLayout_sidebarleft, html[dir] #foxesLayout_sidebar.foxesLayout_sidebarright {
        padding: 10px;
        padding-top: 0;
    }

    .foxesColumns.foxesColumns_collapseTablet:not( .foxesHide ), .foxesColumns.foxesColumns_collapsePhone:not( .foxesHide ) {
        width: auto;
        display: block;
        padding-right: 0;
    }

    .foxesColumns.foxesColumns_collapseTablet > .foxesColumn:not( .foxesHide ), .foxesColumns.foxesColumns_collapsePhone > .foxesColumn:not( .foxesHide ) {
        position: relative;
        margin: 0 0 15px 0;
        display: table-cell;
    }

    .foxesLayout_contentSection {
        padding: 5px;
    }

    .foxesGrid.foxesGrid_collapseTablet > [class*="foxesGrid_span"], .foxesGrid.foxesGrid_collapsePhone > [class*="foxesGrid_span"] {
        width: 100%;
    }

    .foxesGrid.foxesGrid_collapseTablet > [class*="foxesGrid_span"], html[dir="ltr"] .foxesGrid.foxesGrid_collapsePhone > [class*="foxesGrid_span"] {
        margin-left: 0;
    }

    .foxesGrid.foxesGrid_collapseTablet > [class*="foxesGrid_span"], html[dir="rtl"] .foxesGrid.foxesGrid_collapsePhone > [class*="foxesGrid_span"] {
        margin-right: 0;
    }

    #elContextualTools {
        padding: 0;
    }

    .foxesHeaderButtons .foxesToolList {
        float: right;
        width: auto;
        margin-bottom: 0;
    }

    .foxesHeaderButtons .foxesType_pageTitle {
        line-height: 1.5;
    }

    .foxesHeaderButtons .foxesToolList .foxesButton {
        line-height: 28px;
    }
}

	#profileStats {
		background: #2b2b2b;
		margin: 25px 0 0px;
		color: #fff;
		height: auto;
		padding: 12px 12px 12px 0px;
		font-size: 18px;
		font-weight: 500;
		position: relative;
	}
	
	#profileStats li {
		align-content: space-evenly;
	}

	#profileStats > [data-role="switchView"] .foxesList_inline, #profileStats > [data-role="switchView"] .foxesButton {
		position: relative;
		z-index: 1000;
	}

	#profileStats > ul:last-child > li {
		margin-right: 20px;
		padding-right: 20px;
		border-right: 1px solid rgba(255,255,255,0.2);
	}

	#profileStats > ul:last-child > li {
		margin: 0;
		padding-left: 20px;
	}

	#profileStats > ul:last-child > li:last-child {
		border: 0;
	}

@media screen and (max-width: 979px) {
    #userReputation .foxesDataList .foxesDataItem_generic, #userReputation .foxesDataList .foxesDataItem_main {
        display:table-cell;
    }

    #profileHeader .foxesColumn_narrow {
        width: 70px;
    }

    #profileHeader .foxesUserPhoto_xlarge {
        width: 70px;
        height: 70px;
    }

    #profileStats {
        padding-left: 20px;
        padding-right: 20px;
    }

    #profilePhoto [data-action="editPhoto"] {
        bottom: 10px;
    }
	
	#profileStats {
        height: auto;
    }

    #profileStats.cProfileHeaderContent {
        display: none;
    }

    #profileStats > ul > li {
        display: block;
        margin-bottom: 10px;
    }

    #profileStats > ul:last-child {
        margin-top: calc( var(--sp-1) * -1 );
        margin-bottom: calc( var(--sp-1) * -1 );
    }

    #profileStats > ul:last-child > li {
        margin: var(--sp-1) 0;
        padding: 0;
        border: 0;
        width: 50%;
    }

}
	
	.profile-title {
		color: #886f1d;
		font-family: 'FSElliotPro-Heavy';
		display: inline-block;
		border-radius: 5px;
		padding: 3px;
		background: aliceblue;
		margin: 5px;
	}

	.profile-title h1 {
		display: table-cell;
		font-size: 1rem;
		/* text-transform: capitalize; */
	}
	
	/* AVATAR BOX */
	[data-marker="avatar-box"] {
		bottom: -30px;
		left: 24px;
		z-index: 10;
		border-width: 0px;
		border-style: solid;
		border-color: rgb(22, 22, 26);
		vertical-align: inherit;
		max-width: 100%;
		min-height: 0px;
		min-width: 0px;
		flex-shrink: 0;
		flex-direction: column;
		flex-basis: auto;
		display: flex;
		align-items: stretch;
	}

	/* AVATAR WRAPPER */
	.avatar-wrapper {
		position: absolute;
		vertical-align: inherit;
		max-width: 100%;
		min-height: 0px;
		min-width: 0px;
		flex-shrink: 0;
		flex-direction: column;
		flex-basis: auto;
		display: inline-table;
		align-items: stretch;
		width: min-content;
		z-index: 1;
	}

	/* IMG INNER */
	.avatar-image-inner {
		border-width: 0px;
		position: relative;
	}

	/* IMG */
	.avatar-image {
		transition: opacity 0.33s ease-in-out 0s;
		opacity: 0;
		position: absolute;
		max-height: 128px;
		max-width: 128px;
		object-fit: cover;
		z-index: 0;
		width: 132px;
		height: 132px;
		border-radius: 132px;
		vertical-align: inherit;
	}

	/* BUTTON */
	.avatar-edit-button {
		-webkit-box-align: center;
		align-items: center;
		-webkit-box-pack: center;
		justify-content: center;
		display: flex;
		position: absolute;
		left: 4px;
		top: 4px;
		background: rgba(22, 22, 26, 0.4);
		border: 2px solid rgba(22, 22, 26, 0.1);
		width: calc(100% - 8px);
		height: calc(100% - 8px);
		opacity: 0;
		transition: all 0.15s ease-in-out 0s;
		backdrop-filter: blur(44px);
		transform: scale(0.85);
		transform-origin: center center;
		border-radius: 135px;
	}

	.avatar-edit-button:hover,
	.avatar-edit-button:focus {
		transform: scale(1);
		opacity: 1;
	}

	.avatar-edit-button:active {
		transform: scale(0.9);
	}

	.avatar-edit-button svg {
		width: 24px;
		height: 24px;
		fill: white;
	}

	/* HOVER */
	.avatar-wrapper:hover .avatar-edit-button {
		opacity: 1;
	}
	
	.FoxesStatus_online {
	color: #249168;
	margin: 5px;
	}

	.FoxesStatus_offline {
		color: #d54040;
		margin: 5px;
	}

			
	.profile-title span {
		font-size: 10pt;
	}
	
	.profileButtonGroup{
		position: relative;
		width: auto;
		height: 62px;
		display: inline-flex;
		transition: .3s ease;
		margin: 8px 5px;
	}
	
	.profileButton {
		width: max-content;
		height: max-content;
		font-size: 15pt;
		background-color: #b0c2c2c2;
		color: antiquewhite;
		border-radius: 10px;
		padding: 10px;
	}
	
	.statsTabbleItem:nth-child(even) {
		background: #fefdfd;
	}

	.statsTabbleItem:nth-child(odd) {
		background: #f4f2ef
	}

	.pageItemTitle {
		width: 65%;
		display: inline-block;
		vertical-align: top;
		padding: 0 10px 0 15px;
		line-height: 32px;
		/* font-size: 14px; */
		color: #5d5a57
	}

	.pageItemValue {
		display: inline-flex;
		vertical-align: top;
		padding: 0 10px;
		font-weight: 600;
		line-height: 32px;
		color: #5d5a57;
		font-size: 14px;
	}

	a.see_last_comments {
		margin: 0 0 0 15px;
		color: #61a1c1
	}

	a.see_last_comments:hover {
		text-decoration: none
	}

	.statsTabbleItem_second_title {
		color: #b98c6d;
		font-size: 16px;
		font-weight: 800;
		margin: 15px 15px 15px 0
	}
	
	.dpad {
		font-size: 0.8rem;
	}

	.toggleSwitch {
		height: 65px;
		background-color: #8d7c4b;
	}
	
	.profileActions {
	    display: flex;
		float: right;
		margin: 5px;
	}
	
	.profileActions > button {
		    margin: 5px;
	}
	
	#dialogContent .option_select {
		float: left;
	}
	
	/* PROFILE BACKGROUNDS */
.profileedit_ItemPickerList {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    justify-items: center;
}

.profileedit_ItemPickerList label {
	margin: 5px;
}

.profileedit_ItemPickerList label:hover {
	transition: 0.3s;
	filter: drop-shadow(1px 3px 6px rgba(0, 0, 0, 0.25)) brightness(115%);
	animation: bounceSelected 0.6s ease;
}

.profilebackground_BackgroundOption {
    padding: 0;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
	margin: 15;
}
.profilebackground_Preview {
    width: 200px;
    height: 112px;
    overflow: hidden;
    background: #000000;
    border-radius: 3px;
}

.profilebackground_Preview img {
    width: 100%;
    display: block;
    position: relative;
    z-index: 3;
    border-radius: 3px;
}
	
	/* PROFILE COLORSCHEMES */
.colorBlock {
	cursor: pointer;
	height: 60px;
	position: relative;
	text-align: center;
}
					
.innerDiv {
	height: 100%;
	display: none;
	font-size: 40pt;
	margin: 0 auto;
	background-color: rgb(217 222 231 / 54%);
}

.innerSpan.checked:before {
	font-family: Font Awesome\ 6 Pro;
	content: "\f00c";
	margin: 5px;
    font-size: 32pt;
    color: #ffffff;
}

.foxesButton_split {
    margin: 0;
    padding: 0;
    list-style: none;
    display: inline-flex;
    border-radius: var(--button--radius);
}

.foxesMenu {
    background: rgb( var(--theme-area_background_reset) );
    box-shadow: var(--popup--boxShadow);
    border: var(--popup--border);
    background-clip: padding-box;
    border-radius: var(--popup--radius);
    z-index: 10000;
    position: absolute;
}

.foxesMenu .foxesMenu_item:first-child a, .foxesMenu .foxesMenu_item:first-child > span {
    border-top-left-radius: var(--popup--radius);
    border-top-right-radius: var(--popup--radius);
}

.foxesMenu .foxesMenu_item:last-child a, .foxesMenu .foxesMenu_item:last-child > span {
    border-bottom-left-radius: var(--popup--radius);
    border-bottom-right-radius: var(--popup--radius);
}

ul.foxesMenu, .foxesMenu > ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

@keyframes bounceSelected {
  0% {
    transform: translateY(0px); }
  50% {
    transform: translateY(-2px); }
  100% {
    transform: translateY(0px); } 
}
	
.colorBlock.checked {
	border: 3px dotted #101010;
	background-color: #ccc42754;
}

@keyframes shake {
  0% {
    transform: translateX(0);
  }
  10% {
    transform: translateX(-10px);
  }
  20% {
    transform: translateX(10px);
  }
  30% {
    transform: translateX(-10px);
  }
  40% {
    transform: translateX(10px);
  }
  50% {
    transform: translateX(-10px);
  }
  60% {
    transform: translateX(10px);
  }
  70% {
    transform: translateX(-10px);
  }
  80% {
    transform: translateX(10px);
  }
  90% {
    transform: translateX(-10px);
  }
  100% {
    transform: translateX(0);
  }
}

.shake {
  animation: shake 0.8s ease-in-out;
}

/* Group Display */

    .userStatus{
		display: flow-root;
		margin: 10px;
	}
	
	span.groupStatus-1 {
		color: #cfc09f;
		position: relative;
		text-transform: uppercase;
		letter-spacing: 3px;
		line-height: 1;
		font-weight: 300;
		text-shadow: -1px 0 1px #c6bb9f, 0 1px 1px #c6bb9f, 5px 5px 10px rgba(0, 0, 0, 0.4), -5px -5px 10px rgba(0, 0, 0, 0.4);
	}
	
	h1.groupStatus-1 {
		font-family: 'FSElliotPro-Heavy';
		color: #8b0000d4;
	}
	
	h1.groupStatus-4 {
		color: #7fff00c4;
		font-size: 15px;
		font-family: 'Minecraft';
	}
	
	h1.groupStatus-5 {
		text-transform: capitalize;
	}
	
	.connected-account__list {
    --provider-color: $text-color;
    display: grid;
    gap: 10px;
    grid-template-columns: 1fr 1fr
}

.connected-account__list .connected-account {
    align-items: center;
    background: #ecf0f1;
    border: 1px solid transparent;
    border-radius: 5px;
    display: flex;
    gap: 10px;
    padding: 10px;
    transition: all .3s ease;
    transition-property: border
}

.connected-account__list .connected-account.connected-account--placeholder {
    background: transparent;
    border-color: #ecf0f1;
    border-style: dashed
}

.connected-account__list .connected-account__info {
    line-height: 1.2
}

.connected-account__list .connected-account__icon {
    background: var(--provider-color);
    border-radius: 10px;
    box-sizing: content-box;
    color: #fff;
    display: block;
    flex-shrink: 0;
    font-size: 24px;
    height: 30px;
    line-height: 30px;
    padding: 5px 5px 3px;
    text-align: center;
    width: 30px
}