
@font-face {
  font-family: 'Material';
  src: 
  url('../fonts/materials/Material-Design-Iconic-Font.woff2?v=2.2.0') format('woff2'), 
  url('../fonts/materials/Material-Design-Iconic-Font.woff?v=2.2.0') format('woff'), 
  url('../fonts/materials/Material-Design-Iconic-Font.ttf?v=2.2.0') format('truetype');
  font-weight: normal;
  font-style: normal;
}

/* Menu styles */
.menu__wrap, .menu__searchMenuDiv {
	position: absolute;
	top: 6.5em;
	overflow-x: hidden;
	bottom: 0;
	width: 99%;
}

.menu__level {
	position: absolute;
	top: 0;
	left: 0;
	visibility: hidden;
	overflow-x: hidden;
	overflow-y: auto;
	width: calc(100%);
	height: 100%;
	margin: 0;
	padding: 0;
	list-style-type: none;
  	scrollbar-color: auto;
  	scrollbar-width: thin;
}

.menu__level:focus {
	outline: none;
}

.menu__level--current {
	visibility: visible;
}

.menu__item {
	display: block;
	width:99%;
}

.menu__link{
	float:left;
	font-weight: 600;
	position: relative;
	vertical-align: middle;
	display: block;
 	padding: 5px 10px 5px 6px;
	color: white;
	-webkit-transition: color 0.1s;
	transition: color 0.1s;
	width:90%;
	margin-left: 3px;
}

.menu__linkDirect{
	float:left;
	position: relative;
	vertical-align: middle;
	display: block;
 	padding: 5px 10px 5px 6px;
	color: white;
	-webkit-transition: color 0.1s;
	transition: color 0.1s;
	width:90%;
    margin-left: 3px;
}

.menu__add__Fav:after{
float: left;
    content: '\f27d';
    font-family: 'Material';
    font-size: 18px;
    -webkit-text-stroke-width: 0.5px;
    text-shadow: 0.5px 0px 1px;
    -webkit-text-stroke-color: black;
    position: relative;
    top: 6px;
    right: 14px;
    color: var( --color-medium);
    width: 1px;
}
.menu__as__Fav::after{
    float: left;
    content: '\f27d';
    font-family: 'Material';
    font-size: 18px;
    position: relative;
    top: 6px;
    right: 14px;
    color: var(--color-secondary);
    display: block;
    -webkit-text-stroke-width: 0.2px;
    -webkit-text-stroke-color: black;
    width: 1px;
}


.menu__link[data-submenu]::after {
	content: '\f2fb';
	font-family: 'Material';
	position: absolute;
	right: 4px;
	color: var(--color-secondary);
}

.menu__as__Fav:hover::after, .menu__link[data-submenu]:hover::after, .menu__as__Fav:hover::after, .menu__add__Fav:hover::after{
	cursor:pointer;
}
.menu__link--current {
    color: var(--color-secondary);
   	border-left: 3px solid var(--color-secondary);
   	padding: 5px 10px 5px 6px;
   	margin-left:0px;
}

.div__link{
    padding-top: 5px;
    float: right;
    height: 30px;
}


.menu__link:hover,.menu__linkDirect:hover
.menu__link:focus,
.menu__link[data-submenu]:hover::after,
.menu__link[data-submenu]:focus::after {
	color: var(--color-secondary);
}


.menuTop{
	-webkit-transition: -webkit-transform 0.5s, width 0.5s;
	-moz-transition: -moz-transform 0.5s, width 0.5s;
	transition: transform 0.5s, width 0.5s;
}

[class^='animate-'],
[class*=' animate-'] {
	visibility: visible;
}

.animate-outToRightLow .menu__item {
	-webkit-animation: outToRight 0.5s both cubic-bezier(0.5, 0, 0.3, 0.5);
	animation: outToRight 0.5s both cubic-bezier(0.5, 0, 0.3, 0.5);
}

.animate-outToRightMed .menu__item {
	-webkit-animation: outToRight 0.25s both cubic-bezier(0.3, 0, 0.2, 0.3);
	animation: outToRight 0.25s both cubic-bezier(0.3, 0, 0.2, 0.3);
}

.animate-outToRightFast .menu__item {
	-webkit-animation: outToRight 0.1s both cubic-bezier(0.1, 0, 0.1, 0.1);
	animation: outToRight 0.1s both cubic-bezier(0.1, 0, 0.1, 0.1);
}



@-webkit-keyframes outToRight {
	to {
		opacity: 0;
		-webkit-transform: translate3d(100%, 0, 0);
		transform: translate3d(100%, 0, 0);
	}
}

@keyframes outToRight {
	to {
		opacity: 0;
		-webkit-transform: translate3d(100%, 0, 0);
		transform: translate3d(100%, 0, 0);
	}
}

.animate-outToLeftLow .menu__item {
	-webkit-animation: outToLeft 0.5s both cubic-bezier(0.5, 0, 0.3, 0.5);
	animation: outToLeft 0.5s both cubic-bezier(0.5, 0, 0.3, 0.5);
}

.animate-outToLeftMed .menu__item {
	-webkit-animation: outToLeft 0.25s both cubic-bezier(0.3, 0, 0.2, 0.3);
	animation: outToLeft 0.25s both cubic-bezier(0.3, 0, 0.2, 0.3);
}
.animate-outToLeftFast .menu__item {
	-webkit-animation: outToLeft 0.1s both cubic-bezier(0.1, 0, 0.1, 0.1);
	animation: outToLeft 0.1s both cubic-bezier(0.1, 0, 0.1, 0.1);
}

@-webkit-keyframes outToLeft {
	to {
		opacity: 0;
		-webkit-transform: translate3d(-100%, 0, 0);
		transform: translate3d(-100%, 0, 0);
	}
}

@keyframes outToLeft {
	to {
		opacity: 0;
		-webkit-transform: translate3d(-100%, 0, 0);
		transform: translate3d(-100%, 0, 0);
	}
}

.animate-inFromLeftLow .menu__item {
	-webkit-animation: inFromLeft 0.5s both cubic-bezier(0.5, 0, 0.3, 0.5);
	animation: inFromLeft 0.5s both cubic-bezier(0.5, 0, 0.3, 0.5);
}

.animate-inFromLeftMed .menu__item {
	-webkit-animation: inFromLeft 0.5s both cubic-bezier(0.3, 0, 0.2, 0.3);
	animation: inFromLeft 0.5s both cubic-bezier(0.3, 0, 0.2, 0.3);
}

.animate-inFromLeftFast .menu__item {
	-webkit-animation: inFromLeft 0.5s both cubic-bezier(0.1, 0, 0.1, 0.1);
	animation: inFromLeft 0.5s both cubic-bezier(0.1, 0, 0.1, 0.1);
}

@-webkit-keyframes inFromLeft {
	from {
		opacity: 0;
		-webkit-transform: translate3d(-100%, 0, 0);
		transform: translate3d(-100%, 0, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
}

@keyframes inFromLeft {
	from {
		opacity: 0;
		-webkit-transform: translate3d(-100%, 0, 0);
		transform: translate3d(-100%, 0, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
}

.animate-inFromRightLow .menu__item {
	-webkit-animation: inFromRight 0.5s both cubic-bezier(0.5, 0, 0.3, 0.5);
	animation: inFromRight 0.5s both cubic-bezier(0.5, 0, 0.3, 0.5);
}

.animate-inFromRightMed .menu__item {
	-webkit-animation: inFromRight 0.5s both cubic-bezier(0.3, 0, 0.2, 0.3);
	animation: inFromRight 0.5s both cubic-bezier(0.3, 0, 0.2, 0.3);
}

.animate-inFromRightFast .menu__item {
	-webkit-animation: inFromRight 0.5s both cubic-bezier(0.1, 0, 0.1, 0.1);
	animation: inFromRight 0.5s both cubic-bezier(0.1, 0, 0.1, 0.1);
}


@-webkit-keyframes inFromRight {
	from {
		opacity: 0;
		-webkit-transform: translate3d(100%, 0, 0);
		transform: translate3d(100%, 0, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
}

@keyframes inFromRight {
	from {
		opacity: 0;
		-webkit-transform: translate3d(100%, 0, 0);
		transform: translate3d(100%, 0, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
}

.menu__breadcrumbs {
	width:170px;
	font-size:9px;
	line-height: 1;
	position: relative;
 	padding: 0.85em 0.5em 0.85em 0.6em; 
}

.menu__breadcrumbs a {
	width:135px;
	margin-top: 9px;
    margin-left: 5px;
	font-weight: bold;
	display: inline-block;
	cursor: pointer;
	vertical-align: middle;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: var(--color-secondary);
}

.menu__breadcrumbs a:last-child {
	pointer-events: none;
}

.menu__breadcrumbs a:hover,
.menu__breadcrumbs a:focus {
	color: var(--color-light-secondary);
}


.menu__breadcrumbs a:not(:last-child):hover::after,
.menu__breadcrumbs a:not(:last-child):focus::after {
	color: var(--color-secondary);
}

.menuBottomDiv{
	height:95%;
}

.menuPluginToInstlal {
	font-style: italic;
	color: darkgray;
}

.menuSearchInput{
	float:right;
	opacitu:0.9;
    position: relative;
    width: 170px !important;
    right: 10px;
    background-color: white !important;
    border-radius:4px !important;
}

.researchMenuLeftMenu{
	float:left;
	width: 100%; 
	height: 26px;
	position: relative;
	margin: 12px 0px 8px 0px;
}

.clearSearchMenu{
	position: relative;
    float: left;
    left: 13em;
    top: 2px;
    transform:  rotate(0deg);
    transition: 0.2s;
    -webkit-filter : hue-rotate(var(--image-hue-rotate)) saturate(var(--image-saturate)) brightness(var(--image-brightness)) !important;
  	filter : hue-rotate(var(--image-hue-rotate)) saturate(var(--image-saturate)) brightness(var(--image-brightness))!important;
  	background-color: transparent!important;
}

.clearSearchMenu:hover{
	position: relative;
    float: left;
    left: 13em;
    top: 2px;
    transform:  rotate(-45deg);
    transition: 0.2s;
	-webkit-filter : hue-rotate(var(--image-hue-rotate-selected)) saturate(var(--image-saturate-selected)) brightness(var(--image-brightness-selected)) !important;
  	filter : hue-rotate(var(--image-hue-rotate-selected)) saturate(var(--image-saturate-selected)) brightness(var(--image-brightness-selected)) !important;
  	background-color: transparent !important;
  	cursor: pointer;
}

.sectionReportMenuSearch{
	border-bottom: 1px solid white;
    float: left;
    padding: 5px 10px 5px 6px;
    width: 80%;
    height: 15px;
    margin-left: 14px;
    margin-bottom: 12px;
    margin-top: 15px;
    position: relative;
    color:white;
}