  
:root {
	--main-color-1: #556688;
	--main-color-2: #8998b6;
	--main-color-3: #d9dce6;
	--main-color-4: #f9f9f9;
	--main-color-text: #fcfcfc;
	font-family:'Roboto';
}

body {
	background-color:var(--main-color-4);
	display: flex;
	flex-direction: row;
	justify-content: center;
}

.main_wrapper {
	position:absolute;
	top:94px;
	width:90%;
	min-height:1000px;
	display: flex;
	flex-direction: column;
	justify-content: start;
}

.navigation_bar_wrp {
	position:relative;
	width:100%;
	height:50px;
	display: flex;
	flex-direction: row;
	justify-content: center;
}

.navigation_bar {
	position:relative;
	width:100%;
	height:100%;
	background-color:var(--main-color-1);
	border-radius:4px;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.navigation_bar_text {
	position:relative;
	display: flex;
	flex-direction: row;
	justify-content: start;
	padding-left:20px;
	color:var(--main-color-text);
	font-size:30px;
	font-weight:700;
	top:-2px;
}

.content_wrp {
	position:relative;
	display: flex;
	flex-direction: column;
	justify-content: start;
	min-height: 1000px;
	padding:20px;
	background-color: white;
	background-position:  4px 0, 4px 0, 0 0, 0 0;
	background-size: 4px 4px;
	background-repeat: repeat;
}

/* ======================================================================================= */


.header_wrapper {
	/* width: 100%;
	height: 100%; */
}

.container-app {
	position: relative;
	width: 100%;
	margin: 0 auto;
	box-sizing: border-box;
	display: flex;
	justify-content: center;
}

.container {
	position: relative;
	width: 90%;
	margin: 0 auto;
	box-sizing: border-box;
}

ul {
	list-style: circle inside;
}

.header {
	font-size: 1.5em;
	line-height: 1.6;
	font-weight: 400;
	font-family: "Roboto", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
	color: #1d1d1b;
	overflow: hidden;


	position: fixed;
	top: 0;
	left: 0;
	height: 75px;
	box-shadow: 1px 1px 6px rgba(29, 24, 31, 0.4);
	width: 100%;
	padding: 0;
	z-index: 999;
	-webkit-transform: translateY(0%);
	-moz-transform: translateY(0%);
	transform: translateY(0%);
	
	background-color: #11181f;
}

.header .container {
	background-color: transparent;
	z-index: 991;
}

.topwhite .header {
	background-color: #fff;
}

/* .header .logo {

	width: 300px;
	height:100px;
	margin-top:15px;
	position: relative;
	float: left;
	
	background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJMaXZlbGxvXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeD0iMCIgeT0iMCIgdmlld0JveD0iMCAwIDQ0Ni44IDY3LjQiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxzdHlsZT4uc3Qwe2ZpbGw6I2ZmZn08L3N0eWxlPjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik0zNDkuNCAyMy42bC02LjgtMTEuOEwzNDkuNCAwSDM2M2w2LjggMTEuOC02LjggMTEuOHpNMzc0LjkgMzguOEwzNjguMSAyN2w2LjgtMTEuN2gxMy42bDYuOCAxMS43LTYuOCAxMS44ek00MDAuOCAyMy42TDM5NCAxMS44IDQwMC44IDBoMTMuNmw2LjggMTEuOC02LjggMTEuOHpNNDI2LjQgMzguOEw0MTkuNiAyN2w2LjgtMTEuN0g0NDBsNi44IDExLjctNi44IDExLjh6TTM0OS40IDUyLjFsLTYuOC0xMS44IDYuOC0xMS44SDM2M2w2LjggMTEuOC02LjggMTEuOHpNMzc0LjkgNjcuNGwtNi44LTExLjggNi44LTExLjhoMTMuNmw2LjggMTEuOC02LjggMTEuOHpNNDAwLjggNTIuMUwzOTQgNDAuM2w2LjgtMTEuOGgxMy42bDYuOCAxMS44LTYuOCAxMS44ek00MjYuNCA2Ny40bC02LjgtMTEuOCA2LjgtMTEuOEg0NDBsNi44IDExLjgtNi44IDExLjh6Ii8+PGc+PHBhdGggY2xhc3M9InN0MCIgZD0iTTAgNTIuMVYxNC40QzAgMTEuNi43IDkuMiAyIDdzMy0zLjkgNS4xLTUuMVMxMS43IDAgMTQuNCAwSDMzdjcuOEgxNS40Yy0xLjkgMC0zLjQuNi00LjYgMS45QzkuNiAxMSA5IDEyLjUgOSAxNC4zdjkuNWgyMS41djcuOEg4LjlWNTJIMHpNNDAuOCA1Mi4xVjBoOC42djUyLjFoLTguNnpNNzYuNCA1Mi4xYy00LjMgMC04LS44LTExLjItMi40LTMuMi0xLjYtNS43LTMuOC03LjUtNi43LTEuOC0yLjktMi43LTYuMS0yLjctOS45IDAtMy45LjgtNy40IDIuNC0xMC4zIDEuNi0zIDMuOC01LjMgNi41LTcgMi44LTEuNyA2LTIuNSA5LjYtMi41IDQuMSAwIDcuNC45IDEwIDIuNiAyLjYgMS43IDQuNiA0LjEgNS44IDcgMS4zIDIuOSAxLjkgNi4yIDEuOSA5LjggMCAuNSAwIDEuMS0uMSAxLjcgMCAuNi0uMSAxLjEtLjIgMS41SDY0LjFjLjMgMiAxIDMuNiAyLjIgNC45IDEuMSAxLjMgMi42IDIuMyA0LjMgMyAxLjcuNyAzLjcgMSA1LjggMWgxMC4ydjcuM0g3Ni40ek02NCAzMGgxOC43YzAtLjktLjItMS45LS40LTIuOHMtLjYtMS44LTEtMi43Yy0uNS0uOC0xLjEtMS42LTEuOC0yLjItLjctLjYtMS42LTEuMS0yLjYtMS41LTEtLjQtMi4xLS42LTMuNC0uNi0xLjUgMC0yLjguMy0zLjkuOS0xLjEuNi0yLjEgMS4zLTIuOSAyLjItLjguOS0xLjQgMi0xLjggMy4xLS41IDEuMy0uNyAyLjUtLjkgMy42ek05Ni44IDUyLjFMMTA5IDM1Yy0yLjEtLjktNC0yLjEtNS41LTMuNi0xLjYtMS41LTIuOC0zLjMtMy42LTUuMi0uOS0yLTEuMy00LjEtMS4zLTYuNHYtNS43aDguNnY1LjdjMCAxLjYuNCAzIDEuMSA0LjQuNyAxLjMgMS43IDIuNCAzIDMuMyAxLjMuOSAyLjYgMS41IDQuMSAxLjdsMTAuNi0xNWg5LjRsLTExLjcgMTYuM2MyLjQuOCA0LjUgMiA2LjIgMy42IDEuNyAxLjYgMy4xIDMuNCA0IDUuNS45IDIuMSAxLjQgNC40IDEuNCA2Ljh2NS43aC04LjV2LTUuN2MwLTEuNy0uNC0zLjMtMS4zLTQuOC0uOC0xLjQtMi0yLjYtMy41LTMuNS0xLjUtLjktMy4xLTEuNC00LjktMS41bC0xMC45IDE1LjVoLTkuNHpNMTQ0IDUyLjF2LTcuOGgyMi40YzEuNCAwIDIuNy0uMyAzLjgtMSAxLjEtLjcgMS45LTEuNiAyLjUtMi43LjYtMS4xLjktMi4zLjktMy41IDAtMS4zLS4zLTIuNi0uOS0zLjYtLjYtMS4xLTEuNC0yLTIuNS0yLjYtMS4xLS42LTIuMy0xLTMuNy0xaC05LjNjLTIuOSAwLTUuNS0uNi03LjgtMS44LTIuMy0xLjItNC4xLTIuOS01LjUtNS4xLTEuMy0yLjItMi00LjgtMi03LjcgMC0zIC42LTUuNiAxLjktNy44IDEuMy0yLjMgMy00IDUuMy01LjMgMi4yLTEuMyA0LjgtMS45IDcuNi0xLjloMjIuNHY3LjhoLTIxLjZjLTEuMyAwLTIuNS4zLTMuNSAxLTEgLjYtMS44IDEuNS0yLjQgMi41LS42IDEtLjkgMi4yLS45IDMuMyAwIDEuMi4zIDIuNC45IDMuNC42IDEgMS40IDEuOCAyLjQgMi41IDEgLjYgMi4yLjkgMy41LjloOS41YzMuMiAwIDUuOS42IDguMiAxLjkgMi4zIDEuMiA0LjEgMyA1LjQgNS4xIDEuMyAyLjIgMS45IDQuNyAxLjkgNy41IDAgMy4zLS43IDYuMi0yIDguNi0xLjMgMi40LTMuMSA0LjMtNS40IDUuNi0yLjMgMS4zLTQuOCAyLTcuNiAySDE0NHpNMjA3LjMgNTIuMWMtNC4zIDAtOC0uOC0xMS4yLTIuNC0zLjItMS42LTUuNy0zLjgtNy41LTYuNy0xLjgtMi45LTIuNy02LjEtMi43LTkuOSAwLTMuOS44LTcuNCAyLjQtMTAuMyAxLjYtMyAzLjgtNS4zIDYuNS03IDIuOC0xLjcgNi0yLjUgOS42LTIuNSA0LjEgMCA3LjQuOSAxMCAyLjYgMi42IDEuNyA0LjYgNC4xIDUuOCA3IDEuMyAyLjkgMS45IDYuMiAxLjkgOS44IDAgLjUgMCAxLjEtLjEgMS43IDAgLjYtLjEgMS4xLS4yIDEuNUgxOTVjLjMgMiAxIDMuNiAyLjIgNC45IDEuMSAxLjMgMi42IDIuMyA0LjMgMyAxLjcuNyAzLjcgMSA1LjggMWgxMC4ydjcuM2gtMTAuMnpNMTk1IDMwaDE4LjdjMC0uOS0uMi0xLjktLjQtMi44cy0uNi0xLjgtMS0yLjdjLS41LS44LTEuMS0xLjYtMS44LTIuMi0uNy0uNi0xLjYtMS4xLTIuNi0xLjUtMS0uNC0yLjEtLjYtMy40LS42LTEuNSAwLTIuOC4zLTMuOS45LTEuMS42LTIuMSAxLjMtMi45IDIuMi0uOC45LTEuNCAyLTEuOCAzLjEtLjUgMS4zLS44IDIuNS0uOSAzLjZ6TTIyNi43IDUyLjFWMjQuOWMwLTMuNCAxLTYgMi45LTcuOSAxLjktMS45IDQuNS0yLjkgNy45LTIuOWg5LjF2Ny4zSDIzOWMtMS4yIDAtMi4xLjMtMi44IDEtLjcuNy0xIDEuNi0xIDIuOFY1MmgtOC41ek0yNjkuNyA1M2MtMiAwLTMuOC0uNS01LjMtMS42LTEuNi0xLjEtMi43LTIuNi0zLjQtNC40bC0xMS42LTMyLjhoOS4zbDkuOSAyOS41Yy4xLjMuMy42LjUuNy4yLjEuNC4yLjcuMi4yIDAgLjUtLjEuNy0uMi4yLS4xLjQtLjQuNS0uN2wxMC0yOS41aDkuMUwyNzguNCA0N2MtLjYgMS44LTEuOCAzLjMtMy4zIDQuNC0xLjcgMS0zLjQgMS42LTUuNCAxLjZ6TTMxMi40IDUyLjFjLTQuMyAwLTgtLjgtMTEuMi0yLjQtMy4yLTEuNi01LjctMy44LTcuNS02LjctMS44LTIuOS0yLjctNi4xLTIuNy05LjkgMC0zLjkuOC03LjQgMi40LTEwLjMgMS42LTMgMy44LTUuMyA2LjUtNyAyLjgtMS43IDYtMi41IDkuNi0yLjUgNC4xIDAgNy40LjkgMTAgMi42IDIuNiAxLjcgNC42IDQuMSA1LjggNyAxLjMgMi45IDEuOSA2LjIgMS45IDkuOCAwIC41IDAgMS4xLS4xIDEuNyAwIC42LS4xIDEuMS0uMiAxLjVIMzAwYy4zIDIgMSAzLjYgMi4yIDQuOSAxLjEgMS4zIDIuNiAyLjMgNC4zIDMgMS43LjcgMy43IDEgNS44IDFoMTAuMnY3LjNoLTEwLjF6TTMwMC4xIDMwaDE4LjdjMC0uOS0uMi0xLjktLjQtMi44cy0uNi0xLjgtMS0yLjdjLS41LS44LTEuMS0xLjYtMS44LTIuMi0uNy0uNi0xLjYtMS4xLTIuNi0xLjUtMS0uNC0yLjEtLjYtMy40LS42LTEuNSAwLTIuOC4zLTMuOS45LTEuMS42LTIuMSAxLjMtMi45IDIuMi0uOC45LTEuNCAyLTEuOCAzLjEtLjUgMS4zLS44IDIuNS0uOSAzLjZ6Ii8+PC9nPjwvc3ZnPg==);

	background-repeat:no-repeat;
} */

.header .logo {
	width: 276px;
	height: 84px;
    margin-top: 9px;
	position: relative;
	float: left;
	background-size: contain;
	background-repeat:no-repeat;
	background-image: url("logo_fw.png");
}

.header .logo .beta {
	font-size:18px;
	font-weight:400;
	font-family:Arial Black;
	color:var(--medium-blue);
	margin-left:82px;
	margin-top:32px;
	/*transform: rotate(-35deg);*/
	opacity:0.8;
	
}

.header .header-front {
	margin: 0 auto;
	display: block;
	height: 100%;
	text-align: center;
	-webkit-transform-origin: 50% 100%;
	-moz-transform-origin: 50% 100%;
	transform-origin: 50% 100%;
}

.header h1,
.header h1::before,
.header h1 span,
.header nav,
.header nav::before {
	display: inline-block;
	vertical-align: middle;
	text-align: left;
	margin-top:3px;
	width: 40%;
}

.header h1::before {
	content: '';
	height: 100%;
}

.header .container {
	height: 70px;
}

.header .container .row {
	height: 70px;
}

.header nav {
	height: 70px;
	line-height: 70px;
	float: right;
	text-align: right;
	
}

.header nav ul {
	padding: 0;
	margin: 0 auto;
	float: right;
	height: auto;
	line-height: 70px;
	text-align: right;
	position: relative;
	display: inline-table;
	
}

.header nav ul li {
	padding: 0;
	margin: 0;
	display: inline;
	height: 70px;
	line-height: 70px;
	margin-right: 4rem;
	float: left;
	position: relative; color: #fff;
}

.header nav ul li:last-of-type {

	margin-right: 0rem;

}

.header nav ul li:first-child {
	margin-left: 0px;
}

.header nav a {
	display: inline-block;
	margin: 0;
	font-size: 16px;
	cursor: pointer;
	color: #fff;
	outline: none;
	text-decoration: none;
	height: 70px;
	line-height: 70px;
	position: relative;
	padding: 0;
	text-transform: uppercase;
	font-weight: 700;
}

.header nav li.active a {
	color: #ccc;
}

.header nav li.active a:hover {
	color: #ccc;
}

.header nav li.active li a {
	color: #fff;
}

.header nav li.active li a:hover {
	color: #ccc;
}

.header nav li.active li.active a {
	color: #ccc;
}

.header nav li.active li.active a:hover {
	color: #ccc;
}

.header nav a:hover {
	color: #ccc;
}

.menu {
	float: right;
	position: relative;
	display: block;
	line-height: 70px;

}

.menu span {
	display: block;
	text-align: center;
	cursor: pointer;
	
}

.menu .menu-icon i {
	font-size: 4rem;
	color: #fff;
	position: relative;
	top: 1rem;

}

.menu .menu-icon:hover i {
	color: #ccc;
}

.menu .menu-icon.close i {
	color: #9d9d9c;
}

.menu .menu-icon.close:hover i {
	color: #9d9d9c;
}

.user-menu{
	color: white;
	display: flex;
	margin: auto;
	vertical-align: middle;
	text-align: center;
	font-size:18px; 
}

.user-menu a {
	width: 40px;
	margin: auto !important;
	display: flex !important;
	height: 40px !important;
	margin-right: 8px !important;
}

.user-menu a:hover img {
	opacity: 0.7;
}

.user-menu a img{
	max-width: 40px;
	display: block;
	margin-top:1px;
	max-height: 40px;
}

.label-studio {
	position:relative;
	float:left;

	height:62px;
	line-height: 62px;
	color:#fff;
	font-size:36px;
	font-weight:bold;
	margin-top:6px;
	margin-left:4rem;
	margin-right:2rem;
}

.label-agency {
	position:relative;
	float:left;
	line-height: 62px;
	height:62px;
	color:#fff;
	font-size:36px;
	font-weight:bold;
	
	margin-top:6px;
	margin-left:10px;
}

