@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@500;600;700&family=Work+Sans:wght@100;200;400&family=Yantramanav:wght@100;300;500&display=swap');

:root {
	box-sizing: border-box; 
	--main-font: Segoe UI, sans-serif;
	--background-sidebar: #21262D;
	--background-step-btn: #32383F;
	--color-step-btn: #161B22;
	--background-step-btn-active: #5EBAC9;
	--background-btn-tabs: #191E25;
	--background-copyright: #191E25;
	--color-status-green: #6FFF8F;
	--color-yellow: #FCFF6F;
	--color_dark_theme: #21262D;
	--color_light_theme: rgba(211, 211, 211, 1);
	--margin-left-small: 40px;
	--margin-left-med: 50px;
	--width-med: calc(100% - 50px);
	--margin-left-large: 65px;
}

::before,
::after {
	box-sizing: inherit; 
} 

* {
	margin: 0;
	padding: 0;
}
body {
	margin: 0;
}
.main-sidebar {
	position: fixed;
	float: none;
	top: 0;
	bottom: 0;	
	left: 0;
	height: 100vh;	
	width: 20em;
	z-index: 5;	
	background-color: var(--background-sidebar);
	box-shadow: 0 14px 28px rgba(0,0,0,.25),0 10px 10px rgba(0,0,0,.22)!important;  
	transition: 0.3s ease-out;
}
.sidebar-inner {
	position: relative;
	display: flex;
	flex-direction: column;
	vertical-align: middle;
	text-align: center;
	top: 0;
	height: auto;	
}
.header_settings {
	position: relative;
	text-align: center;
	text-decoration: none;
	height: 50px;
	background:rgba(0,0,0,.15);
	width: 100%;
	box-shadow: 0px 2px 10px rgb(0 0 0 / 0%);
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-self: center;
	text-align: left;
	vertical-align: middle;
	transition: 0.3s ease-out;

	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: no;
}
.npi_logo {
	display: flex; 
	align-items: center;
	margin-left: 12px; 
	padding: 0;
}
.header_settings > h3 {
	position: relative;
	text-align: center;
	margin: auto 5px;
	transition: 0.3s ease-out;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: no;
}
.brand_logo {
	position: relative;
	display: flex; 
	flex-direction: row;
	align-items: flex-end;
	padding-left: 20px; 
	font-family: var(--main-font);
}
.close_arrow {
	position: relative;
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	height: 50px;
	width: 50px;
	margin: auto 0;
	background-color: transparent;
	text-decoration: none;	
	border: none;
	outline: none;	
	cursor: pointer;
	font-size: 26px;
	transition: 0.6s;
}
.close_arrow:hover {
	transition: 0.6s;
}
.close_color_arrow {
	color: #333;
}
.close_color_arrow:hover {
	color: rgba(0,0,0,.3);
	transition: 0.3s;		
}
.open_color_arrow {
	color: #B6B6B6;
}
.open_color_arrow:hover {
	color: #fff;
	transition: 0.6s;
}
.data_article {
	position: relative;
	overflow-y: scroll;
	overflow-x: hidden;
	flex-grow: 1;
	min-height: calc(100vh -  98px);
	height: 300px;
	padding-top: 0;
	transition: 0.6s;
	text-align: center;
}
.nav_tabs {
	position: relative;
	padding: 0;
	margin: 0;
	font-family: var(--main-font);
}
.gen_tab {
	position: relative;
	cursor: pointer;
	outline: none;
	border: none;
	text-align: left;
	white-space: nowrap;
	height: auto;
	width: 100%;
	padding: 10px 10px 12px 20px;	
	background: transparent;
	color: white;	
	font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
	font-size: 17px;
	line-height: 17px;	
	font-weight: 10;
	transition: 0.6s;
}
.gen_tab:hover {
	color:white;
	background: var(--background-step-btn);
}
.gen_tab.active_ac {
	color:white;
	background: transparent;
}
.gen_tab:after {
	position: absolute;
	content: "";
	top: 12px;
	right: 10px;
	width: 0;
	height: 0;
	border: 6px solid transparent;
	border-color: #fff transparent transparent transparent;
	float: left;
	-webkit-transition: 0.6s;
	-o-transition: 0.6s;
	transition: 0.6s;  
}
.gen_tab.active_ac:after {
	border-color: transparent transparent rgba(202, 202, 202, .5) transparent;
	top: 6px;
	-webkit-transition: 0.6s;
	-o-transition: 0.6s;
	transition: 0.6s;  
}
.tab_wrap {
	position: relative;
	display: block;
	transition: 0s ease-in;
	opacity: 1;
}
.btn_tabs {
	color:inherit;
	border: none;
	outline: none;
	cursor: pointer;
	font-size: 16px;
	line-height: 16px;
	font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";

	font-weight: 100;
	align-self: center;
	width: 100%;
	text-decoration: none;
	white-space: nowrap;
	background: var(--background-btn-tabs);
	color: #BBBBBB;
	cursor: pointer;
	text-align: left;
	padding: 10px 10px 12px 30px;
	-webkit-transition: 0.6s;
	-o-transition: 0.6s;
	transition: 0.6s;    
}
.btn_tabs:hover {
	color:white;
	background: var(--background-step-btn);
}
.btn_tabs.active {
	color: black;
	background: var(--background-step-btn-active);
}
.btn_gen_tabs {
	position: relative;
	cursor: pointer;
	outline: none;
	border: none;
	text-align: left;
	font-family: "Segoe UI";
	width: 100%;
	background: transparent;
	color: #BBBBBB;
	white-space: nowrap;
	height: auto;

	font-size: 17px;
	line-height: 17px;
	font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
	font-weight: 100;
	padding: 10px 10px 12px 20px;
	transition: 0.6s;    
}
.btn_gen_tabs:hover,
.btn_gen_tabs.active {
	color: black;
	background: var(--background-step-btn-active);
}
.copyright {
	position: relative;
	display:flex;
	height: 50px;
	background: var(--background-copyright);
	bottom: 0;
	margin: 0;
	width: 100%;
	color: #9C9C9C;
	font-size: 14px;
	line-height: 16px;
	white-space: nowrap;
	align-items: center;
	justify-content: flex-start;
	font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";		
	transition: 0.3s;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: no; 	
}
.link {
	text-decoration: none;
	color: #9C9C9C;
	font-size: 14px;
	line-height: 16px;
	white-space: nowrap;
	align-items: center;

	font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";		
	transition: 0.8s;
}
.link:hover {
	color: #fff;
	transition: 0.8s;
}
.copyright.active {
	display: flex;
	justify-content: flex-start;
	transition: 0.3s;	
}
/*шапка WellGame*/
.nav_start {
	position: fixed;
	display: flex;
	flex-direction: row;
	align-items: center;
	top:0;
	z-index: 1032;
	height: 50px;
	width: calc(100% - 20em);
	margin-left: 20em;
	background-color: var(--background-sidebar);
	transition: 0.3s ease-out;
}
.nav_start:before {
	transition: 0.3s ease-in;
}
.nav_start > .nav_steps,
.nav_start > .nav_profile {
	position: relative;
	width: 100%;
	height: 100%;
	z-index: 100;
	align-items: center;
	display: flex;
	flex-direction: row;
	padding: 0;
}
.nav_start > .logo {
	position: relative;
	z-index: 100;
	align-items: center;
	justify-content: center;
	display: flex;
	flex-direction: row;
	padding: 0;
}
.user_div {
	position: relative;
	display: flex;
	flex-direction: row;
	justify-content: flex-end;
	width: 100%;
}
.status {
	display: flex;
	flex-direction: row;
	white-space: none;
	align-self: center;
	font-size: 14px;
	line-height: 16px;
	margin-right: 50px;
	white-space: nowrap;
	align-items: center;
	font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";		
	transition: 0.3s;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: no; 
}
.status {
	display: flex;
	flex-direction: row;
	white-space: none;
	align-self: center;
	font-size: 14px;
	line-height: 16px;
	margin-right: 50px;
	white-space: nowrap;
	align-items: center;
	font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";		
	transition: 0.3s;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: no; 
}
.status::before {
	position: relative;
	font-size: 14px;
	padding-right: 12px;
	margin-left: 20px;
	color: #BBBBBB;
	content: "Статус игры:";
	font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
	left: 0;
	top: 0px;
	transition: all 0.6s ease 0s;
}
.status.calc {
	color: var(--color-status-green);
}
.status.exp {
	color: var(--color-yellow);
}
.balance {
	display: flex;
	flex-direction: row;
	white-space: none;
	align-self: center;
	height: 50px;
	color: var(--color-status-green);
	margin-right: 25px;
	font-size: 14px;
	line-height: 16px;
	white-space: nowrap;
	align-items: center;
	font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";		
	transition: 0.3s;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: no; 	
}
.balance::before {
	position: relative;
	font-size: 14px;
	padding-right: 12px;
	margin-left: 20px;
	color: #9c9c9c;
	content: "Баланс:";
	font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
	left: 0;
	top: 0px;
	transition: all 0.6s ease 0s;
}
.user_home {
	cursor: pointer;
	outline: none;
	border: none;
	background: none;
	height: 50px;
	color: #9c9c9c;
	font-size: 16px;
	line-height: 16px;
	white-space: nowrap;
	align-items: center;
	font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";		
	transition: 0.3s;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: no; 
}
.user_home:hover {
	color: #fff;
	transition: 0.3s;	
}
.user_act {
	color: #c1c1c1;
	transition: 0.3s;	
}
.nav_wg {
	cursor: pointer;
	outline: none;
	border: none;
	background: none;
	height: 50px;
	margin-left: 15px;
	color: #9c9c9c;
	font-size: 16px;
	line-height: 16px;
	white-space: nowrap;
	align-items: center;
	font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";		
	transition: 0.3s;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: no; 	
}
/*end*/
.name {
	display: flex; 
	flex-direction: row;
	align-self: center;
	align-items: center;
	height: 50px;
	line-height: 50px;
	margin: 0;
	font-family: Yantramanav;
	font-style: normal;
	font-weight: 250;
	font-size: 32px;
	align-items: center;
	letter-spacing: 0.04em;
	color: #FFFFFF;
	text-shadow: 0px 4px 4px #371359;
	text-decoration: none;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: no; 
}  
.nav_name_sim {
	position: relative;      
	margin: 0;
	padding: 0;
	font-weight: 500;
	margin-left: 8px;
}
.nav_name_game {
	position: relative;
	margin: 0;
	padding: 0;
	font-weight: 250;
}
.logo_svg {
	width: 45px; 
	height: 45px;
}
.cours_nav {
	display: flex;
	align-items: center;
	margin-left: 6px;
	overflow: visible;
	padding: 0 2px;
}
/*step_навигация по вкладкам-----------------------------------------*/
.step_btn {
	position: relative;
	display: flex; 
	justify-content: center; 
	align-items: center;
	height: 100%;
	width: 50px; 
	border: none; 
	outline: none; 
	background: var(--background-step-btn);
	color: var(--color-step-btn);
	font-size: 23px;
	cursor: pointer;
	transition: 0.6s;
}
.step_btn:hover {
	background: var(--background-step-btn);
	color: var(--background-step-btn-active);
	transition: 0.6s;	
}
.step_btn.active {
	background: var(--background-step-btn-active);
	color:var(--background-sidebar);
	transition: 0.6s;	
}
/*---------------------------------------------------------------------*/

/*Персональные настройки-----------------------------------------------*/
.user_settings {
	position: absolute;
	display: none;
	flex-direction: column;
	text-align: center;
	margin: 0;
	z-index: 1030;

	top: 50px;

	right: 0;
	
	background: #13171D;

	min-width: 170px;
	width: 300px;

	height: auto;
	border-radius: 0 0 0 8px;
	box-shadow: 0px 6px 10px rgb(0 0 0 / 25%);

	transition: 0.3s ease-out;

	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: no;
}
.user_settings_btns {
	display: flex;
	flex-direction: column; 
	padding: 10px 0 0 0;
}
.header_user {
	position: relative;
	margin: 0;
	padding: 0 0 8px;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
}
.your_name {
	position: relative;
	text-align: left;
	color: #ffffff;
	font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
	margin-left: 20px;
	font-size: 17px;
	font-weight: 300;
	width: calc(300px - 60px);
	white-space: nowrap; 
	overflow: hidden; 
	text-overflow: ellipsis; 	
}
.team_head_btn {
	position: relative; 
	display: flex; 
	align-items: center; 
	justify-content: center; 
	color: #9C9C9C; 
	margin-right: 20px;
	outline: none;
	border: none;
	background: transparent;
	width: auto;
	font-size: 20px;
	transition: 0.6s;
	cursor: pointer;
	transition: 0.6s;
}
.team_head_btn:hover {
	color: #fff;
	transition: 0.6s;
}
.team_wrap_headerbar {
	position: relative;
	display: none;
/*	display: flex;*/
	flex-direction: column;



	margin: 0;
	padding: 0 0 15px 0;
	background: #191E25;
}
.team_name_headerbar {
	position: relative;
	display: block;
	text-align: left;
	font-size: 16px;
	line-height: 16px;
	color: #c1c1c1;
	padding: 15px 20px 0px 20px;
	margin-bottom: 8px;
	font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
	font-weight: 100;
	left: 0;
	top: 0;
	transition: all 0.6s ease 0s;
	width: calc(300px - 40px);
	white-space: nowrap; 
	overflow: hidden; 
	text-overflow: ellipsis; 	    
}
.teammate_headerbar {
	display: flex;
	flex-direction: row;
	align-items: center;
	width: calc(300px - 40px);	  
	margin: 1px 20px;  
	height: auto;
}
.teammate_headerbar::before {
	position: relative;
	display: block;
	width: 10px;
	height: 10px;
	border-radius: 30px;
	background: #606060;
	box-shadow: inset 0px 0px 5px rgba(34, 34, 34, 0.68);
	padding: 0;
	margin: 0;
	content: "";
	left: 0;
	transition: all 0.6s ease 0s;
}
.teammate_headerbar.online::before{
	background: #46E043;
}
.teammate_email_hb {
	position: relative;
	text-align: left;
	width: 235px;
	margin-left: 15px;
	white-space: nowrap; 
	overflow: hidden; 
	text-overflow: ellipsis; 
	color: rgba(255, 255, 255, 0.55);
	white-space: nowrap;
	font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
	font-size: 14px;
	font-weight: 100;
}
.footer_user {
	position: relative;
	margin: 0;
	padding: 10px 20px 8px 20px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	background: rgba(0,0,0,.05);
}
.footer_user_btn {
	display: flex;
	outline: none;
	border: 0;
	background: transparent;
	color: #9c9c9c;
	font-size: 16px;
	line-height: 16px;
	height: 23px;
	margin-bottom: 5px;
	white-space: nowrap;
	align-items: center;
	font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
	transition: 0.6s;
	cursor: pointer;
	text-decoration: none;
}
.footer_user_btn:hover {
	color: #fff;
	transition: 0.6s;
}
.btn_us {
	outline: none;
	border: none;
	text-align: left;
	background: transparent;
	color: #9c9c9c;
	padding: 5px 10px;
	font-size: 16px;
	line-height: 16px;
	white-space: nowrap;
	align-items: center;
	font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
}
.btn_us:hover {
	color: #fff;
	transition: 0.3s;
}
/*---------------------------------------------------------------------*/
















::-webkit-scrollbar {
	width: 8px;
	height: 10px;  
}

::-webkit-scrollbar-track {
-webkit-box-shadow: 0 0 2px rgba(91, 91, 91, .1) inset;
box-shadow: 0 0 2px rgba(91, 91, 91, .1) inset;
}

::-webkit-scrollbar-thumb {
	background: #727F8D;
	border-radius: 8px;
	border: 3px solid #13171D;
}



@media (max-width: 900px) {
	.main-sidebar {
		width: 16em;
	}
	.nav_start {
		position: fixed;
		display: flex;
		flex-direction: row;
		z-index: 1032;
		width: calc(100% - 16em);
		margin-left: 16em;
		top:0;
		align-items: center;
		height: 40px;
		transition: 0.3s ease-out;
	}
	.data_article {
		position: relative;
		overflow-y: scroll;
		overflow-x: hidden;
		flex-grow: 1;
		min-height: calc(100vh -  80px);
		height: 300px;
		padding-top: 0;
		transition: 0.3s ease-out;
		text-align: center;
	}
	.step_btn {
		height: 100%;
		width: 40px; 
		font-size: 20px;
	}
	.name {
		line-height: 40px;
		font-size: 25px;
	}  
	.nav_name_sim {
		position: relative;      
		margin: 0;
		padding: 0;
		font-weight: 500;
		margin-left: 8px;
	}
	.nav_name_game {
		position: relative;
		margin: 0;
		padding: 0;
		font-weight: 250;
	}
	#logo_well,
	#logo_game {
		display: none;
	}
	.logo_svg {
		width: 35px; 
		height: 35px;
	}
	.header_settings {
		height: 40px;
		transition: 0.3s ease-out;
	}
	.npi_logo {
		display: flex; 
		align-items: center;
		margin-left: 7px; 
		padding: 0;
	}
	.status {
		font-size: 13px;
		line-height: 15px;
		margin-right: 30px;
	}
	.status::before {
		font-size: 13px;
		padding-right: 12px;
	}
	.balance {
		height: 40px;
		margin-right: 25px;
		font-size: 13px;
		line-height: 15px;
	}
	.balance::before {
		font-size: 13px;
		padding-right: 12px;
	}
	.user_home {
		cursor: pointer;
		outline: none;
		border: none;
		background: none;
		height: 40px;
		color: #9c9c9c;
		font-size: 13px;
		line-height: 15px;
		white-space: nowrap;
		align-items: center;
		font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";		
		transition: 0.3s;
		-webkit-touch-callout: none;
		-webkit-user-select: none;
		-khtml-user-select: none;
		-moz-user-select: none;
		-ms-user-select: no; 
	}
	.user_home:hover {
		color: #fff;
		transition: 0.3s;	
	}

/*end*/

.close_arrow {
	height: 40px;
	width: 40px;
	font-size: 20px;
	transition: 0.6s;
}
.gen_tab {
	padding: 8px 8px 10px 15px;
	font-size: 14px;
	line-height: 14px;	
	font-weight: 100;
	transition: 0.6s;
}
.gen_tab:hover,
.gen_tab.active_ac {
	color: #BBBBBB;
	transition: 0.6s;
}
.gen_tab:after {
	position: absolute;
	content: "";
	top: 12px;
	right: 10px;
	width: 0;
	height: 0;
	border: 6px solid transparent;
	border-color: #fff transparent transparent transparent;
	float: left;		
	-webkit-transition: 0.6s;
	-o-transition: 0.6s;
	transition: 0.6s;  
}
.gen_tab.active_ac:after {
	border-color: transparent transparent rgba(202, 202, 202, .5) transparent;
	top: 6px;
	-webkit-transition: 0.6s;
	-o-transition: 0.6s;
	transition: 0.6s;  
}
.tab_wrap {
	position: relative;
	display: block;
	transition: 0s ease-in;
	opacity: 1;
}
.btn_tabs {
	font-size: 14px;
	line-height: 14px;
	padding: 8px 8px 10px 25px;
	-webkit-transition: 0.6s;
	-o-transition: 0.6s;
	transition: 0.6s;    
}
.btn_gen_tabs {
	font-size: 14px;
	line-height: 14px;
	padding: 8px 8px 10px 15px;
	transition: 0.6s;    
}
.copyright {
	height: 40px;
	font-size: 12px;
	line-height: 14px;
}
.link {
	font-size: 12px;
	line-height: 14px;
}

/*Персональные настройки-----------------------------------------------*/
.user_settings {
	top: 40px;
	width: 250px;
}
.user_settings_btns {
	padding: 8px 0 0 0;
}
.header_user {
	margin: 0;
	padding: 0 0 8px;
}
.your_name {margin-left: 15px;
	font-size: 14px;
	font-weight: 300;
	width: calc(250px - 50px);
	white-space: nowrap; 
	overflow: hidden; 
	text-overflow: ellipsis; 	
}
.team_head_btn {
	position: relative; 
	display: flex; 
	align-items: center; 
	justify-content: center; 
	color: #9C9C9C; 
	margin-right: 15px;
	outline: none;
	border: none;
	background: transparent;
	width: auto;
	font-size: 20px;
	transition: 0.6s;
	cursor: pointer;
	transition: 0.6s;
}
.team_head_btn:hover {
	color: #fff;
	transition: 0.6s;
}
.team_wrap_headerbar {
	margin: 0;
	padding: 0 0 8px 0;
}
.team_name_headerbar {
	font-size: 14px;
	line-height: 14px;
	padding: 8px 8px 0 15px;
	margin-bottom: 6px;

	width: calc(250px - 30px);    
}
.teammate_headerbar {

	width: calc(250px - 30px);	 

	margin: 1px 15px;  
	height: auto;
}
.teammate_headerbar::before {
	position: relative;
	display: block;
	width: 10px;
	height: 10px;
	border-radius: 30px;
	background: #606060;
	box-shadow: inset 0px 0px 5px rgba(34, 34, 34, 0.68);
	padding: 0;
	margin: 0;
	content: "";
	left: 0;
	transition: all 0.6s ease 0s;
}
.teammate_email_hb {
	position: relative;
	text-align: left;
	width: 195px;
	margin-left: 15px;
	white-space: nowrap; 
	overflow: hidden; 
	text-overflow: ellipsis; 
	color: rgba(255, 255, 255, 0.55);
	white-space: nowrap;
	font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
	font-size: 12px;
	font-weight: 100;
}
.footer_user {
	position: relative;
	margin: 0;
	padding: 8px 15px 3px 15px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	background: rgba(0,0,0,.05);
}
.footer_user_btn {
	display: flex;
	outline: none;
	border: 0;
	background: transparent;
	color: #9c9c9c;
	font-size: 14px;
	line-height: 14px;
   height: 20px;
	margin-bottom: 5px;
	white-space: nowrap;
	align-items: center;
	font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
	transition: 0.6s;
	cursor: pointer;
	text-decoration: none;
}

/*---------------------------------------------------------------------*/



}

@media (min-width: 2100px) {
	.main-sidebar {
		width: 30em;
	}
	.nav_start {
		position: fixed;
		display: flex;
		flex-direction: row;
		z-index: 1032;
		width: calc(100% - 30em);
		margin-left: 30em;
		top:0;
		align-items: center;
		height: 65px;
		transition: 0.3s ease-out;
	}
	.data_article {
		position: relative;
		overflow-y: scroll;
		overflow-x: hidden;
		flex-grow: 1;
		min-height: calc(100vh -  130px);
		height: 300px;
		padding-top: 0;
		transition: 0.3s ease-out;
		text-align: center;
	}
	.step_btn {
		height: 100%;
		width: 65px; 
		font-size: 30px;
	}
	.name {
		line-height: 65px;
		font-size: 41px;
	}  
	.nav_name_sim {
		position: relative;      
		margin: 0;
		padding: 0;
		font-weight: 500;
		margin-left: 8px;
	}
	.nav_name_game {
		position: relative;
		margin: 0;
		padding: 0;
		font-weight: 250;
	}
	.logo_svg {
		width: 55px; 
		height: 55px;
	}
	.header_settings {
		height: 65px;
		transition: 0.3s ease-out;
	}
	.npi_logo {
		display: flex; 
		align-items: center;
		margin-left: 16px; 
		padding: 0;
	}
	.close_arrow {
		height: 65px;
		width: 65px;

		font-size: 30px;
		transition: 0.6s;
	}
	.gen_tab {
		padding: 12px 12px 14px 24px;
		font-size: 18px;
		line-height: 18px;	
		font-weight: 100;

		transition: 0.6s;
	}
	.gen_tab:hover,
	.gen_tab.active_ac {
		color: #BBBBBB;
		transition: 0.6s;
	}
	.gen_tab:after {
		position: absolute;
		content: "";
		top: 12px;
		right: 10px;
		width: 0;
		height: 0;
		border: 6px solid transparent;
		border-color: #fff transparent transparent transparent;
		float: left;
		
		-webkit-transition: 0.6s;
		-o-transition: 0.6s;
		transition: 0.6s;  
	}
	.gen_tab.active_ac:after {
		border-color: transparent transparent rgba(202, 202, 202, .5) transparent;
		top: 6px;

		-webkit-transition: 0.6s;
		-o-transition: 0.6s;
		transition: 0.6s;  
	}
	.tab_wrap {
		position: relative;
		display: block;
		transition: 0s ease-in;
		opacity: 1;
	}
	.btn_tabs {
		font-size: 18px;
		line-height: 18px;
		padding: 12px 12px 14px 34px;

		-webkit-transition: 0.6s;
		-o-transition: 0.6s;
		transition: 0.6s;    
	}
	.btn_gen_tabs {
		font-size: 18px;
		line-height: 18px;
		padding: 12px 12px 14px 24px;
		transition: 0.6s;    
	}
	.copyright {
		height: 65px;
		font-size: 16px;
		line-height: 16px;
	}
	.link {
		font-size: 16px;
		line-height: 16px;	
	}

/*Персональные настройки-----------------------------------------------*/
.user_settings {
	top: 58px;
}
/*---------------------------------------------------------------------*/



}