
/*
This file contains separated css in order to be able to create partner specific design settings. 
ONLY THE SETTINGS BELOW MUST BE SITUATED IN THIS FILE! 
-colors,
- background images,
-font settings,
-size settings (be very careful not to override the stucture settings, it can influence the working of 
js files (window handling))

ANY OTHER CSS SETTING MUST NOT BE IN THIS CSS FILE!

IT IS STRONGLY RECOMMENDED NOT TO REMOVE OR ADD CSS RULES FROM THIS FILE. 
REMOVING OR ADDING CSS SETTINGS CAN MAKE UNWANTED CONSEQUENCE! 
WE RECOMMEND THAT ONLY MODIFY THE VALUES OF RULES!



Why we use [data-aid='some_data_aid'] selectors? Because our framework uses a lot of 
html snippet. These snippets are used multiple times in a page so the traditional html id's would be
reused and ambigous. Instead we introduced a new id. It does not make any problem if more than 
one data-aid has the same value. 

See the other css file's initial comment!
*/
@import 'https://fonts.googleapis.com/css?family=Dosis|Open+Sans|Poppins';

:root
{
	--s_font_main_family: 'Open Sans', Arial, Tahoma; /*"Poppins"*/
	/*System-wide color scheme settings in css vatiables*/

	/* The main color. It can be darker because it is used on small areas.  */
	--color_main: #680082; 
	/* The general background under texts*/

	--color_bg_text: #FFFFFF;
 	/* The background under working texts, like menus, table content, navigation bar, etc.*/
	--color_bg_work: #FFFFFF;	
	/*The color of the bottommost background layer of the window */
	--color_bg_window: #eff0f1;
	/*The hover color. */
	--color_bg_hover: #e1e1e2;	
	/*The secondary hover color. */
	--color_bg_hover_sec: #FFFFFF;
	/*The background color of a selection. */
	--color_bg_select: #0080c0;
	/*The background color of the required input elements. */
	--color_bg_required: #fff7f0;
	/*The background color of the focused input elements. */
	--color_bg_focus: #FFFFFF;
	/*The background color of even table rows. */
	--color_bg_even: ;	
	/*The nackground color for printers. Use to be white. */
	--color_bg_print: #FFFFFF;

	/*The color of borders of form elements an so on. */
	--color_border: #CCCCCC;
	/*The border color of a required form element. */
	--color_border_required: #d06200;
	/*The border color of the focused input elements. */
	--color_border_focus:  #680082;
	/*Border color for printers. */
	--color_border_print: #333333;

	/*The general color of letters in a text. */
	--color_font_text: #111111;
	/*The color of letter in a working text*/
	--color_font_work: #222222;
	/*Color of aux text, like plceholders, etc.*/
	--color_font_aux: #9a9a9a;
	/*Color of letters when hover mouse event fires. */
	--color_font_hover: #000000;
	/*Color of letters in a selected text. */
	--color_font_select: #FFFFFF;
	/*Printer's font color. Use to be black. */
	--color_font_print: #000000;
	/*A font color thet must appear on strong colored backgrunds, like tiles, tags, etc. */
	--color_font_inverse: #FFFFFF;

	/*Tájékoztató jellegű kiemelés színe: ilyen a magyarázat-buborék kerete és szövege.
	Szándékosan sem a hibajelzés pirosa, sem a fő arculati szín, mert nem hibát és nem
	márkajelzést közöl, hanem segítséget. Nem része a színsémának, mert a jelentése
	(„ez itt segítség") minden arculatnál ugyanaz. */
	--color_info: #1565c0;

	/*The general shadow color. Used under menus, windows, draggable widgets, etc.*/
	--color_shadow: #E0E0E0;
	/*The form field's ambient shadow */
	--color_shadow_ambient: #E0E0E0;

	/*Business function-group modules. Defines the colors of record type icons.*/	
	
	--color_mod_asset: #fb8400;
	--color_mod_doc: #0080c0;
	--color_mod_pic: #0080c0;
	--color_mod_time: #aa0000;
	--color_mod_message: #0080c0;
	--color_mod_invoice: #054767;
	--color_mod_item: #808080;
	--color_mod_sales: #e0281f;
	--color_mod_store: #325c5b;
	--color_mod_store_v: #325c5b;
	--color_mod_manufacture: #080253;
	--color_mod_org: #74AE0F;
	--color_mod_work: #fb8400;
	--color_mod_folder: #efcd0e; 	
}   


html
	{
		background-position: top left;
		background-size: cover;
		display: block;
		background-image:url('../background/background_default.jpg');
		
		
	}
@media only print
{
	html
	{
		background-image: none !important;
		background-color: var(--color_bg_print) !important;
	}
		
}

@media only screen and (max-width: 599px) 
{
	html
	{
		background-position: top left;
		background-size: 1920px 1080px;
		background-repeat: no-repeat;
		background-image:url('../background/background_default.jpg');
		filter: brightness(100%);
		
	}
}



body
{
	/*Default font type and font size*/
	

	background-color:var(--color_bg_work);
	font-family: var(--s_font_main_family);
	font-size: var(--i_font_main_size);
	color: var(--color_font_text);


	
	
	/*
	background-position: bottom right;
	background-repeat: no-repeat;
	background-size: 200px 50px;
	background-image:url('../../../../../specific/skin/skin_profile_1/global/icon/logo.png');
	*/
}



/*Form field conatiner: html div or table element for displaying additional information on form elemets 
such as filering or error feedback, explanation texts, etc. */
[data-aid="form_field_container"].iui_form_element_vertical [data-aid="field_container"]
{
	padding-bottom: 8px;
	
}
[data-aid="form_field_container"].iui_form_element_vertical [data-aid="field_container"]:not(:first-child)
{
	padding-left: 2px;
}
[data-aid="form_field_container"].iui_form_element_horizontal [data-aid="field_container"]
{
	padding-bottom: 4px;
}

[data-aid="form_field_container"] [data-aid='element_label']
{
	width:1%;
	text-align: right;
	padding-right: 10px;
	font-size: calc(var(--i_font_main_size) - 2px);
	text-transform: uppercase;
	color: var(--color_font_aux);
	line-height: 12px;
}

[data-aid="form_field_container"] div[data-aid='element_label']
{
	width:100%;
	text-align: left;
	height: 12px;

}

/*Form field labels in both div and table structures. */
div[data-aid="form_field_container"] [data-aid="element_label"], 
td[data-aid="form_field_container"] [data-aid="element_label"]
{
	overflow: hidden;
	padding-left: 2px;
	height: 12px;

}
/*Explanation on form elements. */
[data-aid="explanation"]
{
	/*A magyarázó szöveg kisebb, mint a mezők felirata, hogy ne vonja el a figyelmet. */
	font-size: calc( var(--i_font_main_size) - 2px );
	font-style: italic;
	color: var(--color_font_aux);
}

/*! Az önmagát elrendező űrlapelem (c_form_element_div_auto) méretei. A structure css fájlok
 * csak hivatkoznak ezekre a változókra, így minden méret egy helyen, itt állítható.
 * Az értékek a korábbi űrlapelemekével egyeznek, hogy a megjelenés ne változzon: függőleges
 * elrendezésben nagyobb a mező alatti térköz, mert ott a címke is a mező fölött van. */
[data-aid="form_field_container"].iui_form_element_auto
{
	--i_form_element_field_padding_bottom_vertical: 8px;
	--i_form_element_field_padding_bottom_horizontal: 4px;
	--i_form_element_label_padding_right_horizontal: 10px;
	--i_form_element_status_size: 15px;
	--i_form_element_padding_bottom_vertical: 8px;
	--i_form_element_padding_bottom_horizontal: 8px;
	--i_form_element_icon_size: 12px;
	--i_form_element_icon_radius: 3px;
	--i_form_element_icon_line_width: 2px;
	--i_form_element_icon_line_height: 6px;
	--i_form_element_icon_offset: -6px;
	--i_form_element_tooltip_max_width: 320px;
	--i_form_element_margin_bottom_horizontal: 8px;
	--i_form_element_label_min_height: 15px;
	--i_form_element_label_line_height: 16px;
	/*Az egymás alatti mezőket vízszintes elrendezésben vékony vonal választja el: ott a
	 *címke és az érték egy sorban áll, tehát a sorok határa magától nem látszik. Függőleges
	 *elrendezésben a címke maga jelzi az új mező kezdetét, ott a vonal csak zaj lenne. */
	--i_form_element_border_bottom_vertical: none;
	--i_form_element_border_bottom_horizontal: 1px dotted var(--color_border);
}

/*! Az egymás alatt álló űrlapelemek közötti függőleges távolság. Enélkül a mezők túlságosan
 * egymáson ülnek, és nehéz szemmel elkülöníteni, melyik címke melyik mezőhöz tartozik.
 * Vízszintes elrendezésben ez a távolság nagyobb, mert ott a címke és a mező egy sorban van:
 * a sorokat csak a köztük lévő üres hely tagolja. Függőlegesben elég a kisebb térköz, mert
 * ott a címke maga is tagolja a képet.
 * A felső térköz a magyarázat piktogramjának tart helyet: az a saját soránál magasabban áll,
 * és enélkül kilógna az elem dobozából, ahol a görgethető terület felső éle levágná. Az érték
 * a piktogram eltolásából számolódik, hogy a kettő ne tudjon elcsúszni egymástól. */
[data-aid="form_field_container"].iui_form_element_auto
{
	padding-bottom: var(--i_form_element_padding_bottom);
	padding-top: calc( var(--i_form_element_icon_offset) * -1 );
}

/*! A hibajelzés mérete. A szelektor csak akkor illeszkedik, ha a jelzésnek már van css
 * osztálya, azaz ténylegesen van visszajelzés: enélkül a jelzés helye üresen is helyet
 * foglalna. Azért ilyen erős a szelektor, mert az üres divekre vonatkozó szabály
 * (structure.css) különben nullára húzná a méretet. */
[data-aid="form_field_container"].iui_form_element_auto > [data-aid="error"][class]:not([class=""])
{
	width: var(--i_form_element_status_size);
	height: var(--i_form_element_status_size);
}

/*! Az elválasztó vonal a mezők alatt. Szándékosan minden elem megkapja, az utolsó is:
 * rácsba rendezett lapon minden űrlapelem a saját cellájában áll egyedül, tehát ott mindegyik
 * utolsó gyermek — a :not(:last-child) szűkítéssel egyetlen vonal sem jelenne meg. Az egységes
 * vonalazás többet ér, mint az, hogy az utolsó mező alatt ne legyen lezárás. */
[data-aid="form_field_container"].iui_form_element_auto
{
	border-bottom: var(--i_form_element_border_bottom);
}

/*! A mező alatti térköz: az elrendezés választja ki a fenti kettő közül. */
[data-aid="form_field_container"].iui_form_element_auto > [data-aid="field_container"]
{
	padding-bottom: var(--i_form_element_field_padding_bottom);
}

/*! A címke jobb oldali térköze csak vízszintes elrendezésben kell, mert csak ott áll mellette
 * a mező; függőlegesben az érték 0.
 * Az alsó térköz ugyanakkora, mint a mezőé, és szintén csak vízszintesben van: a címke és a
 * mező is a saját rácsterületének közepére kerül, tehát csak akkor esik a szövegük egy
 * vonalba, ha alattuk ugyanannyi hely marad. Enélkül a címke a mező középvonala alá csúszik.
 * A címke magassága nem fix: a közös rácsban a címkeoszlop szélessége korlátozott, tehát egy
 * hosszú címke két sorba törhet. Fix magassággal a második sor levágódna. */
[data-aid="form_field_container"].iui_form_element_auto > [data-aid="element_label"]
{
	padding-right: var(--i_form_element_label_padding_right);
	padding-bottom: var(--i_form_element_label_padding_bottom);
	text-align: var(--i_form_element_label_text_align);
	height: auto;
	min-height: var(--i_form_element_label_min_height);
	line-height: var(--i_form_element_label_line_height);
}

/*! A közös rács címkeoszlopa a leghosszabb címkéhez igazodik, de legfeljebb a doboz
 * szélességének 40%-áig: egyetlen kirívóan hosszú címke különben elvenné a mezők helyét.
 * A fit-content pont ezt adja: nő a tartalommal, de a megadott korlátnál megáll.
 * Ha egy űrlapon fix címkeoszlop kell, a --i_form_element_label_width felülírható
 * (pl. 200px vagy max-content). */
.iui_form_element_grid
{
	--i_form_element_label_width: fit-content(40%);
}

/*! A magyarázat piktogramja: lekerekített sarkú, halvány szürke négyzet a címke után, felső
 * indexként, benne egy vonallal. A kerete és a vonala ugyanaz a szürke, amivel a címke
 * szövege is meg van írva, a kitöltése pedig épp csak elválasztja a lap fehérétől: így a jel
 * a címke betűképének a része marad, és nem vonja el a figyelmet a mező tartalmáról.
 * Betű helyett puszta vonal, mert ekkora méretben egy karakter (akár kérdőjel, akár i)
 * szorosan ülne és olvashatatlanná válna. Rajzolt jel, nem képfájl: nagyításnál is éles, és a
 * színe a színsémával együtt mozog.
 * A méret azért páros, mert a benne lévő vonal is páros vastagságú: így a középre állítás
 * egész pixelre esik, és a vonal nem tűnik elcsúszottnak.
 * A megemelést relatív eltolás adja, nem felső index: a felső index megnövelné a címke
 * sormagasságát, és a szöveg emiatt lejjebb csúszna a mező középvonalától. A relatív eltolás
 * viszont nem hat a tördelésre, csak a megjelenített helyre — a buborék is együtt mozog vele,
 * mert a piktogramhoz van kötve. A text-bottom igazítás ugyanezt szolgálja: így a piktogram
 * belefér a szöveg saját sormagasságába, tehát a magyarázattal és a magyarázat nélkül álló
 * címkék is pontosan egy vonalban maradnak. */
[data-aid="form_field_container"].iui_form_element_auto [data-aid="explanation_icon"]
{
	width: var(--i_form_element_icon_size);
	height: var(--i_form_element_icon_size);
	margin-left: 3px;
	vertical-align: text-bottom;
	top: var(--i_form_element_icon_offset);
	border: 1px solid var(--color_font_aux);
	border-radius: var(--i_form_element_icon_radius);
	background-color: var(--color_bg_window);
	cursor: pointer;
}
/*! A négyzet közepén álló vonal: az „i" betű szára, betű nélkül. Mindkét tengelyen a felezés
 * és a saját mérete felének visszatolása állítja középre. Ez akkor esik egész pixelre — és
 * csak akkor látszik tényleg középen —, ha a doboz belső mérete és a vonal mérete azonos
 * paritású; a fenti méretek ezért párosak. */
[data-aid="form_field_container"].iui_form_element_auto [data-aid="explanation_icon"]::before
{
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	width: var(--i_form_element_icon_line_width);
	height: var(--i_form_element_icon_line_height);
	margin-left: calc( var(--i_form_element_icon_line_width) / -2 );
	margin-top: calc( var(--i_form_element_icon_line_height) / -2 );
	background-color: var(--color_font_aux);
}


.iui_tooltip
{
	z-index: 10;
	position: absolute;
	margin-top: 6px;
	max-width: 400px;
	cursor: pointer;
	
}
.iui_tooltip div:nth-child(1)
{
	margin-left: 10px;
	margin-top: -8px;
	display: block;
	position: absolute;
	z-index: 1;
	border-top: 0;
	border-left: 8px solid transparent;
	border-right: 8px solid transparent;        
	border-bottom: 8px solid #fd0000;  
}
.iui_tooltip div:nth-child(2)
{
	margin-left: 10px;
	margin-top: -6px;
	display: block;
	position: absolute;
	z-index: 1;
	border-top: 0;
	border-left: 8px solid transparent;
	border-right: 8px solid transparent;        
	border-bottom: 8px solid var(--color_bg_work);  
}
.iui_tooltip div:nth-child(3)
{
	border: 1px solid #fd0000;
	box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
	padding: 6px;
	border-radius: 5px;
	font-size: calc(var(--i_font_main_size) - 2px);
	font-style: italic;
	text-align: left;
	color: #fd0000;
	background-image: linear-gradient(rgba(255,255,255,1), rgba(253,253,253,1));  
}

/*! A magyarázat buborékja kék keretet és szöveget kap, hogy első pillantásra meg lehessen
 * különböztetni a piros hibaüzenettől: az egyik segít, a másik hibát jelez.
 * A buborék geometriája (a lefelé mutató nyíl) a structure.css-ben van, itt csak a színek. */
.iui_tooltip.iui_form_element_tooltip_explanation div:nth-child(1)
{
	border-top-color: var(--color_info);
}
.iui_tooltip.iui_form_element_tooltip_explanation div:nth-child(2)
{
	border-top-color: var(--color_bg_work);
}
.iui_tooltip.iui_form_element_tooltip_explanation div:nth-child(3)
{
	border-color: var(--color_info);
	color: var(--color_info);
	font-weight: normal;
}

/*! A magyarázat buborékjának legnagyobb szélessége. Keskenyebb, mint az általános buboréké,
 * mert az űrlapelem mellett jelenik meg, és nem lóghat ki az űrlapból.
 * A tipográfiát itt vissza kell állítani az alapértelmezettre: a buborék a piktogram belsejébe
 * kerül, az pedig apró betűs, sűrű sorközű és felső indexben áll — enélkül a buborék szövege
 * mindezt örökölné, és eltérne a rendszer többi buborékjától. */
.iui_tooltip.iui_form_element_tooltip_explanation
{
	max-width: var(--i_form_element_tooltip_max_width);
	font-size: var(--i_font_main_size);
	line-height: normal;
	vertical-align: baseline;
	text-transform: none;
	text-align: left;
}

/*! A címke alá forduló változatnál a nyíl a buborék tetején áll és fölfelé mutat, ezért a
 * színt is az alsó keret helyett a felsőre kell tenni. */
.iui_tooltip.iui_form_element_tooltip_explanation.iui_form_element_tooltip_explanation_below div:nth-child(1)
{
	border-bottom-color: var(--color_info);
}
.iui_tooltip.iui_form_element_tooltip_explanation.iui_form_element_tooltip_explanation_below div:nth-child(2)
{
	border-bottom-color: var(--color_bg_work);
}

.iui_element_label
{
	overflow: hidden;
	text-overflow: ellipsis;
	padding-left: 0px;
	height: 20px;
	line-height: 20px;
	width: 100%;
	text-align: left;
	padding-right: 10px;
	font-size: var(--i_font_main_size);
	color: var(--color_font_aux);
	line-height: 20px;
	font-weight: 600;
}

.iui_element_text_value
{
	padding-bottom: 5px;
	line-height: 30px
}

/*Displaying on form that a form field is required. */
[data-aid="form_field_container"] [data-aid='element_label'].form_field_required
{
	color: var(--color_border_required);
}

.form_field_required + td input, 
.form_field_required + td select, 
.form_field_required + div input, 
.form_field_required + div select, 
.form_field_required + td div.tagger, 
.form_field_required + div div.tagger,
.form_field_required + div div.iui_checklist,
.form_field_required + td div.iui_checklist,
.form_field_required + td textarea,
.form_field_required + div textarea,
.form_field_required + td .iui_textarea_autoheight,
.form_field_required + div .iui_textarea_autoheight,
.form_field_required + td div.iui_select [data-aid='node_widget'],
.form_field_required + div div.iui_select [data-aid='node_widget']
{
	border-color: var(--color_border_required);
	background-color: var(--color_bg_required);
}



/*Form section titles: a 1px gray underline of the title. Be careful: the line and span 
belongs to each other. The line size is set in structure.css.*/
[data-aid='title']
{
	background-color: var(--color_bg_window);
	margin-top: 10px;
	marign-bottom: 10px;
}
[data-aid='title'] + span
{
	font-size: var(--i_font_main_size);
	font-style: italic;
	color: var(--color_font_work);
	margin-top: -8px;
	padding-left: 5px;	
	background-color: var(--color_bg_window);
	border-radius: 3px 0px 0px 3px;
}



button, input[type="button"], input[type="reset"], input[type="submit"]
{
	min-width: 70px;	
}

input[type="text"]
{
	width: 200px;	
}


input[type=text].hasDatepicker
{
  width: 85px;
}

[data-aid="slider"]
{
	border: 1px solid var(--color_border);
	border-radius: 3px;
}

a {
  text-decoration: none;
}

input[type="button"], 
input[type="reset"], 
input[type="submit"], 
input[type="text"], 
input[type="password"], 
input[type="color"],
input[type="number"],  
select, 
textarea,
div.iui_textarea_autoheight
{
	padding: var(--i_size_input_padding_tb) var(--i_size_input_padding_lr) ;
	height: var(--i_size_input_height);
	background-color: var(--color_bg_text);
	border: 1px var(--color_border) solid;
	color: var(--color_font_text);
	margin: 1px;
	font-size: var(--i_font_main_size);
	border-radius: 3px;
	box-shadow: 0px 0px 2px var(--color_shadow_ambient);
}


input[type="password"]:not(.iui_stored)
{
	width: 200px;
	background-image: url('../icon/iui_button_show.svg');
	background-size: 20px 20px;
	background-position: calc(100% - 5px) center;
	background-repeat: no-repeat;
	padding-right: 30px;
	cursor: pointer;
}

[data-aid='w_toolbar'] button:hover,
[data-aid='w_toolbar'] input[type="button"]:hover
{
		background-color: #e1e1e2; /*var(--color_bg_hover);*/

}

.iui_content_tr input
{
	height: 24px;
	font-size: calc(var(--i_font_main_size) - 2px);
	margin-right: 2px;
	position: relative;
	top: -3px;
}


textarea,
div.iui_textarea_autoheight
{
	font-family: inherit;
	line-height: 1.5;
	padding-top: 5px;
	height: 80px;
}

div.iui_textarea_autoheight
{
	height: auto;
}

select
{
	padding: 0 calc( var(--i_size_input_padding_lr) - 5px);
	
}

select option:hover {
    box-shadow: 0 0 10px 100px var(--color_bg_hover) inset;
}

input[type="button"], input[type="reset"], input[type="submit"]
{
  border-top: 1px solid var(--color_main);
}

input[type="button"]:hover, input[type="reset"]:hover, input[type="submit"]:hover 
{
  border-color: var(--color_main);
  background-color: var(--color_bg_hover);
  color: var(--color_font_hover);
 }

input[type="button"]:active, input[type="reset"]:active, input[type="submit"]:active
 {

  color: var(--color_font_text);
  box-shadow: none;
}

input[type="button"]:disabled, input[type="reset"]:disabled, input[type="submit"]:disabled, input[type="button"].disabled, 
input[type="reset"].disabled, input[type="submit"].disabled,select:disabled, input[type="text"]:disabled,
textarea:disabled, .iui_select.disabled, div.iui_textarea_autoheight.disabled,
div.iui_select.disabled div[data-aid="node_widget"]
{
  	background-color: var(--color_bg_work);
	border-color: var(--color_bg_window);
  	cursor: default;
}

input[type="button"]:focus, input[type="reset"]:focus, input[type="submit"]:focus 
{
  outline: 0;
}


input[type="text"]:focus, 
input[type="password"]:focus, 
input[type="color"]:focus,
input[type="number"]:focus,  
select:focus, 
textarea:focus,
div.iui_textarea_autoheight:focus
{
	background-color: var(--color_bg_focus);
	border: 1px var(--color_border_focus) solid;
}


.iui_checklist, 
.iui_radiolist
{
	padding: 0.3rem;
	min-height: var(--i_size_input_height);
	max-height: calc( var(--i_size_input_height) * 7 );
	overflow-y: auto;
	background-color: var(--color_bg_text);
	border: 1px var(--color_border) solid;
	color: var(--color_font_text);
	margin: 1px;
	font-size: var(--i_font_main_size);
	border-radius: 3px;
	clear: both;
}

.iui_checklist > div,
.iui_radiolist > div
{
	margin-bottom: 2px;
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: 50px 1fr;
    align-items: center;
}



.iui_checklist.iui_list_vertical div, 
.iui_radiolist.iui_list_vertical div
{
	float: left;
	margin-right: 10px;

}


.iui_checklist label, .iui_radiolist label
{
	margin-left: 2px;
	vertical-align: middle;

}

.iui_checklist label, .iui_radiolist label
{
    display: inline-grid;
    grid-auto-flow: column;
    grid-auto-columns: 1fr;
    grid-column-gap: 10px;
    width: calc(100% - 20px);
}

.iui_checklist span:nth-child(1), .iui_radiolist span:nth-child(1)
{
    /*width: 20px;*/
}

input[type='checkbox'][data-asubtype='checkbox_value']
{
	height: var(--i_size_input_height);
}


.iui_subbuttons
{
	display: block;
	clear: both;
}
.iui_subbuttons .iui_subbutton
{
	float: right;
	font-size: 0.80em;
	padding-left: 5px;	
	color: var(--color_font_aux);
	cursor: pointer;
}


::-webkit-input-placeholder { /* Edge */
    color: var(--color_font_aux);
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: var(--color_font_aux);
}

::placeholder {
    color: var(--color_font_aux);
}

::-moz-selection { /* Code for Firefox */
    color: var(--color_font_select);
    background: var(--color_bg_select);
}

::selection {
    color: var(--color_font_select);
    background: var(--color_bg_select);
}

/*! A ... os háttérkép, amit gomb gyanánt be lehet így tenni bármilyen űrlapelembe.*/
*.iui_context_button
{
	background-image: url('../icon/iui_button_menu_2.svg');
	background-size: 15px 15px;
	background-position: calc(100% - 5px) center;
	background-repeat: no-repeat;
	padding-right: 30px;
}



/*Special caption span used in forms displaying simple text.*/
span.iui_caption
{

	color: var(--color_font_work);
	margin-right: 2px;
	line-height: var(--i_size_input_height);
}

[data-aid="field_container"] span.iui_caption
{
	margin: 1px;
	padding: var(--i_size_input_padding_tb) var(--i_size_input_padding_lr) ;
	height: var(--i_size_input_height);
	font-size: var(--i_font_main_size);
	
}
/*Underline text within caption span, looks like a simple a tag. */
span.iui_caption u
{
	cursor: pointer;
	font-weight: bold;
	/*text-decoration: underline;*/
	
}
span.iui_caption.iui_event_click
{

	text-decoration: underline;
}
span.iui_caption.iui_caption_alert
{
	background-image: url('../icon/iui_window_dialog_alert.svg');
	background-repeat: no-repeat;
	background-position: left center;
	background-size: contain;
	animation: blink 1.5s infinite;
	padding-left: 30px;
}

@keyframes blink
{
	50%
	{
		opacity: 0;
	}
}

/*################ ÁLTALÁNOS TÖLTÉSJELZŐ ############*/
div.iui_content_loading
{
	height: 5px;
	background-image: url('../background/iui_loader_list.svg');
	background-repeat: no-repeat;
	background-position: center center;
	
}

/*######### SAJÁT FEJLESZTÉSŰ UI ELEMEK #############*/
/*################## TOOLBAR ########################*/
.iui_toolbar
{

}

.iui_toolbar .iui_toolbar_delimiter
{
	width: 10px;
	height: 40px;
	float: left;
	
}

.iui_toolbar .iui_button
{
	margin-right: 1px;
}

/*################## ikonos gomb #################/

/*A special button object without text but containg icon. */
.iui_button
{
	width: var(--i_size_input_height);
	height: var(--i_size_input_height);
	background-size: 85%;
	border: 1px solid transparent; /*var(--color_border);*/
	border-radius: 3px;
	background-color: transparent;
	-webkit-transition: background-color 0.3s; /* Safari */
    transition: background-color 0.3s;
	
}

.iui_button:hover
{
	background-color: var(--color_bg_hover); /*#e1e1e2*/
	color: var(--color_font_hover);
}

.iui_button_menu
{
	background-image: url('../icon/iui_button_menu.svg');
	background-size: 50%;
	
}

.iui_button_project_time
{
	background-image: url('../icon/c_rec_time_fix_black.svg');
	background-size: 80%;
	
	background-color: var(--color_bg_text);
	border-top: 1px solid var(--color_main);
	
}

.iui_button_up
{
	background-image: url('../icon/iui_button_up.png');

}
.iui_button_back
{
	background-image: url('../icon/iui_button_back.png');
}
.iui_button_icon [data-aid='icon']
{
	background-size: 100%;
	background-repeat: no-repeat;
	background-position: center;
	height: 100%;
}


.iui_button_add_new [data-aid='icon']
{
	background-image: url('../icon/iui_button_add_new.svg');
	background-size: 65%;
}

.iui_button_left [data-aid='icon']
{
	background-image: url('../icon/iui_button_left.svg');
	background-size: 65%;
}

.iui_button_right [data-aid='icon']
{
	background-image: url('../icon/iui_button_right.svg');
	background-size: 65%;
}

.iui_button_today [data-aid='icon']
{
	background-image: url('../icon/iui_button_daily.svg');
	background-size: 65%;
}


.iui_button_daily [data-aid='icon']
{
	background-image: url('../icon/iui_button_daily.svg');
	background-size: 80%;
}

.iui_button_weekly [data-aid='icon']
{
	background-image: url('../icon/iui_button_weekly.svg');
	background-size: 85%;
}

.iui_button_monthly [data-aid='icon']
{
	background-image: url('../icon/iui_button_monthly.svg');
	background-size: 85%;
}


.iui_button_new [data-aid='icon']
{
	background-image: url(../../global/icon/iui_att_new.svg);
}
.iui_button_play [data-aid='icon']
{
	background-image: url(../../global/icon/iui_button_play.svg);
    background-size: 85% !important;
}

.iui_button_add [data-aid='icon']
{
	background-image: url(../../global/icon/iui_button_add.svg);
	background-size: 70%;
}

.iui_button_upload [data-aid='icon']
{
	background-image: url(../../global/icon/c_rec_mod_doc_upload.svg);
}

.iui_button_context [data-aid='icon']
{
	background-image: url('../icon/iui_button_contextmenu.svg');
}

.iui_button_download [data-aid='icon']
{
	background-image: url(../../global/icon/c_rec_mod_doc_download.svg);
}


.iui_button_delete [data-aid='icon']
{
	background-image: url(../../global/icon/c_rec_mod_shell_delete.svg);
}

.iui_button_deleteditems [data-aid='icon']
{
	background-image: url('../icon/c_rec_folder_message_deleteditems.svg');
}

.iui_button_trash [data-aid='icon']
{
	background-image: url(../../global/icon/c_rec_mod_shell_trash.svg);
}

.iui_button_doc [data-aid='icon']
{
	background-image: url(../../global/icon/c_rec_doc.svg);
}

.iui_button_alert [data-aid='icon']
{
	background-image: url(../../global/icon/iui_button_alert.svg);
}

.iui_button_person [data-aid='icon']
{
	background-image: url(../../global/icon/c_rec_person.svg);
}

.iui_button_employee [data-aid='icon']
{
	background-image: url(../../global/icon/c_rec_employee.svg);
}

.iui_button_pic [data-aid='icon']
{
	background-image: url(../../global/icon/c_rec_pic.svg);
}

.iui_button_archive [data-aid='icon']
{
	background-image: url(../../global/icon/iui_att_archive.svg);
}

.iui_button_approve [data-aid='icon']
{
	background-image: url(../../global/icon/iui_att_approved.svg);
}

.iui_button_save_as [data-aid='icon']
{
	background-image: url(../../global/icon/c_rec_mod_shell_save_as.svg);
}

.iui_button_save_template [data-aid='icon']
{
	background-image: url(../../global/icon/c_rec_mod_shell_save_template.svg);
}

.iui_button_load_template [data-aid='icon']
{
	background-image: url(../../global/icon/c_rec_mod_shell_load_template.svg);
}

.iui_button_import_excel [data-aid='icon']
{
	background-image: url(../../global/icon/c_rec_mod_shell_import_excel.svg);
}

.iui_button_stock_receipt [data-aid='icon']
{
	background-image: url(../../global/icon/c_rec_mod_stock_receipt.svg);
}

.iui_button_stock_transfer [data-aid='icon']
{
	background-image: url(../../global/icon/c_rec_mod_stock_transfer.svg);
}

.iui_button_stock_release [data-aid='icon']
{
	background-image: url(../../global/icon/c_rec_mod_stock_release.svg);
}

.iui_button_stock_return [data-aid='icon']
{
	background-image: url(../../global/icon/c_rec_mod_stock_return.svg);
}


.iui_button_advanced [data-aid='icon']
{
	background-image: url(../../global/icon/iui_button_advanced.svg);
}

.iui_button_search, .iui_button_search [data-aid='icon']
{
	background-image: url(../../global/icon/c_rec_mod_shell_search.svg);
}

.iui_button_message [data-aid='icon']
{
	background-image: url(../../global/icon/c_rec_mod_message.svg);
}

.iui_button_print [data-aid='icon']
{
	background-image: url(../../global/icon/iui_print.svg);
}

.iui_button_order [data-aid='icon']
{
	background-image: url(../../global/icon/iui_button_order.svg);
}

.iui_button_project_read [data-aid='icon']
{
	background-image: url(../../global/icon/c_rec_project.svg);
}

.iui_button_project_modify [data-aid='icon']
{
	background-image: url(../../global/icon/c_rec_project.svg);
}
.iui_button_workflow_read [data-aid='icon']
{
	background-image: url(../../global/icon/c_rec_folder_workflow.svg);
}


.iui_button_miscarry [data-aid='icon']
{
	background-color: red;
	background-image: url(../../work/icon/iui_task_read_miscarry.svg);
}
.iui_button_request_intervene [data-aid='icon']
{
	background-color: #fb8400;
	background-image: url(../../work/icon/iui_task_read_ri.svg);
}
.iui_button_delay [data-aid='icon']
{
	background-color: #AA0000;
	background-image: url(../../work/icon/iui_task_read_delay.svg);
}
.iui_button_pause [data-aid='icon']
{
	background-color: #0080c0;
	background-image: url(../../work/icon/iui_task_read_pause.svg);
}
.iui_button_continue [data-aid='icon']
{
	background-color: #fb8400;
	background-image: url(../../work/icon/iui_task_read_continue.svg);
}
.iui_button_parking [data-aid='icon']
{
	background-color: #0000AA;
	background-image: url(../../work/icon/iui_task_read_parking.svg);
}
.iui_button_unparking [data-aid='icon']
{
	background-color: #0000AA;
	background-image: url(../../work/icon/iui_task_read_parking.svg);
}
.iui_button_complete [data-aid='icon']
{
	background-color: #74AE0f;
	background-image: url(../../work/icon/iui_task_read_complete.svg);
}
.iui_button_complete_submenu>[data-aid='menu_icon']
{
	background-image: url(../../work/icon/iui_task_read_complete.svg);
}

.iui_button_force_complete [data-aid='icon']
{
	background-color: red;
	background-image: url(../../work/icon/iui_task_read_force_complete.svg);
}
.iui_button_force_complete_submenu>[data-aid='menu_icon']
{
	background-image: url(../../work/icon/iui_task_read_complete.svg);
}

.iui_button_path_prio [data-aid='icon']
{
	background-image: url(../../global/icon/iui_path_prio.svg);
}


.iui_button_exe [data-aid='icon']
{
	background-color: #fb8400;
	background-image: url(../../work/icon/iui_task_read_exe.svg);
}


/*########################## TAB OBJEKTUM ###########################*/
/*! LÁSD AZ AZONOS NEVŰ OSZTÁLYOKAT A STRUCTURE.CSS-BEN */
.iui_tabs
{
	background-color: var(--color_bg_work);
}

[data-aid="w_content"] .iui_tabs
{

}

.iui_tabs_header
{
	/*background-color: #EEE;*/
	border-bottom: 1px solid var(--color_bg_window);
}

.iui_tabs_label
{
	background-color: var(--color_bg_window);
	color: var(--color_font_work);
	border-right: 1px solid var(--color_border);
	border-left: 1px solid var(--color_border);
	border-top: 1px solid var(--color_border);
	border-radius: 5px 5px 0px 0px;
	padding: 5px;
	padding-left: 15px;
	padding-right: 15px;
	margin-right: 1px;	
	/*flex-grow: 1;*/
}
.iui_tabs_label:hover
{
	border-left: 1px solid var(--color_main);
  	border-right: 1px solid var(--color_main);
 	border-top: 1px solid var(--color_main);
  	background-color: var(--color_bg_hover);
  	color: var(--color_font_hover);

  	
	
}

.iui_tabs_title
{
	font-size: calc(var(--i_font_main_size) + 3px);
    text-align: left;
    background-color: var(--color_bg_hover);
    color: var(--color_font_inverse);
    border-radius: 5px;
    padding: 3px;
    width: 100%;
    margin-bottom: 8px;
}

.iui_tabs_label.form_err
{
	animation: blink .5s step-end infinite alternate;
}
.iui_tabs_label.iui_tabs_active
{
	background-color: var(--color_bg_work);
	border-left: 1px solid var(--color_border);
	border-top: 2px solid var(--color_main);
	border-right: 1px solid var(--color_border);
	border-bottom: 1px solid var(--color_bg_work);
	padding-top: 3px;
	color: var(--color_font_work);

}

.iui_tabs_body
{
	border-left: 1px solid var(--color_border);
	border-top: 1px solid var(--color_bg_work);
	border-right: 1px solid var(--color_border);
	border-bottom: 1px solid var(--color_border);
	border-radius: 0px 0px 5px 5px;
}
@media only print
{
	.iui_tabs_body
	{
		border: none !important;
	}
}

.iui_tabs_content
{
	padding: 10px;
}

.iui_tabs_menubar:not(:empty) 
{
	padding: 5px;
	border-left: 1px solid var(--color_border);
	border-right: 1px solid var(--color_border);
}
.iui_tabs_content.iui_tabs_active
{

}
.iui_tabs_content.iui_tabs_flex
{
	display: flex;
	flex-direction: column;
}

/*########################## TAB TREEVIEW OBJEKTUM ###########################*/
/*! LÁSD AZ AZONOS NEVŰ OSZTÁLYOKAT A STRUCTURE.CSS-BEN */
/*! Az arculat szándékosan azonos a c_iui_treeview-éval: az elemek a treeview
 * iui_tree_element_label osztályát viselik, a nyitó-csukó ikon az iui_tree_element_toggle,
 * a kijelölést pedig az iui_selected_tree_element osztály adja. Itt ezért lényegében csak a
 * tab-tól örökölt fül-kinézetet (keret, lekerekítés, saját háttér és hover) semlegesítjük. */

.iui_tabs_tree .iui_tabs_tree_list_container
{
	background-color: var(--color_bg_window);
	border-right: 1px solid var(--color_border);
}

.iui_tabs.iui_tabs_tree.iui_tabs_tree_right .iui_tabs_tree_list_container
{
	border-right: none;
	border-left: 1px solid var(--color_border);
}

/*! A keresőmező a fa fölött. A c_iui_treeview keresőjének kinézetét kapja, a terület széleit
 * pedig a lista oldal egységes paddingje adja. */
.iui_tabs_tree .iui_tabs_tree_search input
{
	width: 100%;
	margin: 0px;
}

/*! A fül kerete és lekerekítése helyett sima listaelem. A méretek a treeview
 * [data-aid="tree_element_label"] szabályát követik. */
.iui_tabs_tree .iui_tabs_tree_item,
.iui_tabs_tree .iui_tabs_tree_item:hover,
.iui_tabs_tree .iui_tabs_tree_item.iui_tabs_active
{
	border: none;
	border-radius: 0px;
	margin-right: 0px;
	margin-bottom: 4px;
	padding-top: 2px;
	padding-bottom: 2px;
	padding-right: 0px;
	font-size: calc(var(--i_font_main_size) - 1px);
}

/*! Magának a sornak nincs saját háttere és hover-kiemelése — ahogy a treeview-ban sem.
 * A kijelölés a felirat sávján jelenik meg, az iui_selected_tree_element osztállyal. */
.iui_tabs_tree .iui_tabs_tree_item,
.iui_tabs_tree .iui_tabs_tree_item:hover,
.iui_tabs_tree .iui_tabs_tree_item.iui_tabs_active
{
	background-color: transparent;
	color: var(--color_font_work);
}

/*! A felirat sávja a treeview címkéjének paddingjét kapja. */
.iui_tabs_tree .iui_tabs_tree_text
{
	padding-left: 3px;
	padding-right: 3px;
}

/*! A tartalmi oldalon a tab lekerekített, alul zárt kerete itt nem illeszkedik. */
.iui_tabs_tree .iui_tabs_body
{
	border: none;
	border-radius: 0px;
}

/*! A lap tetején lévő címsor. A tab-nál ez csak nyomtatásban jelenik meg, kitöltött sávként;
 * itt viszont a képernyőn is látszik, ezért egyszerű, aláhúzott címsorrá alakítjuk.
 * Nincs szüksége saját háttérre: a görgethető terület alatta kezdődik, tehát nem görög el
 * mögötte semmi (lásd a lap elrendezését a structure.css-ben). Alatta bőven van hely, hogy a
 * görgethető terület felső éle láthatóan elváljon a címsortól. */
.iui_tabs_tree .iui_tabs_title
{
	background-color: transparent;
	color: var(--color_font_work);
	border-radius: 0px;
	border-bottom: 1px solid var(--color_border);
	font-weight: bold;
	padding: 0px 0px 3px 0px;
	margin-bottom: 20px;
}



.ui-tabs-anchor.form_err
{
	animation: blink .5s step-end infinite alternate;
}

/*########################## TAB OBJEKTUM ###########################*/
/*! LÁSD AZ AZONOS NEVŰ OSZTÁLYOKAT A STRUCTURE.CSS-BEN */
.iui_wizard
{
	background-color: var(--color_bg_work);
}


.iui_wizard_title
{
	font-size: calc(var(--i_font_main_size) + 3px);
    text-align: left;
    background-color: var(--color_bg_hover);
    color: var(--color_font_inverse);
    border-radius: 5px;
    padding: 3px;
    width: 100%;
    margin-bottom: 8px;
}


/*A 2-es verzióban már nem cím, hanem header van, ehhez tartozik az alábbi szabály. */
.iui_wizard_header
{
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: 1fr;
	background-color: inherit;
}
.iui_wizard_header .iui_wizard_step
{
	display: grid;
	justify-items: center;	
	padding: 10px;
	border-bottom: 1px solid #000;
	background-image: url(../../global/background/iui_wirard_stepline.svg);
	background-repeat: no-repeat;
	background-position: center 26px;
	background-color: inherit;
	
}

.iui_wizard_navigation .iui_wizard_ready .iui_wizard_number
{
	cursor: pointer;
}

.iui_wizard_header .iui_wizard_step:last-child
{
	background-image: url(../../global/background/iui_wirard_stepline_last.svg);
}

.iui_wizard_step.iui_wizard_active
{
	background-image: url(../../global/background/iui_wirard_stepline_active.svg);
}

.iui_wizard_header .iui_wizard_step.iui_wizard_active:first-child
{
	background-image: url(../../global/background/iui_wirard_stepline_active_first.svg);
}

.iui_wizard_header .iui_wizard_step.iui_wizard_active:last-child
{
	background-image: url(../../global/background/iui_wirard_stepline_active_last.svg);
}

.iui_wizard_step.iui_wizard_ready
{
	background-image: url(../../global/background/iui_wirard_stepline_ready.svg);
}
.iui_wizard_header .iui_wizard_step.iui_wizard_ready:first-child
{
	background-image: url(../../global/background/iui_wirard_stepline_ready_first.svg);
}

.iui_wizard_header .iui_wizard_number
{
	font-size: 1.2em;
	padding: 7px;
	font-weight: bold;
	text-align: center;
	border: 1px solid var(--color_font_aux);
	border-radius: 30px;
	color: 	var(--color_font_aux);
	width: 35px;
	height: 35px;
	background-color: inherit;
}

.iui_wizard_step.iui_wizard_active .iui_wizard_number
{
	color: var(--color_font_inverse);
	background-color: var(--color_main);
	border: 1px solid var(--color_main);
}

.iui_wizard_step.iui_wizard_ready .iui_wizard_number
{
	color: var(--color_main);
	background-color: inherit;
	border: 1px solid var(--color_main);
}


.iui_wizard_header .iui_wizard_label
{
	text-align: center;
	text-transform: uppercase;
	color: var(--color_font_aux);
	padding-top: 10px;
}


.iui_wizard_footer
{
	padding-top: 5px;
	padding-bottom: 5px;
	background-color: var(--color_bg_window);	
	display: grid;
	grid-auto-flow: column;
}

.iui_wizard_label.form_err
{
	animation: blink .5s step-end infinite alternate;
}

.iui_wizard_body
{
	
}

@media only print
{
	.iui_wizard_body
	{
		border: none !important;
	}
}

.iui_wizard_content
{
	padding: 10px;
}

.iui_wizard_content.iui_wizard_active
{

}
.iui_wizard_content.iui_wizard_flex
{
	display: flex;
	flex-direction: column;
}

.ui-wizard-anchor.form_err
{
	animation: blink .5s step-end infinite alternate;
}

/*########################### RADIO SWITCH 2 ÁLLÁSÚ ANIMÁLT KAPCSOLÓ ################*/
.iui_radio_switch
{

	width: 80px;
	padding: 2px;
	border-radius: 3px;
	margin: 1px;
	height: var(--i_size_input_height);
	background-color: var(--color_bg_text);
	border: 1px var(--color_border) solid;
	color: var(--color_font_aux);
	box-shadow: 0px 0px 2px var(--color_shadow_ambient);

}

.iui_radio_switch div[data-aid='visual']
{
	align-items: center;
	cursor: pointer;
}

.iui_radio_switch div[data-aid='visual'] div.iui_radio_switch_label
{
	text-align: center;
}

.iui_radio_switch div[data-aid='visual'] div.iui_radio_switch_button
{
	background-color: var(--color_font_aux);
	border-radius: 3px;
}


.iui_radio_switch.iui_radio_switch_on div[data-aid='visual']
{

}

.iui_radio_switch.iui_radio_switch_on div[data-aid='visual'] div.iui_radio_switch_button
{
	background-color: var(--color_main);
	border-radius: 3px;
}
.iui_radio_switch div[data-aid='visual'] div[data-aid='label_1']
{
	color: var(--color_main);
}


/*###################################### HTML EDITOR TINY MCE CSS BEÁLLÍTÁSAI ########################### */
div.iui_tabs_content_header div.tox-editor-container
{
	border: none !important;

}
div.iui_tabs_content_header div.tox div
{
    border: none;
}
div.iui_tabs_content_header div.tox-editor-header
{
	border-left: 1px solid var(--color_border) !important;
	border-right: 1px solid var(--color_border) !important;
	border-bottom: 1px solid var(--color_border) !important;
	border-top: none !important;
	border-radius: 0px !important;
}


/*###################################### HTML EDITOR CSS BEÁLLÍTÁSAI ########################### */
div[data-aid="html_editor"]
{
	background-color: var(--color_bg_text);
	
	border: 1px var(--color_border) solid;
	border-radius: 3px;
	box-shadow: 0px 0px 2px var(--color_shadow_ambient);
	/*! Strukturális beállítások: structure.css !*/
}
div[data-aid="editor_toolbar"]:not(:empty)
{
	/*background-color: var(--color_bg_window);*/
	padding: 5px;
	/*! Strukturális beállítások: structure.css !*/
}
div[data-aid="editor_toolbar"].disabled
{
	opacity: 0.5;
	/*! Strukturális beállítások: structure.css !*/
}
div[data-aid="html_editor"] div[data-aid="text"]
{
	padding: 5px;
	font-size: calc( var(--i_font_main_size) + 1px );
	/*! Strukturális beállítások: structure.css !*/
}
div[data-aid="html_editor"] div[data-aid="text"] div[data-aid="signature"],
.mce-content-body div[data-aid="signature"]
{
	border-top: 1px dashed #e1e1e1;
	/*! Strukturális beállítások: structure.css !*/
}

div[data-aid="html_editor"] div[data-aid="text"] a
{
	color: #0080c0;
	/*! Strukturális beállítások: structure.css !*/
}


div[data-aid="html_editor"] div[data-aid="text"].iui_show_node *
{
	border: 1px dashed;
	padding: 5px;
	margin: 5px;
	/*! Strukturális beállítások: structure.css !*/
}
div[data-aid="html_editor"] div[data-aid="text"].iui_show_node p
{
	border-color: #008080;
	/*! Strukturális beállítások: structure.css !*/
}

div[data-aid="html_editor"] div[data-aid="text"].iui_show_node h1,
div[data-aid="html_editor"] div[data-aid="text"].iui_show_node h2,
div[data-aid="html_editor"] div[data-aid="text"].iui_show_node h3
{
	border-color: #ff0000;
	/*! Strukturális beállítások: structure.css !*/
}
div[data-aid="html_editor"] div[data-aid="text"].iui_show_node b,
div[data-aid="html_editor"] div[data-aid="text"].iui_show_node i,
div[data-aid="html_editor"] div[data-aid="text"].iui_show_node u,
div[data-aid="html_editor"] div[data-aid="text"].iui_show_node strike
{
	border-color: #ffff00;
	/*! Strukturális beállítások: structure.css !*/
}
div[data-aid="html_editor"] div[data-aid="text"].iui_show_node span,
div[data-aid="html_editor"] div[data-aid="text"].iui_show_node div
{
	border-color: #808080;
	/*! Strukturális beállítások: structure.css !*/
}
div[data-aid="html_editor"] div[data-aid="text"].iui_show_node ol,
div[data-aid="html_editor"] div[data-aid="text"].iui_show_node ul
{
	border-color: #0000ff;
	/*! Strukturális beállítások: structure.css !*/
}

div[data-aid="html_editor"] textarea
{
	/*! Strukturális beállítások: structure.css !*/
}

div[data-aid="editor_toolbar"] div[data-aid="toolbar_group"]
{
	margin-right: 5px;
	/*! Strukturális beállítások: structure.css !*/
}

div[data-aid="editor_toolbar"] .iui_advanced
{
	display: none;
}

div[data-aid="editor_toolbar"].iui_show_advanced .iui_advanced
{
	display: unset;
}

div[data-aid="editor_toolbar"] .iui_button
{
	width: var(--i_size_input_height);
	height: var(--i_size_input_height);
	background-color: #0080c0;
	background-size: 60%;
	border: 1px solid transparent; /*var(--color_border);*/
	border-radius: 3px;
	-webkit-transition: background-color 0.2s; /* Safari */
    transition: background-color 0.2s;
    margin: 1px;
	/*! Strukturális beállítások: structure.css !*/
}

div[data-aid="editor_toolbar"] .iui_button.iui_selected_btn
{
	background-color: var(--color_border_required);
	/*! Strukturális beállítások: structure.css !*/
}

div[data-aid="editor_toolbar"] .iui_button[data-icmd="formatBlock"][data-icmd-par="p"]
{
	background-image: url('../icon/iui_html_editor_format_block_p.svg');
}

div[data-aid="editor_toolbar"] .iui_button[data-icmd="formatBlock"][data-icmd-par="h1"]
{
	background-image: url('../icon/iui_html_editor_format_block_h1.svg');
}

div[data-aid="editor_toolbar"] .iui_button[data-icmd="formatBlock"][data-icmd-par="h2"]
{
	background-image: url('../icon/iui_html_editor_format_block_h2.svg');
}

div[data-aid="editor_toolbar"] .iui_button[data-icmd="formatBlock"][data-icmd-par="h3"]
{
	background-image: url('../icon/iui_html_editor_format_block_h3.svg');
}

div[data-aid="editor_toolbar"] .iui_button[data-icmd="formatBlock"][data-icmd-par="pre"]
{
	background-image: url('../icon/iui_html_editor_format_block_pre.svg');
}
div[data-aid="editor_toolbar"] .iui_button[data-icmd="formatBlock"][data-icmd-par="code"]
{
	background-image: url('../icon/iui_html_editor_format_block_code.svg');
}

div[data-aid="editor_toolbar"] .iui_button[data-icmd="formatBlock"][data-icmd-par="blockquote"]
{
	background-image: url('../icon/iui_html_editor_format_block_blockquote.svg');
}

div[data-aid="editor_toolbar"] .iui_button[data-icmd="bold"]
{
	background-image: url('../icon/iui_html_editor_bold.svg');
}
div[data-aid="editor_toolbar"] .iui_button[data-icmd="italic"]
{
	background-image: url('../icon/iui_html_editor_italic.svg');
}
div[data-aid="editor_toolbar"] .iui_button[data-icmd="underline"]
{
	background-image: url('../icon/iui_html_editor_underline.svg');
}
div[data-aid="editor_toolbar"] .iui_button[data-icmd="strikeThrough"]
{
	background-image: url('../icon/iui_html_editor_strikethrough.svg');
}

div[data-aid="editor_toolbar"] .iui_button[data-icmd="subscript"]
{
	background-image: url('../icon/iui_html_editor_subscript.svg');
}

div[data-aid="editor_toolbar"] .iui_button[data-icmd="superscript"]
{
	background-image: url('../icon/iui_html_editor_superscript.svg');
}
div[data-aid="editor_toolbar"] .iui_button[data-icmd="insertOrderedList"]
{
	background-image: url('../icon/iui_html_editor_insert_ordered_list.svg');
}
div[data-aid="editor_toolbar"] .iui_button[data-icmd="insertUnorderedList"]
{
	background-image: url('../icon/iui_html_editor_insert_unordered_list.svg');
}
div[data-aid="editor_toolbar"] .iui_button[data-icmd="indent"]
{
	background-image: url('../icon/iui_html_editor_indent.svg');
}
div[data-aid="editor_toolbar"] .iui_button[data-icmd="outdent"]
{
	background-image: url('../icon/iui_html_editor_outdent.svg');
}
div[data-aid="editor_toolbar"] .iui_button[data-icmd="justifyLeft"]
{
	background-image: url('../icon/iui_html_editor_justify_left.svg');
}
div[data-aid="editor_toolbar"] .iui_button[data-icmd="justifyCenter"]
{
	background-image: url('../icon/iui_html_editor_justify_center.svg');
}
div[data-aid="editor_toolbar"] .iui_button[data-icmd="justifyRight"]
{
	background-image: url('../icon/iui_html_editor_justify_right.svg');
}
div[data-aid="editor_toolbar"] .iui_button[data-icmd="justifyFull"]
{
	background-image: url('../icon/iui_html_editor_justify_full.svg');
}
div[data-aid="editor_toolbar"] .iui_button[data-icmd="undo"]
{
	background-image: url('../icon/iui_html_editor_undo.svg');
}
div[data-aid="editor_toolbar"] .iui_button[data-icmd="redo"]
{
	background-image: url('../icon/iui_html_editor_redo.svg');
}

div[data-aid="editor_toolbar"] .iui_button[data-icmd="removeFormat"]
{
	background-image: url('../icon/iui_html_remove_format.svg');
}

div[data-aid="editor_toolbar"] .iui_button[data-iconf="s_display"][data-iconf-par="text"]
{
	background-image: url('../icon/iui_html_editor_conf_display_text.svg');
}

div[data-aid="editor_toolbar"] .iui_button[data-iconf="s_display"][data-iconf-par="code"]
{
	background-image: url('../icon/iui_html_editor_conf_display_code.svg');
}

div[data-aid="editor_toolbar"] .iui_button[data-iconf="s_display"][data-iconf-par="split"]
{
	background-image: url('../icon/iui_html_editor_conf_display_split.svg');
}

div[data-aid="editor_toolbar"] .iui_button[data-iconf="b_map"]
{
	background-image: url('../icon/iui_html_editor_conf_map.svg');
}

div[data-aid="editor_toolbar"] .iui_button[data-iconf="b_advanced"]
{
	background-image: url('../icon/iui_html_editor_conf_advanced.svg');
}

div[data-aid="editor_toolbar"] .iui_button[data-iplugin="c_iui_plugin_link"][data-iplugin-par="set"]
{
	background-image: url('../icon/iui_html_editor_plugin_link_set.svg');
	background-size: 80%;
}
div[data-aid="editor_toolbar"] .iui_button[data-iplugin="c_iui_plugin_link"][data-iplugin-par="remove"]
{
	background-image: url('../icon/iui_html_editor_plugin_link_remove.svg');
}

div[data-aid="editor_toolbar"] .iui_button[data-iplugin="c_iui_plugin_img"][data-iplugin-par="set"]
{
	background-image: url('../icon/iui_html_editor_plugin_img_set.svg');
}

/*################## IUI_SELECT select option css beállításai ########################*/
div.iui_select
{
	width: 100%;
}
div.iui_select.disabled
{
 /*Lásd disabled*/
}
div.iui_select [data-aid='node_widget']
{
	/*width: 100%;*/
	padding-top: calc( var(--i_size_input_padding_tb) + 1px ) ;
	padding-bottom: calc( var(--i_size_input_padding_tb) + 1px ) ;
	padding-left: var(--i_size_input_padding_lr);
	padding-right: calc( var(--i_size_input_padding_lr) + 20px );
	border: 1px var(--color_border) solid;
	color: var(--color_font_text);
	margin: 1px;
	font-size: var(--i_font_main_size);
	border-radius: 3px;
	box-shadow: 0px 0px 2px var(--color_shadow_ambient);	
	background-color: var(--color_bg_text);

	background-size: 11px 11px;
	background-position: calc(100% - 10px) center;
	background-repeat: no-repeat;
}

div.iui_select.iui_select_button_list [data-aid='node_widget']
{
	background-image: url('../icon/iui_select_arrow_down.svg');
}
div.iui_select.iui_select_button_context [data-aid='node_widget']
{
	background-image: url('../icon/iui_button_contextmenu_transparent.svg');
}
.iui_select.iui_select_button_click [data-aid='node_widget']
{
	background-image: url('../icon/iui_button_module.svg');
}

div.iui_select.iui_select_button_list.iui_select_open [data-aid='node_widget']
{
	background-image: url('../icon/iui_select_arrow_up.svg');
}

div.iui_select.iui_select_button_list.iui_select_searchable [data-aid='node_widget']
{
	background-image: url('../icon/iui_select_searchable.svg');
}


div.iui_select.iui_select_multi [data-aid='node_widget']
{
	min-height: var(--i_size_input_height);

}
div.iui_select.iui_select_single [data-aid='node_widget']
{
	height: var(--i_size_input_height);
}



div.iui_select.iui_select_loading [data-aid='node_widget']
{
	background-image: url('../icon/iui_progress.svg');
	background-size: 10px 10px;
	background-color: inherit;
	background-position: calc(100% - 10px) center;
	
}
div.iui_select.iui_select_focus [data-aid='node_widget']
{
	border-color: var(--color_border_focus) !important;
}
div.iui_select [data-aid='node_list']
{
	margin-top: -2px;
	margin-left: 1px;
	max-height: 300px;
	background-color: var(--color_bg_work);
	border: 1px var(--color_border) solid;
	color: var(--color_font_text);
	font-size: var(--i_font_main_size);
	border-radius: 3px;
	box-shadow: 0px 0px 2px var(--color_shadow);
}



/*div.iui_select [data-aid='node_list'] div.iui_select_option .shell_icon
{
	
	width: 25px;
	height: 25px;
	margin-left: 5px;
}*/
div.iui_select.iui_select_open [data-aid='node_list'] div.iui_select_option .shell_icon
{
	width: 25px;
	height: 25px;
	margin-left: 5px;
}


div.iui_select.iui_select_open [data-aid='node_list']
{

}
div.iui_select [data-aid='node_list'],
div.iui_select.iui_select_open [data-aid='node_list']:empty
{

}


div.iui_select [data-aid='node_list'] div.iui_select_optgroup_open
{
	text-transform: uppercase;
	border-top: 1px solid #AAA;
	padding: calc( var(--i_size_input_padding_tb) + 6px ) var(--i_size_input_padding_lr) ;
	height: calc( var(--i_size_input_height) - 5px);
	font-weight: bold;
}
div.iui_select [data-aid='node_list'] div.iui_select_optgroup_close
{
	min-height: 0px;
	padding-top: 0px;
	height: 0px;
	border-bottom: 0px;
}
div.iui_select [data-aid='node_list'] div
{
	min-height: 35px;
	padding-top: 3px;
	padding-left: 20px;
	border-bottom: 1px solid var(--color_bg_window);
}
div.iui_select [data-aid='node_list'] div span
{
    padding-top: 5px;
    padding-left: 4px;
    padding-right: 4px;
    padding-bottom: 5px;

}
div.iui_select [data-aid='node_list'] div span.shell_icon
{
	border-radius: 3px;
    margin-top: 2px;
}

div.iui_select [data-aid='node_list'] div.iui_select_option
{
	cursor: pointer;

}
div.iui_select [data-aid='node_list'] div.iui_select_option.free
{
	color: red;
}

div.iui_select [data-aid='node_list'] div.iui_select_option:hover
{
	background-color: var(--color_bg_hover_sec);
}

div.iui_select [data-aid='node_list'] div.iui_select_option.iui_select_cached
{
	background-image: url('../icon/iui_select_cached.svg');
	background-size: 12px 12px;
	background-position: 7px center;
	color: var(--color_font_aux);
	
}

div.iui_select [data-aid='node_list'] div.iui_select_option.iui_selected_opt
{
	background-image: url('../icon/iui_select_selected.svg');
	background-size: 12px 12px;
	background-position: 7px center;
	color: inherit;
}


div.iui_select .iui_select_null
{
	color: var(--color_font_aux) !important;
}	
div.iui_select [data-aid='node_list'] div.iui_select_option.designated
{
	background-color: var(--color_bg_select);
	color: var(--color_font_select);
}
div.iui_select span
{

}
div.iui_select span[data-aid='node_labels']
{
    
}
div.iui_select span[data-aid='node_labels'] span
{
	padding-right: 5px;
	text-decoration: underline;
}

div.iui_select.iui_select_multi span[data-aid='node_labels'] span
{
	
	padding-right: 15px;
	background-repeate: no-repeat;
	background-image: url('../icon/iui_select_remove.svg');
	background-size: 7px 7px;
	background-position: calc(100% - 6px) calc(50% + 1px);
}



div.iui_select span[data-aid='node_input']
{
	color:  var(--color_font_text);
}

div.iui_select.iui_select_nosearch span[data-aid='node_input']
{
	color:  var(--color_bg_text);
}

div.iui_select.iui_select_single.iui_select_search span[data-aid='node_labels']
{
	display: none;
}

div.iui_select span[data-aid='node_input']:empty
{

}

div.iui_select span[data-aid='node_placeholder']
{
	color: var(--color_font_aux);
	/*height:  var(--i_size_input_height);*/
	line-height: 21px;
	
}

div.iui_select span[data-aid='node_complete']
{
	background-color: var(--color_bg_select);
	color: var(--color_font_select);
}

div.iui_select span[data-aid='node_count']
{

}

.iui_guid_selector_pic
{
	display: inline-block;
	width: 100px;
	height: 100px;
	border: 1px solid var(--color_border);
	border-radius: 3px;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	vertical-align: middle;
	box-shadow: 0px 0px 2px var(--color_border);
	cursor: pointer;
	background-image: url('../icon/iui_guid_selector_pic.svg');
	background-color: var(--color_border);
	
}

/*When a function is disabled by policy subsystem this css class is assigned to that element. 
For example: menu elements, buttons, etc. It is assigned by the c_event_code PHP class. */
.iui_denied
{
	color: #AAAAAA;
	display: none;
}

/*CSS styles belonging to c_status classes. For example they display form feedback status icons. */
.c_status_err
{
	margin-top: 5px;
	width: 15px;
	height: 15px;
	background-image: url('../icon/c_status_err.png');
	background-size: 50%;
	background-color: red;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;

}


@keyframes blink 
{ 
   50% { color: #ff0000;} 
}

/*################## IUI_STATIONCHART (metrótérkép) css beállításai ########################*/
.iui_stationchart
{
	display: grid;
	grid-template-rows: auto;
	grid-template-columns: auto 20px auto;
}

.iui_stationchart.iui_stationchart_center
{
	grid-template-columns: auto 20px auto;
}

.iui_stationchart.iui_stationchart_left
{
	grid-template-columns: min-content 20px auto;
}

.iui_stationchart.iui_stationchart_right
{
	grid-template-columns: auto 20px min-content;
}

.iui_stationchart div
{
	
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	height: 30px;
	line-height: 30px;
}

.iui_stationchart .iui_stationchart_number
{
	text-align: right;
	padding-right: 5px;
}

.iui_stationchart .iui_stationchart_text
{
	text-align: left;
	padding-left: 5px;
}

.iui_stationchart .iui_stationchart_icon
{
	width: 100%;
	height: 100%;
	
	place-self: center center;
	background-image: url('../background/iui_1px.svg');
	background-repeat: repeat-y;
	background-position: center center;
	
	display: grid;
	align-content: center;
	justify-content: center;

}
.iui_stationchart .iui_stationchart_icon div
{
	border-radius: 13px;
	background-color: #AAA;
	width: 13px;
	height: 13px;

	
}
.iui_stationchart .iui_stationchart_icon div.iui_error
{
	background-color: #aa0000;
	border: 1px solid #aa0000;
}
.iui_stationchart .iui_stationchart_icon div.iui_alert
{
	background-color: orange;
	border: 1px solid orange;
}
.iui_stationchart .iui_stationchart_icon div.iui_ok
{
	background-color: #74AE00;
	border: 1px solid #74AE00;
}

.iui_stationchart .iui_stationchart_icon div.iui_info
{
	background-color: #1350C3;
	border: 1px solid #1350C3;
}

.iui_stationchart .iui_stationchart_icon div.iui_active
{
	width: 14px;
	height: 14px;
	
	-webkit-animation-name: stationchart_active; /* Chrome, Safari, Opera */
    -webkit-animation-duration: 1s; /* Chrome, Safari, Opera */
    animation-name: stationchart_active;
    animation-duration: 1s;
    animation-iteration-count: infinite;
}

@-webkit-keyframes stationchart_active
{
	0%   {border-color: #FFF;}
	50%   {border-color: #555;}
	100%   {border-color: #FFF;}
}
/* Standard syntax */
@keyframes stationchart_active
{
	0%   {border-color: #FFF;}
	50%   {border-color: #555;}
	100%   {border-color: #FFF;}
}

/*###################################### RAJZOLÓ PANEL ########################### */
canvas.iui_drawing
{
	cursor: crosshair;
	border: 1px solid var(--color_border);
}

/*############################ állapotjelölések ####################################*/

.c_status_alert
{
	width: 15px;
	height: 15px;
	background-image: url('../icon/c_status_alert.png');
	background-size: 70%;
	background-color: orange;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	margin-top: 5px;
}

.c_status_notice
{
	width: 15px;
	height: 15px;
	background-image: url('../icon/c_status_notice.png');
	background-size: 70%;
	background-color: blue;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	margin-top: 5px;
}

.c_status_info
{
	width: 15px;
	height: 15px;
	background-image: url('../icon/c_status_info.png');
	background-size: 70%;
	background-color: blue;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	margin-top: 5px;
}

.c_status_ok
{
	width: 15px;
	height: 15px;
	background-image: url('../icon/c_status_ok.png');
	background-repeat: no-repeat;
	background-position: center;
	background-size: 70%;
	background-color: green;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	margin-top: 5px;
}

/* The css styles of "Notify" 3rd party js library. */

.iui_notify_shadow 
{
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.35);
}
.iui_notify_default
{
	background-color: #e5f3fb;
	color: #1d1d1d;
}
.iui_notify_default .iui_notify-closer {
  background-color: #e5f3fb;
  color: #1d1d1d;
}
.iui_notify_default .iui_notify-closer:hover {
  background-color: #cde6f7;
  color: var(--color_bg_work);
}
.iui_notify_default .iui_notify-closer:active {
  background-color: #92c0e0;
  color: var(--color_bg_work);
}

.iui_notify_info
{
	background-color: #1ba1e2;
	color: var(--color_bg_work);
}
.iui_notify_info .iui_notify-closer {
  background-color: #1ba1e2;
  color: var(--color_bg_work);
}
.iui_notify_info .iui_notify-closer:hover {
  background-color: #59cde2;
}
.iui_notify_info .iui_notify-closer:active {
  background-color: #1b6eae;
}

.iui_notify_success
{
	background-color: #60a917;
	color: var(--color_bg_work);
}
.iui_notify_success .iui_notify-closer {
  background-color: #60a917;
  color: var(--color_bg_work);
}
.iui_notify_success .iui_notify-closer:hover {
  background-color: #7ad61d;
}
.iui_notify_success .iui_notify-closer:active {
  background-color: #128023;
}

.iui_notify_warning
{
	background-color: #fa6800;
	color: var(--color_bg_work);
}
.iui_notify_warning .iui_notify-closer {
  background-color: #fa6800;
  color: var(--color_bg_work);
}
.iui_notify_warning .iui_notify-closer:hover {
  background-color: #ffc194;
}
.iui_notify_warning .iui_notify-closer:active {
  background-color: #bf5a15;
}

.iui_notify_alert
{
	background-color: #ce352c;
	color: var(--color_bg_work);
}
.iui_notify_alert .iui_notify-closer {
  background-color: #ce352c;
  color: var(--color_bg_work);
}
.iui_notify_alert .iui_notify-closer:hover {
  background-color: #da5a53;
}
.iui_notify_alert .iui_notify-closer:active {
  background-color: #9a1616;
}

.iui_notify_work
 {
  background-color: #fb8400;
  color: var(--color_bg_work);
}

.iui_notify_work .iui_notify-closer {
  background-color: #fb8400;
  color: var(--color_bg_work);
}
.iui_notify_work .iui_notify-closer:hover {
  background-color: var(--color_bg_work);
}
.iui_notify_work .iui_notify-closer:active {
  background-color: var(--color_bg_work);
}

.iui_status_label
{
	font-size: calc(var(--i_font_main_size) - 2px);
	padding: 2px;
	padding-left: 4px;
	padding-right: 4px;
	border-radius: 2px;
	margin-right: 2px;
}

/*############################ Treeview PHP class css settings #####################*/
[data-aid="tree_element_container"]
{
	padding-left: 10px;
	margin-top: 2px;
}

[data-aid="tree_element_toggle"]
{
	float: left;
	width: 11px;
	height: 11px;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: center center;
	margin-top: 4px;
	margin-right: 3px;
	margin-bottom: 4px;

}

[data-aid="tree_element_toggle"].tree_element_toggle_hide
{
	background-image: url(../icon/iui_treeview_toggle_close.svg);
}

[data-aid="tree_element_toggle"].tree_element_toggle_show
{
	background-image: url(../icon/iui_treeview_toggle_open.svg);
}

[data-aid="tree_element_label"].selected_tree_element
{
    color: var(--color_font_select);
    background: var(--color_bg_select);
    
}
div[data-aid="tree_element_icon"]
{
	margin-bottom: 4px;
}



/*Keresési eredmény sorban az egyedi értékek helye*/
[data-aid='search_container'] [data-aid='tree_element_label']
{
	height: auto;
}

div.iui_tree_element_label [data-aid="s_search_tv"]
{
	display: block;
	clear: both;
	color: var(--color_font_aux);
	font-style: italic;
}





/*########################### default empty space and paging ################################
If a folder is empty or there is no search result... */
[data-aid="empty"]
{
	vertical-align: middle;
	horizontal-align: center;
	text-align: center;
	/*height: 200px;*/
	color:  var(--color_font_aux);
	
	/*background-image: url(../icon/iui_empty.svg);
	background-size:30px 30px;
	background-repeat: no-repeat;
	background-position: 0px 0px;*/


	margin-top: 10px;
	margin-bottom: 10px;
	width: 100%;
	height: 40px;
	overflow: hidden;	
}


/*############################ MENU components css  ##################################*/

[data-aid='menu']
{
	    border-radius: 3px;
}


[data-aid='menu_container']
{
	 animation: fadein 0.2s;
    -moz-animation: fadein 0.2s; 
    -webkit-animation: fadein 0.2s; 
    -o-animation: fadein 0.2s;

}



/*Determines the complete line in a menu. 
Its right padding must contain the > sign in case of a submenu. 
So mimiumum 35 px is recommended*/
[data-aid="menu_element_part"]
{
	padding-right: 40px;
	margin-top: 1px;
	margin-bottom: 2px;
	border-radius: 3px;
	
}
/*Hover css of the menu label. */
[data-aid="menu_element_part"]:hover
{
	background-color: var(--color_bg_hover);
	color: var(--color_font_hover);
	box-shadow: 0px 0px 2px #DDD;
}



[data-aid="menu_delimiter"]
{
	border-top: 1px solid var(--color_border);
	margin-top: 3px;
	margin-bottom: 3px;
}

[data-aid="menu_container"].iui_menu_context
{
	margin-top: 3px;	
}
	
[data-aid="menu_container"].iui_menu_context [data-aid="menu"]
{
	background-color: var(--color_bg_work);
	font-size: calc(var(--i_font_main_size) - 1px);
	padding: 7px;
	border: 1px solid var(--color_border);
	box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.12);
}

/*Menu icon*/
[data-aid="menu_icon"]
{

	width: 24px;
	height: 24px;
	border-radius: 3px;
	margin-right: 4px;

}

/*The menu label containg text...*/
[data-aid="menu_container"].iui_menu_context [data-aid="menu_label"]
{
	/*padding-top: 4px;
	padding-bottom: 4px;
	padding-left: 4px;
	padding-right: 4px;*/
	line-height: 24px;
}



[data-aid="menu_container"].iui_menu_context [data-aid="menu_element_part"].iui_menu_submenu
{
	background-image: url('../icon/iui_menu_submenu.svg');
	background-size: 8px 8px;
	background-position: 99% center ;
	background-repeat: no-repeat;
}






[data-aid="menu_container"].iui_menu_main
{
	color: var(--color_font_work);
}

[data-aid="menu_container"].iui_menu_main [data-aid="menu"]
{
	font-size: calc(var(--i_font_main_size) - 1px);
	display: flex;
}

[data-aid="menu_container"].iui_menu_main [data-aid="menu_element"]
{
	overflow-x: hidden;
	text-overflow: ellipsis;
	width: initial;
}

[data-aid="menu_container"].iui_menu_main [data-aid="menu_element_part"]
{
	display: block;
	padding-right: 5px;
	margin-right: 10px;
	
	
}

[data-aid="menu_container"].iui_menu_main [data-aid="menu_element_part"]:hover
{
	
}

[data-aid="menu_container"].iui_menu_main [data-aid="menu_label"]
{
	padding-top: 3px;
	padding-bottom: 4px;


}





/*######################################## SEARCHING STYLES  #################################*/
.iui_search
{
	text-decoration: underline;

}
.iui_search_highlighting
{
	background-color: #ffe564;
	font-weight: bold;
}

.iui_search_highlighting_color_0
{
	background-color: #ffe564;
}

.iui_search_highlighting_color_1
{
	background-color: #ffd280;
}

.iui_search_highlighting_color_2
{
	background-color: #aaf2ff;
}

.iui_search_highlighting_color_3
{
	background-color: #b8ffa4;
}


/*#########################x Content tables (not design tables) css   #####################################*/
table.iui_table_name_value_list
{
	width: 100%;
	font-size: calc(var(--i_font_main_size) + 3px);
}

table.iui_table_name_value_list tr
{
	border-bottom: 1px solid var(--color_bg_window);
	height: 34px;
	vertical-align: center;
}

table.iui_table_name_value_list tr td
{
	padding-top: 5px;
	padding-bottom: 5px;
}


table.iui_table_name_value_list tr:nth-child(even) td
{
	background-color: var(--color_bg_even);
}

table.iui_table_name_value_list tr td:nth-child(1), table.iui_table_name_value_list tr td:nth-child(3)
{
	white-space: nowrap;
	width:33%;
	text-align: right;
	padding-right: 15px;
	text-transform: uppercase;
	font-size: calc(var(--i_font_main_size) - 2px);
	color: var(--color_font_aux);

}
table.iui_table_name_value_list tr td:nth-child(2)
{


}

table.iui_table_name_value_list tr td .iui_att_icon
{
	width: 18px;
	height: 18px;
	vertical-align: middle;
	background-position: center center;
	background-size: 80%;
	background-repeat: no-repeat;
	display: inline-block;
	
}
/*################################# CÍMKÉS TÁBLÁZATOK CSS-E, PL. PÉNZÜGYI OLVASÁS ##########################*/
div.iui_table_label_title
{
	font-size: calc(var(--i_font_main_size) + 3px);
	text-align: left;
	/*background-color: var(--color_bg_hover);*/
	color: var(--color_font_text);
	font-weight: bold;
	border-bottom: 1px solid var(--color_border);

	margin-bottom: 3px;
	/*border-radius: 5px;
	*/
	
	
}

div.iui_table_label_title:first-letter
{
	text-transform: uppercase;
}

div.iui_table_label_title span:nth-child(2)
{
	float:right;
	color: var(--color_font_work);
}
table.iui_table_label
{
	width: 100%;
	margin-bottom: 40px;
}
table.iui_table_label tr
{
	border-bottom: 1px solid var(--color_bg_window);
	height: 34px;
}

table.iui_table_label tr td
{

	padding-top: 7px;
	padding-bottom: 7px;
	font-size: calc(var(--i_font_main_size) + 3px);
	height: 18px;
	padding-right: 20px;
}
table.iui_table_label tr td.iui_header_label
{

	color: var(--color_font_aux);
	text-transform: uppercase;
	font-size: calc(var(--i_font_main_size) - 2px);
	line-height: 12px;
	text-align: left;
    text-overflow: ellipsis;
    white-space: nowrap;
    vertical-align: bottom;
    padding-bottom: 0px;
    
}
table.iui_table_label tr td div
{
    text-overflow: ellipsis;
    white-space: nowrap;
}
table.iui_table_label tr td div:nth-child(1)
{
	color: var(--color_font_aux);
	text-transform: uppercase;
	font-size: calc(var(--i_font_main_size) - 2px);
	height: 12px;
	line-height: 12px;
	text-align: left;
	
}

table.iui_table_label tr td div:nth-child(2)
{
	font-size: calc(var(--i_font_main_size) + 3px);
	height: 18px;
}

.iui_content_tr .iui_tree_down, .shell_div .iui_tree_down
{
	background-image: url('../icon/iui_tree_down.svg');
	background-size: 60%;
	filter: brightness(80%);
}

.iui_content_tr .iui_context_menu, .shell_div .iui_context_menu
{
	background-image: url('../icon/iui_button_contextmenu.svg');
	filter: brightness(80%);
	background-size: 55%;
}

.iui_content_tr .iui_context_info, .shell_div .iui_context_info
{
	background-image: url('../icon/iui_button_context_info.svg');
	background-size: 55%;
	filter: brightness(80%)
}

.iui_content_tr .iui_toggle
{
	background-image: url('../icon/iui_select_arrow_right.svg');
	background-position: center;
	background-repeat: no-repeat;
	background-size: 50%;


}

.iui_content_tr.iui_open .iui_toggle
{
	background-image: url('../icon/iui_select_arrow_down.svg');
	align-self: self-start;
}


.iui_content_tr.disabled, .shell_div:disabled
{
	display: block;
	opacity: 0.5;
	filter:alpha(opacity=50);
}
/*########################### LISTA SUMMA FOOTER TÁBLÁZATOK #####################*/

span.iui_number_decimal
{
	font-size: calc(var(--i_font_main_size) - 0px);
}

div.iui_list_sum > div.iui_list_sum_value
{
	font-size: calc(var(--i_font_main_size) + 5px);
	
	padding-left: 10px;
	padding-right: 10px;
	text-align: right;
}

div.iui_list_sum > div.iui_list_sum_label
{
	font-size: calc(var(--i_font_main_size) - 4px);
	
	padding-left: 10px;
	padding-right: 10px;
	
	color: var(--color_font_aux);
	text-transform: uppercase;
	text-align: left;
    vertical-align: top;
    padding-bottom: 0px;
    padding-top: 5px;
}

div.iui_list_sum div.iui_list_sum_currency,
div.iui_footer_row div.iui_list_sum_currency
{
	font-size: calc(var(--i_font_main_size) - 2px);
	font-weight: bold;
	
	background-color: #054767;
	color: white;
	text-align: center;
	
	padding: 3px;
	border-radius: 5px;
    margin: 1px 0px 2px 0px;
}

div.iui_list_sum > div
{
    text-overflow: ellipsis;
    white-space: nowrap;
}

/*########################### table rows even-odd colors ##########################x*/
.iui_content_tr
{
	border-bottom: 1px solid var(--color_bg_window);
	height: 35px;
	-webkit-transition: background-color 0.3s; /* Safari */
    transition: background-color 0.3s;
	padding-top: 3px;
	padding-bottom: 3px;
}

[data-aid='w_content_header'] .iui_content_tr,
[data-aid='w_content_header_2'] .iui_content_tr,
[data-aid='table_header'] .iui_content_tr,
[data-aid='list_intersect_header'] .iui_content_tr,
[data-aid='tabs_content_header'] .iui_content_tr
{
	padding: 0px;
	height: 35px;
	
}

[data-aid='tabs_content_header'] .iui_content_tr
{
	padding-left: 10px;
	padding-right: 10px;
}

[data-aid='w_content_header'] .iui_content_tr div, 
[data-aid='w_content_header_2'] .iui_content_tr div, 
[data-aid='table_header'] .iui_content_tr div, 
[data-aid='list_intersect_header'] .iui_content_tr div, 
[data-aid='w_content_header'] .iui_content_tr div.iui_status_icon, 
[data-aid='table_header'] .iui_content_tr div.iui_status_icon,
[data-aid='list_intersect_header'] .iui_content_tr div.iui_status_icon,
[data-aid='tabs_content_header'] .iui_content_tr div.iui_status_icon
{
	height: 100%;
	padding: 2px;
}


[data-aid='w_content_header'] .iui_content_tr:hover,
[data-aid='w_content_header_2'] .iui_content_tr:hover,
[data-aid='table_header'] .iui_content_tr:hover,
[data-aid='list_intersect_header'] .iui_content_tr:hover,
[data-aid='tabs_content_header'] .iui_content_tr:hover
{
	background-color: initial;
}

.iui_content_tr:hover
{
	background-color: var(--color_bg_hover_sec);
	color: var(--color_font_hover);
	box-shadow: 0px 0px 2px var(--color_shadow_ambient);
}

[data-aid='w_content_header'] div.iui_content_tr:hover,
[data-aid='list_intersect_header'] div.iui_content_tr:hover,
[data-aid='tabs_content_header'] .iui_content_tr:hover
{
	color: inherit;
}
[data-aid='w_content_header'] div.iui_content_tr > div[data-aorder]:hover,
[data-aid='list_intersect_header'] div.iui_content_tr > div[data-aorder]:hover
{
	color: var(--color_font_hover);
}

/*.iui_content_tr:nth-child(odd)
{

}

.iui_content_tr:nth-child(even)
{
	background-color: var(--color_bg_even); 
}*/
/*all of the selected graphical object's color.*/

/*! ########### Kijelölési stílusok #################*/

div.iui_flowchart [data-aid='flowchart_element'].iui_selected
{
    color: var(--color_font_select);
    background: var(--color_bg_select);
}


/*! #################### SELECT STÍLUS BEÁLLÍTÁSOK #############*/

[data-aid='w_content'] .iui_selected.iui_content_tr .shell_icon:not(.iui_noselect),
[data-aid='w_content'] .iui_selected.iui_content_tr .iui_select_area:not(.iui_noselect),
[data-aid='w_content'] .iui_selected.iui_content_tr .iui_monogram:not(.iui_noselect),
[data-aid='w_content'] [data-aid='element'].iui_selected > .shell_icon:not(.iui_noselect),
[data-aid='w_content'] [data-aid='element'].iui_selected > .iui_monogram:not(.iui_noselect)
{
	border-radius: 40px;    
	border: 1px solid var(--color_bg_select) !important;
	background-image: url('../icon/iui_selected.svg') !important;
	background-color: var(--color_bg_select) !important;
	user-select: none;
	color: rgba(0, 0, 0, 0) !important; /*A monogram miatt el kell tűntetni am betűket, ha vannak. */
	background-repeat: no-repeat;
	background-position: center;
}

[data-aid='w_content'] .iui_selected .shell_pic
{
	background-image: unset !important;
}



 .iui_select_area
 {
 	cursor: pointer;
 }

/*hover color of table rows.*/
/*
.iui_content_tr:nth-child(odd):hover, .iui_content_tr:nth-child(even):hover
{
	background-color: #DDD;

}
*/

/*######################### DRAG AND DROP CSS CLASSES #####################*/
.iui_drag_source
{
	z-index: 10000;
	box-shadow: 0px 0px 10px 1px var(--color_shadow);
}


.iui_drop_target
{	
	outline: 1px dotted var(--color_main);
	/*background-color: var(--color_bg_hover);*/
	background-image: url('../background/iui_drop_target.svg')
}
/*######################### SHELL STRUCTURE CSS SETTINGS ###################
icons and infos belonging to records (shell name, etc) 
In explore_pic modul this is the outermost container of a record's data.

The structure is in +c_vr_div_shell.html

*/
.shell_div
{
	width: 24%;
	min-width: 300px;
	height: 110px; 
	margin-right: 5px; 
	margin-bottom: 5px; 
	padding: 5px; 

}

.shell_div:hover
{

}
/*The big shell icon's size*/
.shell_div div.shell_icon
{
	width: 100px; 
	height: 100px;
	border-radius: 5px; 
}
/*The text in the shell_div. */
.shell_div_text
{
	width: 60%;
	min-width: 190px; 
	height: 100px; 
	padding-left: 10px;
	color: var(--color_font_work);
}
/*The shell_name in the .shell_div_text*/
.shell_div_shell_name
{
	font-size: calc(var(--i_font_main_size) + 3px);
}
/*The category name's container div in the .shell_div_text*/
.shell_div_category
{
	font-style: italic;
	margin-bottom: 10px;
}
/*Optionally every record can have an 'avatar' picture. 
It is adjustable in c_rec_mod_shell_modify settings. This is the container div 
of the adjusted picture. The picture will be set as background-image. */
.shell_div div.shell_icon div.shell_pic
{
	width:100px;
	height: 100px;
}

/* Link type icon's plcaeholder div. Generally it's empty
but in some cases an icon is needed to show the link type. 
For example: c_Rec_lt_shortcut. See link connections, 
and c_rec_lt classes! */
.iui_lt_icon
{	
	background-size: 80%;
}

/*################## META RECORD'S ATTRIBUTE ICONS ############################*/
/*Every record have meta-attributes, such as 
readonly, archived, etc. This is attributes are 
shown with icons in this placeholder. */
.iui_att_icon
{	
	background-size: 90%;
	border-radius: 3px;
	width: 30px;
	height: 30px;
}

.system .iui_att_icon
{
	background-image: url('../icon/iui_att_system.svg');
	background-color: blue;
}

.readonly .iui_att_icon
{
	background-image: url('../icon/c_rec_denied.svg');
	background-color: orange;
}

.lock .iui_att_icon
{
	background-image: url('../icon/iui_att_lock.svg');
	background-color: orange;
}


.iui_archive
{
	opacity: 0.50;
	filter:alpha(opacity=50);
}

.new .iui_att_icon
{

	background-image: url('../icon/iui_att_new.svg');
	background-color: orange;
}

.iui_archive .iui_att_icon
{
	background-image: url('../icon/iui_att_archive.svg');
	background-color: #555;
}

.secret .iui_att_icon
{

	background-image: url('../icon/iui_att_secret.svg');
	background-color: red;
}

.approved .iui_att_icon
{

	background-image: url('../icon/iui_att_approved.svg');
	background-color: var(--color_mod_org);
}

.released .iui_att_icon
{

	background-image: url('../icon/iui_att_released.svg');
	background-color: var(--color_main);
}

.test .iui_att_icon
{

	background-image: url('../icon/iui_att_test.svg');
	background-color: var(--color_main);
	
}


.content_type .iui_att_icon
{

	background-image: url('../icon/iui_att_template.svg');
	background-color: green;
}

.temp .iui_att_icon
{
	background-image: url('../icon/iui_att_temp.svg');
	background-color: gray;
	
}

.unsafe .iui_att_icon
{
	background-image: url('../icon/iui_att_unsafe.svg');/*KÉPET LESZEDNI*/
	background-color: red;
	
}

.entity .iui_att_icon
{
	background-image: url('../icon/iui_att_entity.svg');/*KÉPET LESZEDNI*/
	background-color: #333;
	
}

.has_comment
{
	color: red;
	font-weight: bold;
}

.lock .iui_att_icon
{
	background-image: url('../icon/iui_att_lock.svg');
	background-color: orange;
}

.progress .iui_att_icon
{

	background-image: url('../icon/iui_att_progress.svg');
	background-color: #AAA;


}


.iui_flagged .iui_att_icon
{
	background-image: url('../icon/iui_att_flagged.svg');
	background-color: unset;
}


.iui_private .iui_att_icon
{
	background-image: url('../icon/iui_att_private.svg');
	background-color: unset;
}

.iui_public .iui_att_icon
{
	background-image: url('../icon/iui_att_public.svg');
	background-color: unset;
}


/*################  SHELL / RECORD TYPE ICONS #################################*/

/* The shell icon's placeholder div. These icons belong to record types. Almost every record type has 
an own icon. See c_rec_data and its descendant records. */
.shell_icon
{
	background-size: 85%;
	background-color: var(--color_main);
	background-image: url('../icon/c_rec.svg');
}



/* When using table-like display format, icons located in table rows in a placeholder div. */
[data-aid='w_content'] .iui_content_tr div.shell_icon, 
[data-aid='w_content'] .iui_content_tr div.iui_status_icon, 
[data-aid='w_content'] .iui_content_tr div.iui_read_icon,  
[data-aid='w_content'] .iui_content_tr div.iui_event_icon
{
	width: 24px;
	height: 24px;
	background-size: 85%;
	border-radius: 3px; 
	margin-top: 2px;
	margin-right: 3px;
	margin-bottom: 1px;
	margin-left: 5px; 
}
/*When using table-like display format avatar picture placeholder. */
[data-aid='w_content'] .iui_content_tr div.shell_icon div.shell_pic
{
	/*width: 24px;
	height: 24px; */
	height: 100%;
}
/*Attribute icons's placeholder in table-like display format. */
[data-aid='w_content'] .iui_content_tr .iui_att_icon, 
[data-aid='w_content'] .iui_content_tr .iui_lt_icon
{	
	background-size: 16px 16px;
	width: 18px;
	height: 18px;
	clear: none;
	
}

[data-aid='w_content_header'] .shell_icon,
[data-aid='w_content_header_2'] .shell_icon,
[data-aid='table_header'] .shell_icon,
[data-aid='list_intersect_header'] .shell_icon,
[data-aid='tabs_content_header'] .iui_content_tr .shell_icon
{
	background-color: inherit;
	background-image: none;
}



/*! ###################################  Color profile of WINDOW objects ##############################
Please note that other css files can determine window objects, such as +window.css. In addition js code and PHP code
can determine the window's appereance and behaviour. It can disable or enable structural parts or can ovveride any css. 
So developer can change the appereance described below if needed. 
*/
[data-aid="window"]
{
		border-radius: 5px;
}


/*!The colors of the active (focused) window object. */
.iui_w_active
{
	background-color: var(--color_bg_window);
	/*background-color: rgba(240, 240, 240, 0.7);*/
	color: var(--color_font_text);
	box-shadow: 0px 3px 20px rgba(0, 0, 0, 0.15);
}

[data-aid="window"].iui_w_active
{
	border-color: var(--color_main);

}
[data-aid="window"].iui_w_inactive
{
	border-color: rgba(200, 200, 200, 0.9);

}


[data-aid='window'].iui_w_state_max [data-aid='content']
{		
	
	
}

.iui_window_def.iui_w_inactive
{


}

/*NE MOZGASD EL INNEN!!!*/
.c_rec_mail .shell_icon, div[class*="c_rec_mod_message"] .shell_icon
{
	background-image: url('../icon/c_rec_mail.svg');
	background-color: var(--color_mod_message);
	background-size: 75%;

}
  

/*!The layout-window is a special unobserved window object suits into the layout. 
More information: c_window_layout php class.  */
.iui_window_layout.iui_w_active
{
	box-shadow: 0px 0px 0px;
	border: 0px solid var(--color_bg_work);

}

/*! Inactive (non-focused) window color settings*/
.iui_w_inactive
{
  
	color: #999;
	/*background-color: #DDD;*/
	background-color: var(--color_bg_window);
	box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.12);
}

/*!The tray containers colors and sizes. This is a div fixed to the bottom or top of the browser's viewport. 
It contains tray and quick menu elements.  */

	[data-aid='tray_container']
	{
		background-color: var(--color_bg_work);/*rgba(0,0,0,0.3);*/
		box-shadow: 1px 1px 1px #000;
		padding-bottom: 3px;
		padding-top: 3px;
		font-size: calc(var(--i_font_main_size) - 1px);
	}
	/*Tray is located inside tray_container div. It's purpose is to hold the place for the window's tray element.  */
	


[data-aid='tray'] *
{
	opacity: 1.0;
	filter:alpha(opacity=100);
}   




/*!Tray elements are small divs on the tray belonging to any opened window obejct. These tray elements must have the
same state as window objects. They contain the same text as window objects title text. */

/*Tray elements color css during its belonging window is in minimum state. */
[data-aid='w_tray_element'].iui_w_state_min
{

}

/*Tray elements color css during its belonging window is in mid state. */
[data-aid='w_tray_element'].iui_w_state_mid
{		   

}

/*Tray elements color css during its belonging window is in max state. */
[data-aid='w_tray_element'].iui_w_state_max
{	
	
}

/*! Tray element's hover style. */
[data-aid='w_tray_element']:hover
{

}



[data-aid='menu_element_part'].iui_w_menu_close [data-aid='menu_icon'],
[data-aid='menu_element'].iui_w_menu_close [data-aid='menu_icon'] 
{
	background-image: url('../icon/iui_w_menu_close.svg');
	background-color: var(--color_main);
	background-size: 80%;
}

[data-aid='menu_element_part'].iui_w_menu_window [data-aid='menu_icon'] 
{
	background-image: url('../icon/iui_w_menu_window.svg');
	background-color: var(--color_main);
	background-size: 80%;
}


[data-aid='menu_element_part'].iui_w_menu_tab [data-aid='menu_icon'] 
{
	background-image: url('../icon/iui_w_menu_tab.svg');
	background-color: var(--color_main);
	background-size: 80%;
}

[data-aid='menu_element_part'].iui_w_menu_advanced_view [data-aid='menu_icon'] 
{
	background-image: url('../icon/iui_w_menu_advanced_view.svg');
	background-color: var(--color_main);
	background-size: 80%;
}

[data-aid='menu_element_part'].iui_w_menu_pls_url [data-aid='menu_icon'],
div[class="c_rec_mod_shell_url"] .shell_icon
{
	background-image: url('../icon/iui_w_menu_pls_url.svg');
	background-color: var(--color_main);
	background-size: 80%;
}


[data-aid='menu_element_part'].iui_w_menu_print [data-aid='menu_icon'],
[data-aid='menu_element'].iui_w_menu_print [data-aid='menu_icon'] 
{
	background-image: url('../icon/iui_print.svg');
	background-color: var(--color_main);
	background-size: 80%;
}
/*##################################  WINDOW STRUCTURE ###############################
The css settings below belong to different part of window structure. 
The figure below shows the parts of the window structure. It is defined in a html snippet file. See 
+c_window_alr_structure. Please consider that many css is set in window.css. 

***************************************content**********************************
*													w_titlebar												*
*********************************************************************************
*													w_toolbar												*
*																												*
*********************************************************************************
*************************************w_contentbar******************************
*							*	*******w_contentbar_center****	*								*
*							*	*********************************	*								*
*w_contentbar_left	*	*			w_content_header		*	*w_contentbar_right	*
*							*	********************************	*								*
*							*	*			w_content					*	*								*
*							*	*											*	*								*
*							*	*											*	*								*
*							*	*	***************************	*	*								*
*							*	*		w_content_footer			*	*								*
*							*	*											*	*								*
*							*	********************************	*								*
*********************************************************************************
*											statusbar														*
*																												*
*********************************************************************************
*/

/*content: This is the 2nd outermost div of the window. It contains every other part. This div is positioned in case of drag and drop 
events and is resized in case of resize events. 
So there is no point in set size here. If you want ot set the initial size of the window, you can 
do it in PHP moduls. 

The css styles below are in the optical order of the window structure from top to bottom and from outer parts to the inner parts. 
*/
[data-aid="content"]
{
	background-color: inherit;
	border-radius: 5px;
	color: var(--color_font_work);
}



[data-aid='w_titlebar']
{
	background-color: var(--color_bg_work);
}



/*Window icons (not record type icons) 
This is the animated icon appears during ajax communication. */
[data-aid='w_titlebar'].iui_loading [data-aid='w_titlebar_icon']
{
	background-image: url('../icon/iui_progress.svg');
	background-size: 80% 100%;
	background-color: inherit;
}



/* Standard window buttons in titlebar. The 4 button: 
-min
-mid
-max

The visibility of these buttons depends on:
1. the size-state of the window object
2. wther the belonging state is enbaled or not from JS and PHP

-close

The close button can be disabled from JS and PHP


 */
 
/*The window close button and its hover state.*/
[data-aid="w_titlebar_button_close"]
{
	background-image: url('../icon/iui_w_button_close.svg');
	background-size: 12px 12px;

}
[data-aid="w_titlebar_button_close"]:hover
{
	background-color: red;
}

/*The window max button and its hover state*/
[data-aid="w_titlebar_button_max"]
{
	background-image: url('../icon/iui_w_button_max.svg');
	background-size: 12px 12px;
}

[data-aid="w_titlebar_button_max"]:hover
{
	background-color: var(--color_bg_hover);
}

/*The window mid button and its hover state*/
[data-aid="w_titlebar_button_mid"]
{
	background-image: url('../icon/iui_w_button_mid.svg');
	background-size: 14px 12px;
}
[data-aid="w_titlebar_button_mid"]:hover
{
	background-color: var(--color_bg_hover);
}
/*The window min button and its hover state*/
[data-aid="w_titlebar_button_min"]
{
	background-image: url('../icon/iui_w_button_min.svg');
    background-size: 12px 12px;

}
[data-aid="w_titlebar_button_min"]:hover
{
	background-color: var(--color_bg_hover);
}

 [data-aid="w_titlebar_button_refresh"]
{
	background-image: url('../icon/iui_w_button_refresh.svg');
    background-size: 20px 20px;
	display: none;
}
 [data-aid="w_titlebar_button_refresh"]:hover
{
	background-color: var(--color_bg_hover);
}

/*
*/
[data-aid='w_titlebar_text']
{

}


/*The toolbar is a div for conating buttons and other form elements on the top of the window. 
It can be disable from PHP. The size is set in the window.css*/

[data-aid="w_toolbar"]
{
	background-color: var(--color_bg_work);	
}

.iui_window [data-aid="w_toolbar"].iui_search_alert
{
	cursor: pointer;
	background-image: url(../icon/iui_clear_search.svg);
	color: var(--color_border_required);
	border: 1px solid var(--color_border_required);
	background-color: var(--color_bg_required);
	border-radius: 3px;

	/*Lásd az iui_window_desktop, iui_window_tablet, és az iui_window_mobile css fájlokat is. */	
}


/*The navigator div, it contains clickable link pointing to parent records in the tree structure.  */
[data-aid="w_navibar"]
{
	background-color: var(--color_bg_work);
}

[data-aid="w_navibar_navigator"]
{

}



/*Contenbar is a div containg other divs. It is the 3rd div from the top. It is design to contain the 
content of the window. It contains 3 other divs: left, center and right contetnbar. */
[data-aid='w_contentbar']
{
	background-color: var(--color_bg_work);
}
/*The 'w_contentbar_left_handler div are design to handle the resize events. 
It contains the w_contentbar_left, so its color is inherited to it. Basicly its only appears in 
a narrow place at the border of the w_contentbar_left.  */
.iui_window_def [data-aid='w_contentbar_left_handler']
{	
	background-color:  var(--color_bg_window);
	box-shadow: -1px 0px 0px 0px var(--color_main) inset;
}

.iui_window_def.iui_w_inactive [data-aid="content"]
{
	/*filter: grayscale(0.7) brightness(0.95);*/
	
}


/* w_contentbar_left: the left div in order to contain treeview or form. It is resizable and 
it can be disabled by PHP settings. */
[data-aid='w_contentbar_left']
{	
	background-color: inherit;

}
/*The 'w_contentbar_right_handler  div are design to handle the resize events. 
It contains the w_contentbar_right, so its color is inherited to it. Basicly its only appears in 
a narrow place at the border of the w_contentbar_right.  */
.iui_window_def [data-aid='w_contentbar_right_handler']
{
	background-color: var(--color_bg_window);
	box-shadow: 1px 0px 0px 0px var(--color_main) inset;
	
}
/* w_contentbar_right: the right div in order to contain treeview or form. It is resizable and 
it can be disabled by PHP settings. */
[data-aid='w_contentbar_right']
{	
	background-color: inherit;
}



/* The design css of the open/close buttons of left and right area.*/
.iui_window_def [data-aid='w_contentbar_left_switch'] [data-aid='w_contentbar_left_button'], [data-aid='w_contentbar_right_switch'] [data-aid='w_contentbar_right_button']
{
	background-color: var(--color_bg_window);
	cursor: pointer;
}

/**/
.iui_window_def [data-aid='w_contentbar_left_switch'] [data-aid='w_contentbar_left_button']
{
	border-radius: 0px 5px 5px 0;
	border-right: 1px solid var(--color_main);
	border-top: 1px solid var(--color_main);
	border-bottom: 1px solid var(--color_main);

}
/**/
.iui_window_def [data-aid='w_contentbar_right_switch'] [data-aid='w_contentbar_right_button']
{
	border-radius: 5px 0px 0px 5px;
	border-left: 1px solid var(--color_main);
	border-top: 1px solid var(--color_main);
	border-bottom: 1px solid var(--color_main);

}


/* The main place for displaying content. It consist of two other divs: w_content_header and w_content!*/
[data-aid='w_contentbar_center']
{
	background-color: inherit;
}
/*! This is where the table headers are placed. Since the w_content is scrollable, this div is not scrollable. 
This way the table header stays visible.  */
[data-aid='w_content_header'],
[data-aid='w_content_header_2']
{
	
	font-size: calc(var(--i_font_main_size) - 2px);
	color: var(--color_font_aux);
	
}

[data-aid="w_content_header"] div div,
[data-aid="w_content_header_2"] div div,
[data-aid="table_header"] div div,
[data-aid="list_intersect_header"] div div,
[data-aid='tabs_content_header'] div div div
{
	border-right: 1px var(--color_border) solid;
	text-align: left !important;
}

/*The place for the pure content: table rows, icons, etc. */
@media only screen and (min-width: 768px) 
{
	[data-aid='w_content']
	{
		background-color: inherit;
	}
}

/*The w_content_footer div is design to display preview or details of a selected element. 
It is disabled by default. It is resiable vertically. That's why it has a handler as well, vich 
contains the w_content_footer div. */
[data-aid='w_content_footer_handler']
{
	background-color: var(--color_bg_work);
	border-top: 1px var(--color_main) solid;
}
/*! The statusbar is the bottommost div of the window. It is designed to hold buttons or other 
elements. */
[data-aid="w_statusbar"]
{
	/*background-color: var(--color_bg_work);*/
}

/* SEPCIAL WINDOW TYPES DERIVING FROM C_WINDOW 
There are special window types derived in PHP form c_window class
*/




/*MODUL SPECIFIC DESIGN CSS SETTINGS.*/

/*Time handling a calnedar settings. */

/*calendar list is a special view of calendar entires. Entries are distributed by days but 
the lengt of entries are not displayed. */
/*The small divs of calendar entries. It's corner is rounded */
[data-mod='c_rec_mod_time_data_calendar_list'] [data-aid='w_content'] div.iui_content_tr div div
{
	border-radius: 0px 5px  0px 5px;
}
/* Past entries are diferent. */
[data-mod='c_rec_mod_time_data_calendar_list'] [data-aid='w_content'] div.iui_content_tr div div.iui_calendar_past
{
	background-color: var(--color_bg_work);
	opacity: 0.3;
	filter:alpha(opacity=30);	
}
/*Past calendar entries hover state: helps reading...*/
[data-mod='c_rec_mod_time_data_calendar_list'] [data-aid='w_content'] div.iui_content_tr div div.iui_calendar_past:hover
{
	
	background-color: var(--color_bg_work);
	opacity: 1;
	filter:alpha(opacity=100);	
}
/*Present calendar entries*/
[data-mod='c_rec_mod_time_data_calendar_list'] [data-aid='w_content'] div.iui_content_tr div div.iui_calendar_present
{
	background-color: var(--color_bg_work);
	border: solid #6BADF6 2px;
	
}
/*Future calendar entries.*/
[data-mod='c_rec_mod_time_data_calendar_list'] [data-aid='w_content'] div.iui_content_tr div div.iui_calendar_future
{
	background-color: var(--color_bg_work);

}


/* Diary modul design css:*/
/*The big texts in the toolbar of diary moduls displaying week number or month name. */
@media only screen and (min-width: 768px)
{
	.iui_header_date
	{
		font-size: 25px;
		/*text-shadow: 1px 0 0 var(--color_main), -1px 0 0 var(--color_main), 0 1px 0 var(--color_main), 0 -1px 0 var(--color_main), 1px 1px var(--color_main), -1px -1px 0 var(--color_main), 1px -1px 0 var(--color_main), -1px 1px 0 var(--color_main);*/
		color: var(--color_font_text);
		text-align:right;
	}
}

@media only screen and (max-width: 768px)
{
	.iui_header_date
	{
		font-size: 30px;
		line-height: 8vmin;
		padding-top: 12px;
		valign: center;
		
	}
}

/* Weeky diary modul: long events (more than 25 h long) are displayed different way on the top of the timetable. */
[data-mod*='time_data_diary_list_weekly'] [data-aid='diary_long_container'] div.iui_diary_element
{
	border-radius: 5px 5px  5px 5px;
	background-color: #6BADF6;
	border: 2px solid var(--color_bg_work);
}
/*Diary elements in weekly diary. */
[data-mod*='time_data_diary_list_weekly'] td > div  div.iui_diary_element
{
	border-radius: 5px 5px  5px 5px;
	background-color: #6BADF6;
	border: 1px solid var(--color_bg_work);
}

/*Hourly timtable cell's border in weekly diary modul. It is on the left and contains hour's numbers of the day. */
[data-mod*='time_data_diary_list_weekly'] td > div .iui_diary_hours
{
	border-top: solid 1px var(--color_bg_window);
	border-left: solid 1px var(--color_bg_window);
	color: #DDD;
}

/*The column of hours of the weekly diary modul. */
[data-mod*='time_data_diary_list_weekly'] td > .iui_diary_hours
{
	border-top: solid 1px var(--color_bg_window);
	color: #AAA;
}

/*The line showing the actual time blinking like a cursor. */
[data-mod*='time_data_diary_list_weekly'] td > div  div.iui_diary_actual_time_inner
{
	border: 1px solid var(--color_bg_work);
	background-color: #FF6969;
	
	-webkit-animation-name: diary_pulse; /* Chrome, Safari, Opera */
    -webkit-animation-duration: 1s; /* Chrome, Safari, Opera */
    animation-name: diary_pulse;
    animation-duration: 1s;
    animation-iteration-count: infinite;
}

/*The div of actual day in the weekly diary modul. */
[data-mod*='time_data_diary_list_weekly'] [data-aid='w_content_header']  div.iui_content_tr> .iui_time_today > div
{
	/*font-weight: bold;*/
	text-decoration: underline;
}

/* Design of daily calendar modul. */
/*The long diary entry elements:longer than 24 hours so it is displayed on the top of the timetable. */
[data-mod='c_rec_mod_time_data_diary_list_daily'] [data-aid='diary_long_container'] div.iui_diary_element
{
	border-radius: 5px 5px  5px 5px;
	background-color: var(--color_bg_work);
	color: #000;	
	border: 2px solid var(--color_bg_window);
}
/*The normal (not long) diary entries. */
[data-mod='c_rec_mod_time_data_diary_list_daily'] td > div  div.iui_diary_element
{
	border-radius: 5px 5px  5px 5px;
	background-color: var(--color_bg_work);
	border: 2px solid var(--color_bg_window);
}

/*Hourly timtable cell's border in daily diary modul. It is on the left and contains hour's numbers of the day. */
[data-mod='c_rec_mod_time_data_diary_list_daily'] td > div .iui_diary_hours
{
	border-top: solid 1px var(--color_bg_window);
	border-left: solid 1px var(--color_bg_window);
	color: var(--color_font_aux);
}

/*The column of hours of the daily diary modul. */
[data-mod='c_rec_mod_time_data_diary_list_daily'] td > .iui_diary_hours
{
	border-top: solid 1px var(--color_bg_window);
	color: var(--color_font_aux);
}

/*The div of actual day in the daily diary modul. */
[data-mod='c_rec_mod_time_data_diary_list_daily'] td > div  div.iui_diary_actual_time_inner
{
	border: 1px solid var(--color_bg_work);
	background-color: #b10800;
	
	-webkit-animation-name: diary_pulse; /* Chrome, Safari, Opera */
    -webkit-animation-duration: 3s; /* Chrome, Safari, Opera */
    animation-name: diary_pulse;
    animation-duration: 3s;
    animation-iteration-count: infinite;
}

/* Animation for the blinking line showing actual time*/
/* Chrome, Safari, Opera */
@-webkit-keyframes diary_pulse {
 0%   {background-color: b10800;}
 50%   {background-color: white;}
 100%   {background-color: b10800;}
}
/* Standard syntax */
@keyframes diary_pulse {
 0%   {background-color: b10800;}
 50%   {background-color: white;}
 100%   {background-color: b10800;}
}

/* Design of monthly diary modul.*/
/*The design of a day's div in monthly diary modul. */
[data-mod*='time_data_diary_list_monthly'] td > div  div.iui_diary_element_inner
{
	border-radius: 5px 5px  5px 5px;
	background-color: var(--color_bg_window);
	border: 2px solid var(--color_bg_work);
}
/*The design of a long (longer than 24 H) event's div in monthly diary modul. */
[data-mod*='time_data_diary_list_monthly'] td > div  div.iui_diary_element_inner > .iui_diary_element_event_short_container > .iui_diary_element_event_short
{
	border-radius: 5px 5px  5px 5px;
	border: 2px solid var(--color_bg_work);
}
/*The design of a short (shorter than 24 H) event's div in monthly diary modul. */
[data-mod*='time_data_diary_list_monthly'] td > div  div.iui_diary_element_inner > .iui_diary_element_event_long_container > .iui_diary_element_event_long
{
	border-radius: 2px 2px  2px 2px;
	border: 2px solid var(--color_bg_work);
}

/* The div of actual day in monthly diary modul*/
[data-mod*='time_data_diary_list_monthly'] td > div  div.iui_diary_element_actual
{
	border: 2px solid #b10800;
	-webkit-animation-name: diary_border_pulse; /* Chrome, Safari, Opera */
    -webkit-animation-duration: 3s; /* Chrome, Safari, Opera */
    animation-name: diary_border_pulse;
    animation-duration: 3s;
    animation-iteration-count: infinite;
}

/* Animation for the blinking line showing actual time*/
/* Chrome, Safari, Opera */
@-webkit-keyframes diary_border_pulse {
 0%   {border-color: b10800;}
 50%   {border-color: white;}
 100%   {border-color: b10800;}
}
/* Standard syntax */
@keyframes diary_border_pulse {
 0%   {border-color: b10800;}
 50%   {border-color: white;}
 100%   {border-color: b10800;}
}


[data-mod*='time_data_diary_list_monthly'] [data-aid='w_content'] [data-aid="list_intersect_container"] [data-aid*="list_intersect_day"]
{
	margin: 1px 1px 0px 0px;
	border-radius: 5px;
}

[data-mod*='time_data_diary_list_monthly'] [data-aid='w_content'] [data-aid="list_intersect_container"] [data-aid*="list_intersect_day"]:not(.iui_diary_day_empty)
{
	border: 1px solid var(--color_bg_window);
}

/*Munkaszüneti napok területe*/
[data-mod*='time_data_diary_list_monthly'] [data-aid='w_content'] [data-aid="list_intersect_container"] [data-aid*="list_intersect_day"].iui_c_rec_time_holiday
{
	background-color: #ffdbdb;
}

/*MÁthelyezett munkanapok területe*/
[data-mod*='time_data_diary_list_monthly'] [data-aid='w_content'] [data-aid="list_intersect_container"] [data-aid*="list_intersect_day"].iui_c_rec_time_workday
{
	background-color: #ffebbe;
}

/*Az aktuális nap jelölése*/
[data-mod*='time_data_diary_list_monthly'] [data-aid='w_content'] [data-aid="list_intersect_container"] [data-aid*="list_intersect_day"].iui_diary_day_actual
{
	border: 3px solid red;
}

/*A következő / előző hónap napjainak jelölése*/
[data-mod*='time_data_diary_list_monthly'] [data-aid='w_content'] [data-aid="list_intersect_container"] [data-aid*="list_intersect_day"].iui_diary_day_other
{
	background-color: var(--color_bg_window);
	border: 1px solid var(--color_bg_work);
}

/*A nap dátuma*/
[data-mod*='time_data_diary_list_monthly'] [data-aid='w_content'] [data-aid="list_intersect_container"] [data-aid*="list_intersect_day"]>[data-aid="name"]
{
	padding: 3px;
	font-size: 1.5em;
	font-weight: bold;
}

/*Egy napon belüli események száma*/
[data-mod*='time_data_diary_list_monthly'] [data-aid='w_content'] [data-aid="list_intersect_container"] [data-aid*="list_intersect_day"]>[data-aid*="quantity"]:not(:empty)
{
	padding: 3px;
	margin: 3px;
	
	border-radius: 3px;
	background-color: var(--color_bg_window);
}

/*Eseményeket tároló konténer*/
[data-mod*='time_data_diary_list_monthly'] [data-aid='w_content'] [data-aid="list_intersect_container"] [data-aid*="list_intersect_day"]>[data-aid="container"]
{
	padding: 3px;
}


/*Egy esemény megjelenítése*/
[data-aid="list_intersect_container"] [data-aid*="list_intersect_day"] [data-aid="element"]
{
	border-radius: 3px;
	margin-bottom: 2px;
}

[data-aid="list_intersect_container"] [data-aid*="list_intersect_day"] [data-aid="exceptional"] [data-aid="element"]
{

}

/*Egy esemény időpontjának kinézete*/
[data-aid="list_intersect_container"] [data-aid*="list_intersect_day"] [data-aid="container"] [data-aid="element"]>[data-aid="i_time_calculated_begin"]
{
	margin-left: 3px;
	padding-top: 2px;
}
/*Egy esemény nevének kinézete*/
[data-aid="list_intersect_container"] [data-aid*="list_intersect_day"] [data-aid="container"] [data-aid="element"]>[data-aid="s_shell_name"]
{
	padding-left: 5px;
	padding-top: 2px;
	
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

/*Egy esemény nevének kinézete kivételes nap esetén*/
[data-aid="list_intersect_container"] [data-aid*="list_intersect_day"] [data-aid="exceptional"] [data-aid="element"]>[data-aid="s_shell_name"]
{
	margin-left: 3px;
	padding-top: 7px;
	text-transform: uppercase;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

/*Nem munkanapok megkülönböztetése*/
[data-aid="list_intersect_container"] [data-aid*="list_intersect_day"].iui_diary_non_workday [data-aid="name"],
[data-aid="list_intersect_container"] [data-aid*="list_intersect_day"].iui_diary_non_workday [data-aid="exceptional"] [data-aid="s_shell_name"]
{
	color: var(--color_font_aux);
}

/*Munkaszüneti napok*/
[data-aid="list_intersect_container"] [data-aid*="list_intersect_day"].c_rec_time_holiday [data-aid="name"],
[data-aid="list_intersect_container"] [data-aid*="list_intersect_day"].c_rec_time_holiday [data-aid="exceptional"] [data-aid="s_shell_name"]
{
	color: red;
}

/*Áthelyezett munkanap*/
[data-aid="list_intersect_container"] [data-aid*="list_intersect_day"].c_rec_time_workday [data-aid="name"],
[data-aid="list_intersect_container"] [data-aid*="list_intersect_day"].c_rec_time_workday [data-aid="exceptional"] [data-aid="s_shell_name"]
{
	color: var(--color_font_aux);
}


/* Design of inner tables. */
[data-aid='table_header'],
[data-aid='list_intersect_header'],
[data-aid='tabs_content_header'] div
{
	text-transform: uppercase;
	font-size: calc(var(--i_font_main_size) - 2px);
	color: var(--color_font_aux);
}

/* Colors of genders. */
.iui_male div.shell_icon
{
	background-color: blue;
}

.iui_female div.shell_icon
{
	background-color: pink;
}


/*This section contains operation-related css rules. */
.op_icon
{
	background-repeat: no-repeat;
	background-size: 80%;
	background-position: center;
	display: inline-block;
	/*Ha azt akarod, hogy a mérete megegyezzen a mellette lévő szöveg méretével, akkor tegyél bele &nbsp; html entitást! */
}

.c_op_modify .op_icon
{
	background-image: url(../icon/c_op_modify.svg);
}


/*This section contains the shell icons. All c_rec_data descendants have a specific icon. It's like windows file type icons.
The icon images are in png or svg, the background color is in css. Colors express the business logic topic of the record type
*/

.c_rec_root .shell_icon
{
	background-image: url('../icon/c_rec_root.svg');
	background-color: var(--color_main);

}


.c_rec_policy_pro .shell_icon, [class*="c_rec_mod_policy"] .shell_icon
{
	background-image: url('../icon/c_rec_denied.svg');
	background-color: var(--color_main);

}

[class*="c_rec_mod_shell_edit_access_type"] .shell_icon
{
	background-image: url('../icon/c_rec_mod_shell_edit_access_type.svg');
	background-color: var(--color_main);

}

.c_rec_log .shell_icon, [class*="c_rec_mod_log"] .shell_icon
{
	background-image: url('../icon/c_rec_log.svg');
	background-color: var(--color_main);

}


/*Szervezeti egységek ikonjai */
.c_rec_world
{
	
}

div[class*="c_rec_mod_org"]  .shell_icon
{
	background-color: var(--color_mod_org);
}
.c_rec_world .shell_icon,
.c_rec_world > .shell_icon.iui_child
{
	background-image: url('../icon/c_rec_world.svg');
	background-color: var(--color_mod_org);
	
}

.c_rec_company .shell_icon, div[class*="c_rec_mod_org_partner"]  .shell_icon,
div[class*="c_rec_mod_org_company"]  .shell_icon,
div[class*="c_rec_mod_org_financial"]  .shell_icon
{
	background-color: var(--color_mod_org);
	background-image: url('../icon/c_rec_company.svg');
}

.c_rec_branch_office .shell_icon, div[class*="c_rec_mod_org_branch_office"] .shell_icon
{
	background-color: var(--color_mod_org);
	background-image: url('../icon/c_rec_branch_office.svg');
}



.c_rec_division .shell_icon, div[class*="c_rec_mod_org_division"]  .shell_icon
{
	background-image: url('../icon/c_rec_division.svg');
	background-color: var(--color_mod_org);
}

.c_rec_site .shell_icon, div[class*="c_rec_mod_org_site"]  .shell_icon
{
	background-image: url('../icon/c_rec_site.svg');
	background-color: var(--color_mod_org);
}

.c_rec_department .shell_icon, div[class*="c_rec_mod_org_department"]  .shell_icon
{
	background-image: url('../icon/c_rec_department.svg');
	background-color: var(--color_mod_org);
}

.c_rec_group .shell_icon, 
div[class*="c_rec_mod_org_group"]  .shell_icon
{
	background-image: url('../icon/c_rec_group.svg');
	background-color: var(--color_mod_org);
}

div.c_rec_mod_org_person_import .shell_icon
{
	background-image: url('../icon/c_rec_mod_doc_upload_f.svg');
}

div[class*="c_rec_mod_shell_edit_owner_group"]  .shell_icon
{
	background-image: url('../icon/c_rec_group.svg');
	background-color: var(--color_main);
}

.c_rec_employee .shell_icon, div[class*="c_rec_mod_org_employee"]  .shell_icon
{
	background-image: url('../icon/c_rec_employee.svg');
	background-color: var(--color_mod_org);
}

.c_rec_person .shell_icon, div[class*="c_rec_mod_org_person"]  .shell_icon
{
	background-image: url('../icon/c_rec_person.svg');
	background-color: var(--color_mod_org);

}

div[class*="c_rec_mod_org_taxnumber_validate"] .shell_icon
{
	background-image: url('../icon/c_rec_mod_org_taxnumber_validate.svg');
	background-color: var(--color_mod_org);

}


.c_rec_competence .shell_icon, div[class*="c_rec_mod_competence"]  .shell_icon
{
	background-image: url('../icon/c_rec_competence.svg');
	background-color: var(--color_mod_work);
}

.c_rec_content_type .shell_icon, div[class*="c_rec_mod_content_type"]  .shell_icon
{
	background-image: url('../icon/c_rec_content_type.svg');
	background-color: var(--color_main);
}

.c_rec_ct_customer .shell_icon, div[class*="c_rec_mod_content_type"]  .shell_icon
{
	background-image: url('../icon/c_rec_content_type.svg');
	background-color: var(--color_main);
}

.c_rec_ct_supplier .shell_icon, div[class*="c_rec_mod_content_type"]  .shell_icon
{
	background-image: url('../icon/c_rec_content_type.svg');
	background-color: var(--color_main);
}

.c_rec_folder_masterdata .shell_icon
{
	background-image: url('../icon/c_rec_folder_masterdata.svg');
	background-color: var(--color_mod_folder);
}

.c_rec_masterdata .shell_icon
{
	background-image: url('../icon/c_rec_masterdata.svg');
	background-color: var(--color_main);
}

.c_rec_md_human_name .shell_icon
{
	background-image: url('../icon/c_rec_masterdata.svg');
	background-color: var(--color_main);
}

.c_rec_md_ledger_account .shell_icon
{
	background-image: url('../icon/c_rec_md_ledger_account.svg');
	background-color: var(--color_main);
}

.c_rec_md_competence_field .shell_icon
{
	background-image: url('../icon/c_rec_competence_field.svg');
	background-color: var(--color_main);
}

.c_rec_md_competence_level .shell_icon
{
	background-image: url('../icon/c_rec_competence.svg');
	background-color: var(--color_main);
}

.c_rec_md_country .shell_icon
{
	background-image: url('../icon/c_rec_md_country.svg');
	background-color: var(--color_main);
}

.c_rec_md_region .shell_icon
{
	background-image: url('../icon/c_rec_md_location.svg');
	background-color: var(--color_main);
}

.c_rec_md_county .shell_icon
{
	background-image: url('../icon/c_rec_md_location.svg');
	background-color: var(--color_main);
}

.c_rec_md_town .shell_icon
{
	background-image: url('../icon/c_rec_md_location.svg');
	background-color: var(--color_main);
}

.c_rec_md_status .shell_icon
{
	background-image: url('../icon/c_rec_md_status.svg');
	background-color: var(--color_main);
}


.c_rec_md_language .shell_icon
{
	background-image: url('../icon/c_rec_masterdata.svg');
	background-color: var(--color_main);
}

.c_rec_md_proficiency_level .shell_icon
{
	background-image: url('../icon/c_rec_masterdata.svg');
	background-color: var(--color_main);
}

.c_rec_md_qualification_field .shell_icon
{
	background-image: url('../icon/c_rec_masterdata.svg');
	background-color: var(--color_main);
}

.c_rec_md_qualification_level .shell_icon
{
	background-image: url('../icon/c_rec_masterdata.svg');
	background-color: var(--color_main);
}

.c_rec_md_profession_field_group .shell_icon
{
	background-image: url('../icon/c_rec_masterdata.svg');
	background-color: var(--color_main);
}

.c_rec_md_profession_field .shell_icon
{
	background-image: url('../icon/c_rec_masterdata.svg');
	background-color: var(--color_main);
}

.c_rec_md_position .shell_icon
{
	background-image: url('../icon/c_rec_position.svg');
	background-color: var(--color_main);
}

.c_rec_md_currency .shell_icon
{
	background-image: url('../icon/c_rec_md_currency.svg');
	background-color: var(--color_main);
}

.c_rec_md_pack_unit .shell_icon
{
	background-image: url('../icon/c_rec_masterdata.svg');
	background-color: var(--color_main);
}


.c_rec_md_qu_piece .shell_icon
{
	background-image: url('../icon/c_rec_masterdata.svg');
	background-color: var(--color_main);
}

.c_rec_md_qu_length .shell_icon
{
	background-image: url('../icon/c_rec_masterdata.svg');
	background-color: var(--color_main);
}

.c_rec_md_qu_area .shell_icon
{
	background-image: url('../icon/c_rec_masterdata.svg');
	background-color: var(--color_main);
}

.c_rec_md_qu_volume .shell_icon
{
	background-image: url('../icon/c_rec_masterdata.svg');
	background-color: var(--color_main);
}

.c_rec_md_qu_weight .shell_icon
{
	background-image: url('../icon/c_rec_masterdata.svg');
	background-color: var(--color_main);
}

.c_rec_md_qu_time .shell_icon
{
	background-image: url('../icon/c_rec_masterdata.svg');
	background-color: var(--color_main);
}

.c_rec_color_scheme .shell_icon
{
	background-image: url('../icon/c_rec_color_scheme.svg');
	background-color: var(--color_main);
}

.c_rec_folder .shell_icon
{
	background-image: url('../icon/c_rec_folder.svg');
	background-color: var(--color_mod_folder);
}


.c_rec_request .shell_icon, div[class*="c_rec_mod_request_list"]  .shell_icon, div[class*="c_rec_mod_request_new"]  .shell_icon, div[class*="c_rec_mod_request_decision"]  .shell_icon
{
	background-image: url('../icon/c_rec_request.svg');
	background-color: var(--color_mod_work);
}

.c_rec_mod_shell_browse .shell_icon
{
	background-image: url('../icon/c_rec_mod_shell_browse.svg');
	background-color: var(--color_main);
}

.c_rec_mod_shell_recent .shell_icon
{
	background-image: url('../icon/c_rec_mod_shell_recent.svg');
	background-color: var(--color_main);
}


.c_rec_mod_shell_read .shell_icon
{
	background-image: url('../icon/c_rec_mod_shell_read.svg');
	background-color: var(--color_main);
}

.c_rec_mod_shell_modify .shell_icon
{
	background-image: url('../icon/c_rec_mod_shell_modify.svg');
	background-color: var(--color_main);
}

/*Az egységes meta adatlap két modulja a régi olvasó és módosító modul ikonját viszi tovább:
 *a kontextusmenükben és a listákban ugyanaz a művelet ugyanazzal a képpel jelenjen meg. */
.c_rec_mod_shell_read_2 .shell_icon
{
	background-image: url('../icon/c_rec_mod_shell_read.svg');
	background-color: var(--color_main);
}

.c_rec_mod_shell_modify_2 .shell_icon
{
	background-image: url('../icon/c_rec_mod_shell_modify.svg');
	background-color: var(--color_main);
}

.c_rec_mod_shell_rename .shell_icon
{
	background-image: url('../icon/c_rec_mod_shell_rename.svg');
	background-color: var(--color_main);
}

.c_rec_mod_shell_create .shell_icon
{
	background-image: url('../icon/c_rec_mod_shell_create.svg');
	background-color: var(--color_main);
}

.c_rec_mod_shell_explore .shell_icon
{
	background-image: url('../icon/c_rec_mod_shell_explore.svg');
	background-color: var(--color_main);
}

.c_rec_mod_shell_trash .shell_icon
{
	background-image: url('../icon/c_rec_mod_shell_trash.svg');
	background-color: var(--color_main);
}

.c_rec_mod_shell_hide .shell_icon
{
	background-image: url('../icon/c_rec_mod_shell_hide.svg');
	background-color: var(--color_main);
}

.c_rec_mod_shell_delete .shell_icon
{
	background-image: url('../icon/c_rec_mod_shell_delete.svg');
	background-color: var(--color_main);
	background-size: 60%;
}

.c_rec_mod_shell_delete_non_trigger .shell_icon
{
	background-image: url('../icon/c_rec_mod_shell_delete.svg');
	background-color: var(--color_main);
	background-size: 60%;
}

.c_rec_mod_connector_delete .shell_icon
{
	background-image: url('../icon/c_rec_mod_shell_delete.svg');
	background-color: var(--color_main);
	background-size: 60%;
}

.c_rec_mod_shell_delete_as_modify .shell_icon
{
	background-image: url('../icon/c_rec_mod_shell_delete.svg');
	background-color: var(--color_main);
	background-size: 60%;
}

.c_rec_mod_shell_delete_test .shell_icon
{
	background-image: url('../icon/c_rec_mod_shell_delete_test.svg');
	background-color: var(--color_main);
	background-size: 60%;

}

.c_rec_mod_shell_link_delete .shell_icon
{
	background-image: url('../icon/c_rec_mod_shell_link_delete.svg');
	background-color: var(--color_main);

}

 div[class*="c_rec_mod_shell_assign_menufolder"]  .shell_icon
{
	background-image: url('../icon/c_rec_mod_shell_assign_menufolder.svg');
	background-color: var(--color_main);

}


 div[class*="c_rec_mod_shell_move"]  .shell_icon
{
	background-image: url('../icon/c_rec_mod_shell_move.svg');
	background-color: var(--color_main);

}

 div[class*="c_rec_mod_shell_convert_to_content_type"]  .shell_icon
{
	background-image: url('../icon/c_rec_mod_shell_convert_to_content_type.svg');
	background-color: var(--color_main);

}
	
 div[class*="c_rec_mod_shell_save_as"]  .shell_icon,  div[class*="c_rec_mod_shell_copy"]  .shell_icon
{
	background-image: url('../icon/c_rec_mod_shell_save_as.svg');
	background-color: var(--color_main);
}
		
.c_rec_mod_shell_approve .shell_icon
{
	background-image: url('../icon/c_rec_mod_shell_approve.svg');
	background-color: var(--color_main);
}

.c_rec_mod_shell_archive .shell_icon
{
	background-image: url('../icon/c_rec_mod_shell_archive.svg');
	background-color: var(--color_main);
}

.c_rec_mod_shell_secret .shell_icon
{
	background-image: url('../icon/c_rec_mod_shell_secret.svg');
	background-color: var(--color_main);
}


.c_rec_mod_shell_search .shell_icon
{
	background-image: url('../icon/c_rec_mod_shell_search.svg');
	background-color: var(--color_main);
}

.c_rec_mod_shell_version .shell_icon
{
	background-image: url('../icon/c_rec_mod_shell_version.svg');
	background-color: var(--color_main);
}

.c_rec_mod_shell_search_similar .shell_icon
{
	background-image: url('../icon/c_rec_mod_shell_search_similar.svg');
	background-color: var(--color_main);
}	


.c_rec_mod_shell_unlock .shell_icon
{
	background-image: url('../icon/c_rec_mod_shell_unlock.svg');
	background-color: var(--color_main);

}

div[class*="c_rec_mod_shell_module"] .shell_icon, .iui_w_menu_about [data-aid='menu_icon']
{
	background-image: url('../icon/c_rec_mod_shell_module_list.svg');
	background-color: var(--color_main);

}


.c_rec_content_type .shell_icon, 
.c_rec_mod_shell_assign_content_type .shell_icon, 
.c_rec_mod_shell_edit_content_type .shell_icon
{
	background-image: url('../icon/c_rec_content_type.svg');
	background-color: var(--color_main);
}	
	

		
div[class*="c_rec_mod_convert"] .shell_icon
{
	background-image: url('../icon/c_rec_mod_convert.svg');
	background-color: var(--color_main);
}				
	
		
div[class*="c_rec_mod_shell_bookmark"] .shell_icon
{
	background-image: url('../icon/c_rec_mod_shell_bookmark.svg');
	background-color: var(--color_main);
}				
div[class*="c_rec_mod_shell_tile"] .shell_icon
{
	background-image: url('../icon/c_rec_mod_shell_tile.svg');
	background-color: var(--color_main);
	background-size: 60%;
}		
		
.c_rec_alb .shell_icon
{
	background-image: url('../icon/c_rec_alb.svg');
	background-color: var(--color_main);
}

.c_rec_tag .shell_icon
{
	background-image: url('../icon/c_rec_tag.svg');
	background-color: var(--color_main);
}

.c_rec_weblink .shell_icon
{
	background-image: url('../icon/c_rec_weblink.svg');
	background-color: var(--color_main);
}

.c_rec_user .shell_icon, 
div[class*="c_rec_mod_user"]  .shell_icon, 
div[class*="c_rec_mod_shell_read_list"]  .shell_icon,
div[class*="c_rec_mod_admin_user"]  .shell_icon
{ 
	background-image: url('../icon/c_rec_user.svg');
	background-color: var(--color_main);	
}

.c_rec_subpage .shell_icon
{
	background-image: url('../icon/c_rec_subpage.svg');
	background-color: var(--color_main);
}

.c_rec_pic .shell_icon, [class*="c_rec_mod_pic"] .shell_icon
{
	background-image: url('../icon/c_rec_pic.svg');
	background-color: var(--color_mod_pic);
	background-size: 75%;
}

.c_rec_exchange_rate .shell_icon, [class*="c_rec_mod_exchange_rate"] .shell_icon
{
	background-image: url('../icon/c_rec_exchange_rate.svg');
	background-color: var(--color_mod_invoice);
	background-size: 75%;
}

.c_rec_mod_pic_rotate .shell_icon
{
	background-image: url('../icon/c_rec_mod_pic_rotate.svg');
	background-color: var(--color_mod_pic);
	background-size: 75%;
}

.c_rec_mod_pic_flip .shell_icon
{
	background-image: url('../icon/c_rec_mod_pic_flip.svg');
	background-color: var(--color_mod_pic);
	background-size: 75%;
}

.c_rec_mod_pic_flop .shell_icon
{
	background-image: url('../icon/c_rec_mod_pic_flop.svg');
	background-color: var(--color_mod_pic);
	background-size: 75%;
}


.c_rec_doc .shell_icon, div[class*="c_rec_mod_doc"]  .shell_icon
{
	background-image: url('../icon/c_rec_doc.svg');
	background-color: var(--color_mod_doc);
	background-size: 80%;

}

.c_rec_dr_schedule .shell_icon, div[class*="c_rec_mod_dr"]  .shell_icon
{
	background-image: url('../icon/c_rec_dr_schedule.svg');
	background-color: var(--color_mod_doc);
	background-size: 80%;

}


div[class*="c_rec_mod_doc_download"]  .shell_icon
{
	background-image: url('../icon/c_rec_mod_doc_download.svg');
	background-color: var(--color_mod_doc);
	background-size: 80%;

}


div[class*="c_rec_mod_doc_upload"]  .shell_icon
{
	background-image: url('../icon/c_rec_mod_doc_upload.svg');
	background-color: var(--color_mod_doc);
	background-size: 80%;

}


.c_rec_doc_pdf .shell_icon, div[class*="c_rec_mod_doc_pdf"]  .shell_icon
{
	background-image: url('../icon/c_rec_doc_pdf.svg');
	background-color: #AA0000;

}

.c_rec_doc_doc .shell_icon
{
	background-image: url('../icon/c_rec_doc_doc.svg');
	background-color: #0000AA;

}

.c_rec_doc_xls .shell_icon
{
	background-image: url('../icon/c_rec_doc_xls.svg');
	background-color: #007700;

}

.c_rec_doc_mail .shell_icon
{
	background-image: url('../icon/c_rec_mail.svg');
	background-color: var(--color_mod_doc);
	background-size: 75%;

}



.c_rec_doc_legal .shell_icon
{
	background-image: url('../icon/c_rec_doc.svg');
	background-color: var(--color_mod_doc);

}

.c_rec_doc_ifsr .shell_icon, div[class*="ifsr"]  .shell_icon
{
	background-image: url('../icon/c_rec_doc_ifsr.svg');
	background-color: var(--color_main);

}

.c_rec_task .shell_icon , div[class*="c_rec_mod_work"]  .shell_icon,
[data-mod='c_rec_mod_work_todo_list2'] [data-aid="tab_content_3"] div.iui_content_tr.c_rec_task>.shell_icon
{
	background-image: url('../icon/c_rec_task.svg');
	background-color: var(--color_mod_work);
}

div.c_rec_mod_work_task_mail_complete  .shell_icon
{
	background-image: url(../icon/iui_task_mail_complete.svg);
	background-color: var(--color_mod_org);
}

.c_rec_folder_project .shell_icon
{
	background-image: url('../icon/c_rec_folder.svg');
	background-color: var(--color_mod_work);
}

.c_rec_project_normal .shell_icon , div[class*="c_rec_mod_work_project"]  .shell_icon,
[data-mod='c_rec_mod_work_todo_list2'] [data-aid="tab_content_3"] div.iui_content_tr.c_rec_project_normal>.shell_icon,
[data-mod='c_rec_mod_sprint_planner'] div.iui_content_tr.c_rec_project_normal>.shell_icon
{
	background-image: url('../icon/c_rec_project.svg');
	background-color: var(--color_mod_work);

}

.c_rec_project_holiday .shell_icon,
[data-mod='c_rec_mod_sprint_planner'] div.iui_content_tr.c_rec_project_holiday>.shell_icon
{
	background-image: url('../icon/c_rec_project_holiday.svg');
	background-color: var(--color_mod_work);

}

.c_rec_project_sick_leave .shell_icon,
[data-mod='c_rec_mod_sprint_planner'] div.iui_content_tr.c_rec_project_sick_leave>.shell_icon
{
	background-image: url('../icon/c_rec_project_sick_leave.svg');
	background-color: var(--color_mod_work);

}

.c_rec_project_repair .shell_icon,
[data-mod='c_rec_mod_sprint_planner'] div.iui_content_tr.c_rec_project_repair>.shell_icon
{
	background-image: url('../icon/c_rec_project_repair.svg');
	background-color: var(--color_mod_work);

}

.c_rec_epic .shell_icon,
[data-mod='c_rec_mod_sprint_planner'] div.iui_content_tr.c_rec_epic>.shell_icon
{
	background-image: url('../icon/c_rec_epic.svg');
	background-color: var(--color_mod_work);
}

.c_rec_story .shell_icon,
[data-mod='c_rec_mod_sprint_planner'] div.iui_content_tr.c_rec_story>.shell_icon
{
	background-image: url('../icon/c_rec_story.svg');
	background-color: var(--color_mod_work);
}

.c_rec_sprint .shell_icon,
div[class*="c_rec_mod_sprint_planner"] .shell_icon
{
	background-image: url('../icon/c_rec_sprint.svg');
	background-color: var(--color_mod_work);
}

.c_rec_user_voice .shell_icon,
div[class*="c_rec_mod_sprint_uv"] .shell_icon
{
	background-color: var(--color_mod_work);
}

.c_rec_product_backlog .shell_icon
{
	background-image: url('../icon/c_rec_product_backlog.svg');
	background-color: var(--color_mod_work);
}

 div[class*="c_rec_mod_work_start"] .shell_icon,  div[class*="c_rec_mod_work_reopen"] .shell_icon
{
	background-image: url('../icon/c_rec_mod_work_start.svg');
	background-color: var(--color_mod_work);

}
 div[class*="c_rec_mod_work_interrupt"] .shell_icon
{
	background-image: url('../icon/c_rec_mod_work_interrupt.svg');
	background-color: var(--color_mod_work);

}

 div[class*="c_rec_mod_work_task_fc_present"] .shell_icon
{
	background-image: url('../icon/c_rec_mod_work_task_fc_present.svg');
	background-color: var(--color_mod_work);

}

 div[class*="c_rec_mod_work_task_fc_past"] .shell_icon
{
	background-image: url('../icon/c_rec_mod_work_task_fc_past.svg');
	background-color: var(--color_mod_work);

}

 div[class*="c_rec_mod_work_task_fc_future"] .shell_icon
{
	background-image: url('../icon/c_rec_mod_work_task_fc_future.svg');
	background-color: var(--color_mod_work);

}
 div[class*="c_rec_mod_work_todo_list"] .shell_icon
{
	background-image: url('../icon/c_rec_mod_work_todo_list.svg');
	background-color: var(--color_mod_work);

}

div[class*="c_rec_completion_log"]  .shell_icon, div[class*="c_rec_mod_cl"]  .shell_icon
{
	background-color: var(--color_mod_work);
	background-image: url('../icon/c_rec_completion_log.svg');
	background-size: 100%;

}

.c_rec_folder_workflow .shell_icon,  
div[class*="c_rec_mod_work_assign_workflow"]  .shell_icon,
div[class*="c_rec_mod_work_workflow_modify"] .shell_icon,
div[class*="c_rec_mod_work_workflow_read"] .shell_icon
{
	background-image: url('../icon/c_rec_folder_workflow.svg');
	background-color: var(--color_mod_work);

}
div[class*="c_rec_mod_work_gantt_modify"] .shell_icon,
div[class*="c_rec_mod_work_gantt_read"] .shell_icon
{
	background-image: url('../icon/c_rec_mod_work_gantt_modify.svg');
	background-color: var(--color_mod_work);

}


.c_rec_worksheet .shell_icon, div[class*="c_rec_mod_work_worksheet"]  .shell_icon,
[data-mod='c_rec_mod_work_todo_list2'] [data-aid="tab_content_3"] div.iui_content_tr.c_rec_worksheet>.shell_icon
{
	background-image: url('../icon/c_rec_worksheet.svg');
	background-color: var(--color_mod_work);

}

.c_rec_asset .shell_icon , div[class*="c_rec_mod_asset"]  .shell_icon
{
	background-image: url('../icon/c_rec_asset_equipment.svg');
	background-color: var(--color_mod_asset);
}

.c_rec_asset_vehicle .shell_icon , 
div[class*="c_rec_mod_asset_modify_vehicle"]  .shell_icon,
div[class*="c_rec_mod_asset_vehicle_modify"]  .shell_icon
{
	background-image: url('../icon/c_rec_asset_vehicle.svg');
	background-color: var(--color_mod_asset);
}

.c_rec_asset_workmachine .shell_icon , 	
div[class*="c_rec_mod_asset_workmachine_modify"]  .shell_icon
{
	background-image: url('../icon/c_rec_asset_workmachine.svg');
	background-color: var(--color_mod_asset);
}

.c_rec_asset_equipment .shell_icon , 
div[class*="c_rec_mod_asset_modify_equipment"]  .shell_icon,
div[class*="c_rec_mod_asset_equipment_modify"]  .shell_icon
{
	background-image: url('../icon/c_rec_asset_equipment.svg');
	background-color: var(--color_mod_asset);
}

.c_rec_asset_room .shell_icon , div[class*="c_rec_mod_asset_modify_room"] .shell_icon
{
	/*background-image: url('../icon/c_rec_asset_equipment.svg');*/
	background-color: var(--color_mod_asset);
}

.c_rec_asset_mileage .shell_icon ,
div[class*="c_rec_mod_asset_mileage_modify"] .shell_icon,
div[class*="c_rec_mod_asset_mileage_create"] .shell_icon,
div[class*="c_rec_mod_asset_mileage_list"] .shell_icon
{
	background-image: url('../icon/c_rec_asset_mileage.svg');
	background-color: var(--color_mod_asset);
}

.c_rec_task_meeting .shell_icon,
[data-mod='c_rec_mod_work_todo_list2'] [data-aid="tab_content_3"] div.iui_content_tr.c_rec_task_meeting>.shell_icon
{
	background-image: url('../icon/c_rec_task_meeting.svg');
	background-color: var(--color_mod_work);

}

.c_rec_task_meeting_teams .shell_icon,
[data-mod='c_rec_mod_work_todo_list2'] [data-aid="tab_content_3"] div.iui_content_tr.c_rec_task_meeting_teams>.shell_icon
{
	background-image: url('../icon/c_rec_task_meeting_teams.svg');
	background-color: var(--color_mod_work);

}

.c_rec_task_meeting_skype .shell_icon,
[data-mod='c_rec_mod_work_todo_list2'] [data-aid="tab_content_3"] div.iui_content_tr.c_rec_task_meeting_skype>.shell_icon
{
	background-image: url('../icon/c_rec_task_meeting_skype.svg');
	background-color: var(--color_mod_work);
}
.c_rec_task_visit .shell_icon,
[data-mod='c_rec_mod_work_todo_list2'] [data-aid="tab_content_3"] div.iui_content_tr.c_rec_task_visit>.shell_icon
{
	background-image: url('../icon/c_rec_task_visit.svg');
	background-color: var(--color_mod_work);

}

.c_rec_task_travel_time .shell_icon,
[data-mod='c_rec_mod_work_todo_list2'] [data-aid="tab_content_3"] div.iui_content_tr.c_rec_task_travel_time>.shell_icon
{
	background-image: url('../icon/c_rec_task_travel_time.svg');
	background-color: var(--color_mod_work);
}

.c_rec_task_asset .shell_icon,
div[class*="c_rec_mod_task_asset"] .shell_icon
{
	background-image: url('../icon/c_rec_task_asset.svg');
	background-color: var(--color_mod_work);
}

.c_rec_task_condition .shell_icon
{
	background-image: url('../icon/c_rec_task_condition.svg');
	background-color: var(--color_mod_work);

}


.c_rec_task_decision .shell_icon,
[data-mod='c_rec_mod_work_todo_list2'] [data-aid="tab_content_3"] div.iui_content_tr.c_rec_task_decision>.shell_icon
{
	background-image: url('../icon/c_rec_task_decision.svg');
	background-color: var(--color_mod_work);
}

.c_rec_task_ticketing .shell_icon,
[data-mod='c_rec_mod_work_todo_list2'] [data-aid="tab_content_3"] div.iui_content_tr.c_rec_task_ticketing>.shell_icon
{
	background-image: url('../icon/c_rec_ticketing-task.svg');
	background-color: var(--color_mod_work);
}

.c_rec_task_repeat .shell_icon,
[data-mod='c_rec_mod_work_todo_list2'] [data-aid="tab_content_3"] div.iui_content_tr.c_rec_task_repeat>.shell_icon
{
	background-image: url('../icon/c_rec_task_repeat.svg');
	background-color: var(--color_mod_work);
}

.c_rec_smart_link .shell_icon
{
	background-image: url('../icon/c_rec_lt_shortcut.svg');
	background-color: var(--color_mod_work);
}



*
{
}


.c_rec_folder_message .shell_icon
{
	background-image: url('../icon/c_rec_folder.svg');
	background-color: var(--color_mod_message);
}


.c_rec_folder_message_archive .shell_icon
{
	background-image: url('../icon/c_rec_folder_message_archive.svg');
	background-color: var(--color_mod_message);
}

.c_rec_folder_message_inbox .shell_icon
{
	background-image: url('../icon/c_rec_folder_message_inbox.svg');
	background-color: var(--color_mod_message);
}

.c_rec_folder_message_conversationhistory .shell_icon
{
	background-image: url('../icon/c_rec_folder_message_conversationhistory.svg');
	background-color: var(--color_mod_message);
}

.c_rec_folder_message_sentitems .shell_icon
{
	background-image: url('../icon/c_rec_folder_message_sentitems.svg');
	background-color: var(--color_mod_message);
}

.c_rec_folder_message_outbox .shell_icon
{
	background-image: url('../icon/c_rec_folder_message_outbox.svg');
	background-color: var(--color_mod_message);
}

.c_rec_folder_message_junkemail .shell_icon
{
	background-image: url('../icon/c_rec_folder_message_junkemail.svg');
	background-color: var(--color_mod_message);
}

.c_rec_folder_message_drafts .shell_icon
{
	background-image: url('../icon/c_rec_folder_message_drafts.svg');
	background-color: var(--color_mod_message);
}
.c_rec_folder_message_deleteditems .shell_icon
{
	background-image: url('../icon/c_rec_folder_message_deleteditems.svg');
	background-color: var(--color_mod_message);
}

.c_rec_comment .shell_icon
{
	background-image: url('../icon/c_rec_comment.svg');
	background-color: var(--color_mod_message);

}

.c_rec_comment_reason .shell_icon
{
	background-image: url('../icon/c_rec_comment.svg');
	background-color: var(--color_mod_work);

}

div[class*="c_rec_mod_message_personal_list"] .shell_icon
{
	background-image: url('../icon/c_rec_mod_message_personal_list.svg');
	background-color: var(--color_mod_message);
	background-size: 75%;

}

div[class*="c_rec_mod_message_data_list"] .shell_icon
{
	background-image: url('../icon/c_rec_mod_message_data_list.svg');
	background-color: var(--color_mod_message);
	background-size: 75%;

}

div[class*="c_rec_mod_message_box_data"] .shell_icon
{
	background-image: url('../icon/c_rec_mod_message_box_data.svg');
	background-color: var(--color_mod_message);
	background-size: 75%;

}

.c_rec_mod_shell_send .shell_icon
{
	background-image: url('../icon/iui_message_attachment.svg');
	background-color: var(--color_mod_message);
}		


div[class="c_rec_mod_connector_modify"] .shell_icon
{
	background-image: url('../icon/c_rec_mod_connector_modify.svg');
	background-color: var(--color_mod_message);
	background-size: 75%;

}

.c_rec_mail_bulked .shell_icon 
{
	background-image: url('../icon/c_rec_mail.svg');
	background-color: var(--color_mod_message);
	background-size: 75%;

}

.c_rec_mail_report .shell_icon,
.c_rec_mail_report > .shell_icon.iui_child
{
	background-image: url('../icon/c_rec_mail_report.svg');
	background-color: var(--color_mod_message);

}

div[class="c_rec_mod_message_send_schedule"] .shell_icon,
div[data-mod="c_rec_mod_message_send_schedule"] .shell_icon
{
	background-image: url('../../message/icon/iui_vf_schedule.svg');
	background-color: var(--color_mod_message);
}

.c_rec_chat .shell_icon,  
div[class*="c_rec_mod_message_create_comment_list"] .shell_icon,
div[class="c_rec_mod_message_create_chat"] .shell_icon,
div[class="c_rec_mod_message_forward_chat"] .shell_icon,
div[class="c_rec_mod_message_modify_as_new_chat"] .shell_icon,
div[class="c_rec_mod_message_modify_chat"] .shell_icon,
div[class="c_rec_mod_message_reply_chat"] .shell_icon
{
	background-image: url('../icon/c_rec_chat.svg');
	background-color: var(--color_mod_message);
}

.c_rec_addressbook .shell_icon, div[class*="c_rec_mod_addressbook"] .shell_icon
{
	background-image: url('../icon/c_rec_addressbook.svg');
	background-color: var(--color_mod_message);
}

div[class*="c_rec_mod_message_read_source"] .shell_icon
{
	background-image: url(../../global/icon/c_rec_mod_message_read_source.svg);
	background-color: var(--color_mod_message);
}

.c_rec_connector .shell_icon, div[class*="c_rec_mod_connector_list"] .shell_icon
{
	background-image: url('../icon/c_rec_connector.svg');
	background-color: var(--color_main);

}

.c_rec_conn_ext_ms .shell_icon, div[class*="c_rec_mod_connector_modify_admin_ms"] .shell_icon
{
	background-image: url('../icon/c_rec_conn_ext_ms.svg');
	background-color: var(--color_mod_message);

}

.c_rec_conn_ext_imap .shell_icon, div[class*="c_rec_mod_connector_modify_admin_imap"] .shell_icon
{
	background-image: url('../icon/c_rec_conn_ext_imap.svg');
	background-color: var(--color_mod_message);

}


.c_rec_conn_ext_gmail .shell_icon, div[class*="c_rec_mod_connector_modify_admin_gmail"] .shell_icon
{
	background-image: url('../icon/c_rec_conn_ext_gmail.svg');
	background-color: var(--color_mod_message);

}


.c_rec_conn_mail_mx .shell_icon, div[class*="c_rec_mod_connector_modify_admin_mx"] .shell_icon
{
	background-image: url('../icon/c_rec_conn_mail_mx.svg');
	background-color: var(--color_mod_message);

}


.c_rec_mail_rule .shell_icon, div[class*="c_rec_mod_mail_rule"] .shell_icon
{
	background-image: url('../icon/c_rec_mail_rule.svg');
	background-color: var(--color_mod_message);

}


.c_rec_asset .shell_icon 
{
	background-image: url('../icon/c_rec_asset.svg');
	background-color: var(--color_mod_asset);
}

.c_rec_operation_folder .shell_icon
{
	/*background-image: url('../icon/c_rec_asset.svg');*/
	background-image: url('../icon/c_rec_folder_message.svg');
	background-color: var(--color_mod_message);
}

.c_rec_task_mail .shell_icon
{
	background-image: url('../icon/c_rec_chat.svg');
	background-color: var(--color_mod_work);
}

.c_rec_bulk_mail .shell_icon,
div[class*="c_rec_mod_message_create_bulk"] .shell_icon,
div[class*="c_rec_mod_message_modify_bulk"] .shell_icon
{
	background-image: url('../icon/c_rec_bulk_mail.svg');
	background-color: var(--color_mod_message);
}

.c_rec_denied .shell_icon
{
	background-image: url('../icon/c_rec_denied.png');
	background-color: #880000;

}

.c_rec_geolocation .shell_icon, div[class*="c_rec_mod_geolocation"] .shell_icon
{
	background-image: url('../icon/c_rec_geolocation.svg');
	background-color: var(--color_main);
}


.c_rec_lt_user .shell_icon
{
	background-image: url('../icon/c_rec_lt_user.svg');
	background-color: var(--color_main);

}

/*########## IDŐPONTOK, NAPTÁRAK ##############*/

.c_rec_time .shell_icon, [class*="c_rec_mod_time"] .shell_icon
{
	background-image: url('../icon/c_rec_time.svg');
	background-color: var(--color_mod_time);
	background-size:75%;
}

.c_rec_time .shell_icon, [class="c_rec_mod_time_modify_context_th"] .shell_icon
{
	background-image: url('../icon/c_rec_completion_log.svg');
	background-color: var(--color_mod_work);
	background-size:75%;
}


.c_rec_time_deadline .shell_icon
{
	background-image: url('../icon/c_rec_time_deadline.svg');
	background-color: var(--color_mod_time);
}

.c_rec_time_fix .shell_icon, .c_rec_time_folder .shell_icon 
{
	background-image: url('../icon/c_rec_time_fix.svg');
	background-color: var(--color_mod_time);
}

.c_rec_time_alert .shell_icon
{
	background-image: url('../icon/c_rec_time_alert.svg');
	background-color: var(--color_mod_time);
}

.c_rec_time_th .shell_icon
{
	background-image: url('../icon/c_rec_time_fix.svg');
	background-color: var(--color_mod_time);
}

.c_rec_calendar .shell_icon
{
	background-image: url('../icon/c_rec_time.svg');
	background-color: var(--color_mod_time);
}

/*########## CMS MODULOK ###########################*/
.c_rec_cms_website .shell_icon
{
	background-image: url('../icon/c_rec_cms_website.svg');
	background-color: var(--color_main);
}

.c_rec_cms_folder .shell_icon
{
	background-image: url('../icon/c_rec_folder.svg');
	background-color: var(--color_main);
}

.c_rec_cms_menu .shell_icon
{
	background-image: url('../icon/c_rec_cms_menu.svg');
	background-color: var(--color_main);
}

.c_rec_cms_menu_element_folder .shell_icon
{
	background-image: url('../icon/c_rec_cms_menu_element_folder.svg');
	background-color: var(--color_main);
}

.c_rec_cms_menu_element_url .shell_icon
{
	background-image: url('../icon/c_rec_cms_menu_element.svg');
	background-color: var(--color_main);
}
.c_rec_cms_menu_element_action .shell_icon
{
	background-image: url('../icon/c_rec_cms_menu_element.svg');
	background-color: var(--color_main);
}

[class*="c_rec_mod_cms"] .shell_icon
{
	background-image: url('../icon/c_rec_cms.svg');
	background-color: var(--color_main);
}

.c_rec_cms_vote .shell_icon
{
	background-image: url('../icon/c_rec_cms_vote.svg');
	background-color: var(--color_main);
}

.c_rec_cms_softform_question .shell_icon,
.c_rec_cms_softform_answer .shell_icon,
[class*="c_rec_mod_cms_softform_modify"] .shell_icon
{
	background-image: url('../icon/c_rec_cms_softform.svg');
	background-color: var(--color_main);
}

/*########## HÍREK, HÍRPORTÁL CIKKEK ##############*/

.c_rec_news_section .shell_icon
{
	background-image: url('../icon/c_rec_news_section.svg');
	background-color: var(--color_main);
}

.c_rec_news_article .shell_icon,
div[class*="c_rec_mod_news_article"]  .shell_icon
{
	background-image: url('../icon/c_rec_news_article.svg');
	background-color: var(--color_main);
}

.c_rec_folder_search .shell_icon
{
	background-image: url('../icon/c_rec_folder_search.svg');
	background-color: var(--color_main);
}
.c_rec_rc .shell_icon, div[class*="c_rec_mod_rc"]  .shell_icon
{
	background-image: url('../icon/c_rec_rc.svg');
	background-color: var(--color_main);
}

/*########## TERMÉK ÉS SZOLGLÁTATÁSI CIKKEK ##############*/

.c_rec_item .shell_icon , div[class*="c_rec_mod_item"]  .shell_icon
{
	background-image: url('../icon/c_rec_item_physical.svg');
	background-color: var(--color_mod_item);
}

.c_rec_item_physical .shell_icon , div[class*="c_rec_mod_item_physical"]  .shell_icon
{
	background-image: url('../icon/c_rec_item_physical.svg');
	background-color: var(--color_mod_item);

}

.c_rec_item_virtual .shell_icon , div[class*="c_rec_mod_item_virtual"]  .shell_icon
{
	background-image: url('../icon/c_rec_item_virtual.svg');
	background-color: var(--color_mod_item);
}

.c_rec_itp_gen .shell_icon
{
	background-image: url('../icon/c_rec_item_physical.svg');
	background-color: var(--color_mod_item);

}

.c_rec_itv_gen .shell_icon
{
	background-image: url('../icon/c_rec_item_virtual.svg');
	background-color: var(--color_mod_item);
}

.c_rec_item_category .shell_icon, div[class*="c_rec_mod_item_category_modify"] .shell_icon
{
	background-image: url('../icon/c_rec_folder.svg');
	background-color: var(--color_mod_item);
}

.c_rec_item_product .shell_icon, div[class*="c_rec_mod_item_product"] .shell_icon
{
	background-image: url('../icon/c_rec_item_product.svg');
	background-color: var(--color_mod_item);
}

.c_rec_itsplr .shell_icon, div[class*="c_rec_mod_itsplr"] .shell_icon
{
	background-color: var(--color_mod_item);
	background-image: url('../icon/c_rec_itsplr.svg');
}

.c_rec_itctmr .shell_icon, div[class*="c_rec_mod_itctmr"] .shell_icon
{
	background-color: var(--color_mod_item);
	background-image: url('../icon/c_rec_itctmr.svg');
}

/*##########SHOP##############*/

.c_rec_cart_order .shell_icon, div[class*="c_rec_mod_shop"]  .shell_icon
{
	background-image: url('../icon/c_rec_cart.svg');
	background-color: #0000a0;
}


.c_rec_item_order .shell_icon
{
	background-image: url('../icon/c_rec_item.svg');
	background-color: #0000a0;
}


/*############################### SALES MODUL ######################*/
div[class*="c_rec_mod_sales"]  .shell_icon
{
	background-image: url('../icon/c_rec_cart_sales.svg');
	background-color: var(--color_mod_sales);
}
.c_rec_cart_sales_inward .shell_icon, div[class*="c_rec_mod_sales_inward"]  .shell_icon
{
	background-image: url('../icon/c_rec_cart_sales_inward.svg');
	background-color: var(--color_mod_sales);
}

.c_rec_cart_sales_outward .shell_icon, div[class*="c_rec_mod_sales_outward"]  .shell_icon
{
	background-image: url('../icon/c_rec_cart_sales_outward.svg');
	background-color: var(--color_mod_sales);
}

.c_rec_sales_stat .shell_icon, div[class*="c_rec_mod_sales_stat"]  .shell_icon
{
	background-image: url('../icon/c_rec_sales_stat.svg');
	background-color: var(--color_mod_sales);
}


/*################# WAREHOUSE, STORE  #################*/
.c_rec_scp_store .shell_icon
{
	background-image: url('../icon/c_rec_scp_store.svg');
	background-color: var(--color_mod_store);
}

.c_rec_scp_store_distribution .shell_icon
{
	background-image: url('../icon/c_rec_scp_store_distribution.svg');
	background-color: var(--color_mod_store);
}

.c_rec_scp_store_manufacture .shell_icon, div[class*="c_rec_mod_mf"]  .shell_icon
{
	background-image: url('../icon/c_rec_scp_store_manufacture.svg');
	background-color: var(--color_mod_store);
}

.c_rec_scp_store_place .shell_icon
{
	background-image: url('../icon/c_rec_scp_store_place.svg');
	background-color: var(--color_mod_store);
}

.c_rec_scp_store_row .shell_icon
{
	background-image: url('../icon/c_rec_scp_store_row.svg');
	background-color: var(--color_mod_store);
}

.c_rec_scp_store_block .shell_icon
{
	background-image: url('../icon/c_rec_scp_store_block.svg');
	background-color: var(--color_mod_store);
}

.c_rec_scp_store_column .shell_icon
{
	background-image: url('../icon/c_rec_scp_store_column.svg');
	background-color: var(--color_mod_store);
}


.c_rec_scp_store_shelf .shell_icon
{
	background-image: url('../icon/c_rec_scp_store_shelf.svg');
	background-color: var(--color_mod_store);
}

.c_rec_scp_store_area .shell_icon
{
	background-image: url('../icon/c_rec_scp_store_area.svg');
	background-color: var(--color_mod_store);
}

.c_rec_scp_transfer_zone .shell_icon
{
	background-image: url('../icon/c_rec_scp_transfer_zone.svg');
	background-color: var(--color_mod_store);
}

.c_rec_scp_vehicle .shell_icon
{
	background-image: url('../icon/c_rec_scp_vehicle.svg');
	background-color: var(--color_mod_store);
}

.c_rec_scp_unit_pallet .shell_icon
{
	background-image: url('../icon/c_rec_scp_unit_pallet.svg');
	background-color: var(--color_mod_store);
}

.c_rec_scp_unit_box .shell_icon
{
	background-image: url('../icon/c_rec_scp_unit_box.svg');
	background-color: var(--color_mod_store);
}

.c_rec_scp_unit_chest .shell_icon
{
	background-image: url('../icon/c_rec_scp_unit_chest.svg');
	background-color: var(--color_mod_store);
}

.c_rec_scp_unit_sticker .shell_icon
{
	background-image: url('../icon/c_rec_scp_unit_sticker.svg');
	background-color: var(--color_mod_store);
}

.c_rec_scp_unit_container .shell_icon
{
	background-image: url('../icon/c_rec_scp_unit_container.svg');
	background-color: var(--color_mod_store);
}

.c_rec_scp_unit_crate .shell_icon
{
	background-image: url('../icon/c_rec_scp_unit_crate.svg');
	background-color: var(--color_mod_store);
}

.c_rec_scp_unit_drum .shell_icon
{
	background-image: url('../icon/c_rec_scp_unit_drum.svg');
	background-color: var(--color_mod_store);
}


.c_rec_scv_store .shell_icon
{
	background-image: url('../icon/c_rec_scp_store.svg');
	background-color: var(--color_mod_store_v);
}


.c_rec_scv_store_area .shell_icon
{
	background-image: url('../icon/c_rec_scp_store_area.svg');
	background-color: var(--color_mod_store_v);
}

.c_rec_scv_store_shelf .shell_icon
{
	background-image: url('../icon/c_rec_scp_store_shelf.svg');
	background-color: var(--color_mod_store_v);
}


.c_rec_cart_receipt .shell_icon
{
	background-image: url('../icon/c_rec_mod_stock_receipt.svg');
	background-color: var(--color_mod_store);
}

.c_rec_cart_transfer .shell_icon
{
	background-image: url('../icon/c_rec_mod_stock_transfer.svg');
	background-color: var(--color_mod_store);
}

.c_rec_cart_transport .shell_icon, div[class*="c_rec_mod_stock_transport"] .shell_icon
{
	background-image: url('../icon/c_rec_mod_stock_transport.svg');
	background-color: var(--color_mod_store);
}



.c_rec_stock .shell_icon, div[class*="c_rec_mod_stock"] .shell_icon
{
	background-image: url('../icon/c_rec_stock.svg');
	background-color: var(--color_mod_store);
}

div[class*="c_rec_mod_stock_transfer_unit"] .shell_icon
{
    background-image: url('../icon/c_rec_scp_unit_pallet.svg');
    background-color: var(--color_mod_store);
}

.c_rec_matreq .shell_icon, div[class*="c_rec_mod_matreq"] .shell_icon
{
	background-image: url('../icon/c_rec_matreq.svg');
	background-color: var(--color_mod_store);
}

.c_rec_matreq_entry .shell_icon
{
	background-image: url('../icon/c_rec_matreq_entry.svg');
	background-color: var(--color_mod_store);
}

.c_rec_purchase_order .shell_icon, div[class*="c_rec_mod_purchase_order"] .shell_icon
{
	background-image: url('../icon/c_rec_purchase_order.svg');
	background-color: var(--color_mod_store);
}

.c_rec_purchase_order_entry .shell_icon, div[class*="c_rec_mod_purchase_order_entry"] .shell_icon
{
	background-image: url('../icon/c_rec_purchase_order_entry.svg');
	background-color: var(--color_mod_store);
}

div[class*="c_rec_mod_stock_list_activation"] .shell_icon
{
	background-image: url('../icon/c_rec_mod_stock_list_activation.svg');
	background-color: var(--color_mod_store);
}

.c_rec_h1_operation_folder .shell_icon, div[class*="c_rec_mod_operation_folder"] .shell_icon, div[class*="c_rec_mod_of_form"] .shell_icon
{
	background-image: url('../icon/c_rec_folder_message.svg');
	background-color: var(--color_mod_work);
}



div[class="c_rec_mod_stock_container_modify"] .shell_icon, div[data-mod="c_rec_mod_stock_container_modify"] .shell_icon
{
	background-image: url('../icon/c_rec_scp_store.svg');
	background-color: var(--color_mod_store);
}
div[class="c_rec_mod_stock_container_modify_mf"] .shell_icon, 
div[data-mod="c_rec_mod_stock_container_modify_mf"] .shell_icon
div[data-mod="c_rec_mod_mf_list"] .shell_icon
{
	background-image: url('../icon/c_rec_scp_store_manufacture.svg');
	background-color: var(--color_mod_manufacture);
}
.c_rec_stock_mrp .shell_icon
{
	background-image: url('../icon/c_rec_stock_mrp.svg');
	background-color: var(--color_mod_manufacture);
}

div[class*="c_rec_mod_cart"] .shell_icon
{
	background-image: url('../icon/c_rec_cart.svg');
	background-color: var(--color_mod_store);
}


div[class*="c_rec_mod_stock_list_physical"] .shell_icon
{
	background-image: url('../icon/c_rec_scp_store.svg');
	background-color: var(--color_mod_store);
}

div[class*="c_rec_mod_stock_receipt"] .shell_icon
{
	background-image: url('../icon/c_rec_mod_stock_receipt.svg');
	background-color: var(--color_mod_store);
}

div[class*="c_rec_mod_stock_transfer_physical"] .shell_icon
{
	background-image: url('../icon/c_rec_mod_stock_transfer.svg');
	background-color: var(--color_mod_store);
}

div[class*="c_rec_mod_stock_release"] .shell_icon,
.c_rec_cart_release .shell_icon
{
	background-image: url('../icon/c_rec_mod_stock_release.svg');
	background-color: var(--color_mod_store);
}

div[class*="c_rec_mod_stock_return"] .shell_icon,
.c_rec_cart_return .shell_icon
{
	background-image: url('../icon/c_rec_cart_return.svg');
	background-color: var(--color_mod_store);
}


div[class*="c_rec_mod_stock_list_virtual"] .shell_icon
{
	background-image: url('../icon/c_rec_scp_store.svg');
	background-color: var(--color_mod_store_v);
}

div.c_rec_mod_stock_min_modify .shell_icon, div.c_rec_mod_stock_list_min_physical .shell_icon
{
	background-image: url('../icon/c_rec_mod_stock_min_modify.svg');
	background-color: var(--color_mod_store);
}

div.c_rec_mod_stock_list_min_virtual .shell_icon
{
	background-image: url('../icon/c_rec_mod_stock_min_modify.svg');
	background-color: var(--color_mod_store_v);
}

div[class*="allocation"] .shell_icon
{
	background-image: url('../icon/c_rec_mod_stock_allocation.svg');
	background-color: var(--color_mod_store);
}

div[class*="consumption"] .shell_icon
{
	background-image: url('../icon/c_rec_project.svg');
	background-color: var(--color_mod_store);
}

/*############################ COST RECORDS AND MODULES #############################*/
.c_rec_cost .shell_icon, div[class*="c_rec_mod_cost"] .shell_icon
{
	background-image: url('../icon/c_rec_cost.svg');
	background-color: var(--color_main);
}

/*############################ FINANCIAL DOCUMENT RECORDS ###########################*/

.c_rec_bank_account .shell_icon
{
	background-image: url('../icon/c_rec_bank_account.svg');
	background-color: var(--color_mod_invoice);
}

.c_rec_petty_cash_account .shell_icon
{
	background-image: url('../icon/c_rec_petty_cash.svg');
	background-color: var(--color_mod_invoice);
}

.c_rec_inv_inc_normal .shell_icon
{
	background-image: url('../icon/c_rec_item.svg');
	background-color: var(--color_mod_invoice);
}

.c_rec_inv_inc_return .shell_icon
{
	background-image: url('../icon/c_rec_item.svg');
	background-color: var(--color_mod_invoice);
}

.c_rec_inv_iss_normal .shell_icon
{
	background-image: url('../icon/c_rec_item.svg');
	background-color: var(--color_mod_invoice);
}


.c_rec_inv_iss_return .shell_icon
{
	background-image: url('../icon/c_rec_inv_iss_return.svg');
	background-color: var(--color_mod_invoice);
}

.c_rec_fee_request .shell_icon
{
	background-image: url('../icon/c_rec_fee_request.svg');
	background-color: var(--color_main);
}

.c_rec_counter_invoice .shell_icon
{
	background-image: url('../icon/c_rec_counter_invoice.svg');
	background-color: var(--color_mod_invoice);
}

.c_rec_counter_delivery_note .shell_icon
{
	background-image: url('../icon/c_rec_counter_invoice.svg');
	background-color: var(--color_mod_invoice);
}

.c_rec_counter_cash_entry .shell_icon
{
	background-image: url('../icon/c_rec_counter_invoice.svg');
	background-color: var(--color_mod_invoice);
}

.c_rec_counter_fds_correction .shell_icon
{
	background-image: url('../icon/c_rec_counter_invoice.svg');
	background-color: var(--color_mod_invoice);
}


.iui_error div[data-aid="error_icon"]
{
	background-color: #aa0000;
	background-image: url('../icon/iui_error.svg');
	
	/*
	-webkit-animation-name: error_pulse; 
    -webkit-animation-duration: 1s; 
    animation-name: error_pulse;
    animation-duration: 1s;
    animation-iteration-count: infinite;
    */
}

.iui_ok div[data-aid="error_icon"]
{
	/*background-color: #74AE00;*/
}

.iui_err div[data-aid="error_icon"]
{
	background-color: #ff0000;
}

@-webkit-keyframes error_pulse {
 0%   {background-color: aa0000;}
 50%   {background-color: white;}
 100%   {background-color: aa0000;}
}
/* Standard syntax */
@keyframes error_pulse {
 0%   {background-color: aa0000;}
 50%   {background-color: white;}
 100%   {background-color: aa0000;}
}

div[class*="c_rec_inv"]  .shell_icon, div[class*="c_rec_mod_inv"]  .shell_icon
{
	background-color: var(--color_mod_invoice);
	background-image: url('../icon/c_rec_financial_document.svg');

}

div[class="c_rec_mod_invoice_trash"]  .shell_icon
{
	background-image: url('../icon/c_rec_mod_shell_trash.svg');
	background-color: var(--color_main);
}

div[class="c_rec_mod_invoice_delete"]  .shell_icon
{
	background-image: url('../icon/c_rec_mod_shell_delete.svg');
	background-color: var(--color_main);
}

div[class*="c_rec_inv_inc"]  .shell_icon, div[class*="c_rec_mod_inv_inc"]  .shell_icon, div[class*="c_rec_mod_invoice_inc"]  .shell_icon
{
	background-color: var(--color_mod_invoice);
	background-image: url('../icon/c_rec_inv_incoming.svg');

}


div[class*="c_rec_inv_iss"]  .shell_icon, div[class*="inv_iss"]  .shell_icon, div[class*="invoice_iss"]  .shell_icon
{
	background-color: var(--color_mod_invoice);
	background-image: url('../icon/c_rec_inv_issued.svg');

}

div[class*="c_rec_mod_auto_invoice"]  .shell_icon, div[class*="c_rec_auto_invoice"]  .shell_icon
{
	background-color: var(--color_mod_invoice);
	background-image: url('../icon/c_rec_auto_invoice.svg');

}


/*
div[class*="reverse"]  .shell_icon
{
	background-color: var(--color_mod_invoice);
	background-image: url('../icon/c_rec_invoice_storno.svg');
	background-size: 60%;
}

div[class*="return"]  .shell_icon
{
	background-color: var(--color_mod_invoice);
	background-image: url('../icon/c_rec_invoice_return.svg');
	background-size: 80%;
}
*/

div[class*="c_rec_mod_cash"] .shell_icon
{
	background-color: var(--color_mod_invoice);
	background-image: url('../icon/c_rec_mod_cash.svg');
	background-size: 90%;
}

div[class*="c_rec_mod_bank_cash"] .shell_icon
{
	background-color: var(--color_mod_invoice);
	background-image: url('../icon/c_rec_mod_bank_cash.svg');
	background-size: 90%;
}


div[class*="cash_rec_incoming"] .shell_icon
{
	background-color: var(--color_mod_invoice);
	background-image: url('../icon/c_rec_cash_rec_incoming.svg');
	background-size: 90%;
}

div[class*="cash_rec_outgoing"] .shell_icon
{
	background-color: var(--color_mod_invoice);
	background-image: url('../icon/c_rec_cash_rec_outgoing.svg');
	background-size: 90%;
}
div[class*="fin_doc_move"] .shell_icon
{
	background-color: var(--color_mod_invoice);
	background-image: url('../icon/c_rec_fin_doc_move.svg');
	background-size: 80%;
}

div[class*="cash_rec_deposit"] .shell_icon
{
	background-color: var(--color_mod_invoice);
	background-image: url('../icon/c_rec_cash_rec_deposit.svg');
	background-size: 80%;
}

div[class*="cash_rec_withdrawal"] .shell_icon
{
	background-color: var(--color_mod_invoice);
	background-image: url('../icon/c_rec_cash_rec_withdrawal.svg');
	background-size: 80%;
}


div.c_rec_cash_debit .shell_icon
{
	background-color: var(--color_mod_invoice);
	background-image: url('../icon/c_rec_cash_debit.svg');
	background-size: 80%;
}

div.c_rec_cash_credit .shell_icon
{
	background-color: var(--color_mod_invoice);
	background-image: url('../icon/c_rec_cash_credit.svg');
	background-size: 80%;
}

div[class*="c_rec_mod_fin_doc_share"]  .shell_icon
{
	background-color: var(--color_mod_invoice);
	background-image: url('../icon/iui_print.svg');
	background-size: 100%;
}

div[class*="c_rec_mod_sales_share"]  .shell_icon
{
	background-color: var(--color_mod_invoice);
	background-image: url('../icon/iui_print.svg');
	background-size: 100%;
}

div[class*="c_rec_mod_fin_doc_type_select"]  .shell_icon
{
	background-color: var(--color_mod_invoice);
	background-image: url('../icon/c_rec_financial_document.svg');
	background-size: 100%;
}



.c_rec_fin_doc_entry_free .shell_icon
{
	background-image: url('../icon/c_rec_fin_doc_entry_free.svg');
	background-color: var(--color_mod_invoice);
}

.c_rec_fin_doc_entry_item .shell_icon
{
	background-image: url('../icon/c_rec_item_physical.svg');
	background-color: var(--color_mod_invoice);
}

.c_rec_fin_doc_entry_stock .shell_icon
{
	background-image: url('../icon/c_rec_stock.svg');
	background-color: var(--color_mod_invoice);
}

.iui_entry_add_free_button
{
    background-image: url(../icon/c_rec_fin_doc_entry_free.svg);
	background-color: var(--color_bg_window);
}

.iui_entry_add_item_button
{
	background-image: url('../icon/c_rec_item_physical.svg');
	background-color: var(--color_bg_window);
}

.iui_entry_add_stock_button
{
	background-image: url('../icon/c_rec_stock.svg');
	background-color: var(--color_bg_window);
}

.iui_entry_add_invoice
{
	background-image: url('../icon/iui_entry_add_invoice.svg');
	background-color: var(--color_mod_invoice);
}

div[class*="c_rec_mod_delivery"]  .shell_icon
{
	background-image: url('../icon/c_rec_delivery_note.svg');
	background-color: var(--color_mod_invoice);
}

.c_rec_delivery_note_incoming .shell_icon
{
	background-image: url('../icon/c_rec_delivery_note_incoming.svg');
	background-color: var(--color_mod_invoice);
}

.c_rec_delivery_note_return .shell_icon
{
	background-image: url('../icon/c_rec_delivery_note_return.svg');
	background-color: var(--color_mod_invoice);
}

.c_rec_delivery_note_internal .shell_icon
{
	background-image: url('../icon/c_rec_delivery_note_internal.svg');
	background-color: var(--color_mod_invoice);
}

.c_rec_delivery_note_outgoing .shell_icon
{
	background-image: url('../icon/c_rec_delivery_note_outgoing.svg');
	background-color: var(--color_mod_invoice);
}


.c_rec_quote .shell_icon, div[class*="c_rec_mod_quote"] .shell_icon
{
	background-image: url('../icon/c_rec_quote.svg');
	background-size: 80%;
	background-color: var(--color_mod_invoice);
}

.c_rec_customer_order_real .shell_icon
{
	background-image: url('../icon/c_rec_customer_order_real.svg');
	background-color: var(--color_mod_invoice);
}

.c_rec_customer_order_dummy .shell_icon
{
	background-image: url('../icon/c_rec_customer_order_dummy.svg');
	background-size: 80%;
	background-color: var(--color_mod_invoice);
}

.c_rec_current_account .shell_icon, div[class*="c_rec_mod_current_account"] .shell_icon
{
	background-image: url('../icon/c_rec_current_account.svg');
	background-size: 80%;
	background-color: var(--color_mod_invoice);
}

.c_rec_energy_tax_declaration .shell_icon
{
	background-image: url('../icon/c_rec_energy_tax_declaration.svg');
	background-size: 80%;
	background-color: var(--color_mod_invoice);
}

div[class*="c_rec_mod_export"] .shell_icon
{
	background-image: url('../icon/c_rec_mod_export.svg');
	background-size: 80%;
	background-color: var(--color_mod_invoice);
}

/*########################### INVENTORY RECORDS AND MODULES ####################*/
div.c_rec_inventory .shell_icon, div[class*="c_rec_mod_stock_inventory"] .shell_icon, div.c_rec_inventory_entry .shell_icon
{
	background-color: #325c5b;
	background-image: url('../icon/c_rec_inventory.svg');
}




/*########################## CSS STYLES OF HARDCODED TAGS (c_rec_lt_tag_... ) ############x*/

.c_rec_lt_tag_red
{
	background-color: #cc0000;
	color: var(--color_font_inverse);
}

.c_rec_lt_tag_green
{
	background-color: #74AE00;
	color: var(--color_font_inverse);
}

.c_rec_lt_tag_blue
{
	background-color: #4782ed;
	color: var(--color_font_inverse);
}

.c_rec_lt_tag_orange
{
	background-color: #ea9800;
	color: var(--color_font_inverse);
}

.c_rec_lt_tag_yellow
{
	background-color: #ffe10d;
	color: var(--color_font_inverse);
}

.c_rec_lt_tag_brown
{
	background-color: #804000;
	color: var(--color_font_inverse);
}

.c_rec_lt_tag_violet
{
	background-color: #8000ff;
	color: var(--color_font_inverse);
}

.c_rec_lt_tag_gray
{
	background-color: #808080;
	color: var(--color_font_inverse);
}



.iui_button_icon_text
 {
	padding: 10px;
	height: 50px;
 	cursor: pointer;
 	display: inline-block;
 	margin: 5px;
 }


.iui_button_icon_text div[data-aid='icon']
{
	display: inline-block;
	float: left;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 100%;
	width: 30px;
	height: 30px;
	margin-right: 5px;
}
.iui_button_icon_text div[data-aid='text']
{
	display: inline-block;
	float: left;
	height: 30px;
	padding-top: 10px;
}


/*########### ANIMATIONS ################*/
@keyframes fadein {
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-moz-keyframes fadein { /* Firefox */
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-webkit-keyframes fadein { /* Safari and Chrome */
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-o-keyframes fadein { /* Opera */
    from {
        opacity:0;
    }
    to {
        opacity: 1;
    }
}
/*! ################## handshake request status ################*/
.accept_out
{
	
}
.request_out
{
	color: #AAA;
}
.accept_in
{
	
}
.request_in
{
	color: #fb8400;
	font-weight: bold;
}

/*################ A létrehozó űrlap objektum - C_FORM_CREATE css beállításai ##########*/
div[data-aid="form"].iui_form_create
{
	
}

div[data-aid="form"].iui_form_create span.iui_search
{
	text-decoration: underline;
}


div[data-aid="form"].iui_form_create div[data-aid="search"]
{
	padding-top: 5px;
	padding-bottom: 5px;
	
}
div[data-aid="form"].iui_form_create input[type="text"]
{
	border-radius: 3px;
	width: 100%;
	margin: 0px;

}
div[data-aid="form"].iui_form_create div[data-aid="list"]
{
	padding-left: 3px;
}
div[data-aid="form"].iui_form_create div[data-aid="list"] div.form_create_title
{
	font-size: var(--i_font_main_size);
	text-transform: uppercase;
	color: var(--color_font);
	margin-top: 10px;
	margin-bottom: 5px;
}
div[data-aid="form"].iui_form_create div[data-aid="name"]
{
	padding-top: 5px;
	padding-bottom: 5px;
	
}


div[data-aid="form"].iui_form_create div[data-aid="advanced"]
{
	
}

div[data-aid="form"].iui_form_create div[data-aid="list_class"]
{

}

div[data-aid="form"].iui_form_create div[data-aid="list_class"] div.iui_form_create_element 
{
	margin-right: 10px;
	margin-bottom: 10px;
	border-radius: 3px;
}

div[data-aid="form"].iui_form_create div[data-aid="list_class"] div.iui_form_create_element .shell_icon
{

	
}

div[data-aid="form"].iui_form_create div[data-aid="list_class"] div.iui_form_create_element.iui_selected 
{
	box-shadow: 0px 0px 3px 3px #000;
}

div[data-aid="form"].iui_form_create div[data-aid="list_class"] div.iui_form_create_element.selected .iui_form_create_icon,
div[data-aid="form"].iui_form_create div[data-aid="list_class"] div.iui_form_create_element:hover .iui_form_create_icon
{
	box-shadow: 0px 0px 3px 3px #000;
}

div[data-aid="form"].iui_form_create div[data-aid="list_class"] div.iui_form_create_element div.iui_form_create_icon
{
	width: 100px;
	height: 100px;	
	border-radius: 3px;
	background-size: 50px 50px;
	background-position: bottom 5px right 5px;
	padding: 2px;
	font-size: calc(var(--i_font_main_size) - 3px);
	text-transform: uppercase;
	color: var(--color_font_inverse);

	
}

div[data-aid="form"].iui_form_create div[data-aid="list_template"] div[data-aid="s_shell_name"]
{
	width: 80%;
}
div[data-aid="form"].iui_form_create div[data-aid="list_template"] div[data-aid="c_rec_data"]
{
	width: 15%;
}

/* Munka kio felület */
.iui_kio_data_label
{
    font-size: calc(var(--i_font_main_size) - 3px);
    padding: 2px;
    padding-left: 4px;
    padding-right: 4px;
    border-radius: 3px;
    margin-right: 2px;
}

[data-mod='c_rec_mod_mct_work_kio'] [data-aid='w_content']  div.iui_content_tr div.iui_kio_row div.iui_kio_row_element>div[data-aid="kio_element_data"]
{
    background-color: var(--color_bg_work);
}

[data-mod='c_rec_mod_mct_work_kio'] [data-aid='w_content']  div.iui_content_tr div.iui_kio_row div.iui_kio_row_element>div[data-aid="kio_element_data"]>div:nth-child(1) .iui_kio_data_label
{
	color: white;
    background-color: #fb8400;
}

[data-mod='c_rec_mod_mct_work_kio'] [data-aid='w_content']  div.iui_content_tr div.iui_kio_row div.iui_kio_row_element>div[data-aid="kio_element_data"]>div:nth-child(2) .iui_kio_data_label
{
	color: white;
    background-color: var(--color_mod_org);
}

[data-mod='c_rec_mod_mct_work_kio'] [data-aid='w_content']  div.iui_content_tr div.iui_kio_row div.iui_kio_row_element>div[data-aid="kio_element_data"]>div:nth-child(3) .iui_kio_data_label
{
	color: white;
    background-color: #fb8400;
}

[data-mod='c_rec_mod_mct_work_kio'] [data-aid='w_content']  div.iui_content_tr div.iui_kio_row div.iui_kio_row_element>div[data-aid="kio_element_data"]>div:nth-child(4) .iui_kio_data_label
{
	color: white;
    background-color: var(--color_mod_org);
}


/*[data-aid="table_fin_doc_read_header"] .iui_header_label, [data-aid="table_fin_doc_read_nav_export"] .iui_header_label
{
	font-weight: bold;
    text-align: right;
    text-transform: uppercase;
    font-size: calc(var(--i_font_main_size) - 1px);
    color: var(--color_main);
}

[data-aid="table_fin_doc_sum"] .iui_header_label
{
	font-weight: bold;
    text-align: left;
    text-transform: uppercase;
    font-size: calc(var(--i_font_main_size) - 1px);
    color: var(--color_main);
}

[data-aid="table_fin_doc_entry"] .iui_header_label
{
	font-weight: bold;
    text-align: left;
    text-transform: uppercase;
    font-size: calc(var(--i_font_main_size) - 1px);
    color: var(--color_main);
}*/

/*######################### SCROLLBAR SETTINGS - ONLY FOR WEBKIT #######################*/
/* width */
::-webkit-scrollbar 
{
  width: 5px;
}

/* Track */
::-webkit-scrollbar-track 
{
  background: var(--color_bg_work); 
}
 
/* Handle */
::-webkit-scrollbar-thumb
{
  background: var(--color_main);
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover 
{
  background:  var(--color_main);
}

/*!############################## SUMMARY ELEMENT ###############################*/

div[data-aid='summary_element']
{
	border-bottom: 1px solid var(--color_border);
	margin-bottom: calc( var(--i_size_input_padding_tb) * 2);
	
}

div[data-aid='summary_element']:nth-child(1)
{
	border-bottom: 0px;
}

div[data-aid='summary_element'] [data-aid='summary_titlebar']
{
	height: 20px;
}

div[data-aid='summary_element'] [data-aid='summary_titlebar_icon']
{
	width: 20px;
	height: 20px;
	border-radius: 3px;
	
}
div[data-aid='summary_element'] [data-aid='summary_titlebar_text']
{
	
   	height: 20px;
   	font-size: calc( var(--i_font_main_size) + 1px);
	color: var(--color_font_work);
	padding-left: var(--i_size_input_padding_tb);
}
div[data-aid='summary_element'] [data-aid='summary_titlebar_button']
{


	width: 20px;
	height: 20px;
	background-size: 70%;
	background-repeat: no-repeat;
	background-position: center right;
	background-image: url('../icon/iui_button_contextmenu.svg');
	filter: brightness(60%); /*TODO: később központosítani az összes ikonra!*/	
}

div[data-aid='summary_element'] [data-aid='summary_contentbar']
{
	font-style: italic;
	color: var(--color_font_aux);
	padding-top: var(--i_size_input_padding_tb);
	padding-bottom: var(--i_size_input_padding_tb);
	overflow: hidden;
}
div[data-aid='summary_element'] [data-aid='summary_contentbar'] span
{
	padding-left: 10px;	
}

div[data-aid='summary_element']:hover [data-aid='summary_contentbar']
{
    color: var(--color_font_text);

}

/*################################### TILE DASHBORARD ##################################*/
[data-aid='tile'].iui_tile_dashboard
{
	margin: 2px;
	/*display: inline-block;*/
	cursor: pointer;
	overflow: hidden;
	width: 14vmin;
	height: 14vmin;
	float: right;
	color: var(--color_font_inverse);
	background-size: cover;
	background-position: center center;
	font-size: 1.2vmin;
	border-radius: 0.5vmin;
}


[data-aid='tile'].iui_tile_dashboard [data-aid='icon']
{
	padding: 5px;
	background-size: 5vmin 5vmin;
	background-position: 90% 90%;	
}

[data-aid='tile'].iui_tile_dashboard [data-aid='s_shell_name']
{
	text-transform: uppercase;
	height: 5vmin;
}
 [data-aid='tile'].iui_tile_dashboard [data-aid='tile_content']
{
	display: block;
	height: 3.8vmin;
	overflow: hidden;

}
[data-aid='tile'].iui_tile_dashboard [data-aid='tile_footer']
{
	display: block;
	height: 4vmin;
	display: block;
	
}

/*az alaptól eltérő méretarány osztályok*/
[data-aid='tile'].iui_tile_w2h1
{
	width: 28vmin;
	height: 14vmin;
}

[data-aid='tile'].iui_tile_w2h05
{
	width: 28vmin;
	height: 7vmin;
}
	
[data-aid='tile'].iui_tile_w2h05.iui_tile_dashboard [data-aid='tile_content']
{
	display: block;
	height: 0vmin;
	overflow: hidden;

}

[data-aid='tile'].iui_tile_w2h05.iui_tile_dashboard [data-aid='s_shell_name']
{
	height: 2.48vmin;
}


[data-aid='tile'].iui_tile_dashboard [data-aid='tile_footer'] [data-aid='tile_footer_icon']
{
	height: 6vmin;
	width: 6vmin;
	display: inline-block;
	float: left;
	clear: none;
	background-size: 90% 90%;
	background-repeat: no-repeat;
	background-position: center;
	
	
}
[data-aid='tile'].iui_tile_dashboard [data-aid='tile_footer'] [data-aid='tile_footer_text']
{
	display: inline-block;
	font-size: 4vmin;
	line-height: 4vmin;
	height: 4vmin;
	width: 100%;
	float: left;
	text-align: right;
	clear: none;

}

/* Az általunk definiált linkes modul indítás css kódja */
.iui_hyperlink
{
	color: #0080c0;
	text-decoration-color: #0080c0;
	cursor: pointer;
}

.iui_pic
{
	background-image: url(../icon/c_rec.svg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}


/*################################### TREEVIEW (ÚJ FAJTA) ##################################*/
/*Az egész elemet burkoló div*/
.iui_treeview
{
	display: inline-flex;/*Fontos, hogy inline flex legyen, mert ettől tud működni a 100%-os magasság*/
	flex-direction: column;/*Emiatt függőlegesen működik. */
	height: 100%;
	width: 100%;
}
/*A keresési terület. */
.iui_treeview_search
{
	display: inline-grid;
	grid-template-rows: auto;
	/*grid-template-columns: auto 60px;*/
	grid-template-columns: auto 0px;
	width: 100%;
}

.iui_treeview_search.iui_treeview_search_button_disabled
{
	grid-template-columns: auto;
}

 	
.iui_treeview_search [data-aid="search_input"]
{
	
}
 
.iui_treeview_search [data-aid="search_input"] input
{
 	width: 100%;
}

.iui_treeview_search_result_number
{
	padding: 3px;
	min-height: 24px;
	
	border-bottom: 1px solid var(--color_bg_window);
	color: var(--color_font_aux);
 	text-transform: uppercase;
}

.iui_treeview_search input
{
	background-image: url('../icon/iui_clear_search.svg');
	background-size: 10px 10px;
	background-position: calc(100% - 5px) center;
	background-repeat: no-repeat;
	padding-right: 20px;
	cursor: pointer;
}

input.iui_desktop_search
{
	background-image: url('../icon/iui_clear_search.svg');
	background-size: 10px 10px;
	background-position: calc(100% - 5px) center;
	background-repeat: no-repeat;
	padding-right: 20px;
	cursor: pointer;
}

.iui_treeview_search [data-aid="search_buttons"]
{
	
}

.iui_treeview_search.iui_treeview_search_button_disabled [data-aid="search_buttons"]
{
	display: none;
}

/*A ki-be csukható terület, amin a szekció felirata van*/
.iui_treeview_label
{
	cursor: pointer;
 	padding: 3px;
 	color: var(--color_font_aux);
 	text-transform: uppercase;
	background-size: 11px 11px;
	background-position: calc(100% - 5px) center;
	background-repeat: no-repeat;
	margin-top: 10px;
}
 
.iui_treeview_label.iui_treeview_open
{
	background-image: url('../icon/iui_select_arrow_up.svg');
}

.iui_treeview_label.iui_treeview_close
{
	background-image: url('../icon/iui_select_arrow_down.svg');
}
 	
/*A treeview-t tartalmazó terület. */
.iui_treeview_container
{
	overflow-y: auto;/*Azért kell, hogy ha nagyobb lenne a tartalom a magasságnál, akkor megjelenjen a scrollbar. */
	min-height: 24px;
	background-color: inherit;
}  	

.iui_treeview_container.iui_treeview_close
{
	display: none;
}
   
.iui_tree_element_container
{
	padding-left: 10px;
	margin-top: 2px;
}



.iui_tree_element_toggle.iui_tree_element_toggle_hide
{
	cursor: pointer;
	background-image: url('../icon/iui_treeview_arrow_down.svg');

}

.iui_tree_element_toggle.iui_tree_element_toggle_show
{
	cursor: pointer;
	background-image: url('../icon/iui_treeview_arrow_right.svg');

}

.iui_tree_element_label
{
	cursor: pointer;
}

.iui_tree_element_label.iui_selected_tree_element
{
    color: var(--color_font_select);
    background: var(--color_bg_select);
}

/*resize helper: ezen a stíluson adjuk meg, hogy az átméretezéseknél 
milyen módon jelenjen meg a segéd terület. Pl keret, vagy rányék?*/
.iui_resize_helper
{
	border: 1px solid (--color_main);
	background-color: #000;
	opacity: 0.2;

}

.iui_tooltip.iui_tooltip_nameday div:nth-child(1)
{
	border-bottom: 8px solid #37bf65;
}
.iui_tooltip.iui_tooltip_nameday div:nth-child(3)
{
	border: 1px solid #37bf65;
	color: #37bf65;
}

.iui_inv_incoming_approve .shell_icon
{
	background-image: url('../icon/c_rec_mod_shell_approve.svg');
	background-color: #74AE00;
}

.iui_inv_incoming_reject .shell_icon
{
	background-image: url('../icon/c_rec_mod_shell_delete.svg');
	background-color: #aa0000;
}

/*########### GDPR ELFOGADÁS ###########*/
[data-aid='gdpr']
{
	font-size: 1.2em;

}
[data-aid='gdpr'] a
{
	text-decoration: underline;
}

/*########### ESEMÉYNRE TÖRTÉNŐ VISSZAJELZÉS ###########*/
.meeting_accept .shell_icon
{
	background-image: url('../icon/iui_button_ok.svg');
	background-color: #74AE00;
}
.meeting_tentatively .shell_icon
{
	background-image: url('../icon/iui_button_question_mark.svg');
	background-color: #C66CCA;
}
.meeting_decline .shell_icon
{
	background-image: url('../icon/c_rec_mod_shell_delete.svg');
	background-color: #aa0000;
}

/*####################### ADVANCED FUNKCIÓK ELREJTÉSE ÉS FELFEDÉSE ########################*/
/*There are so called advanced fields in forms. These are hidden by default till the user clicks to show the advanced form elements. */
.iui_advanced
{
	display: none;
}

.iui_advanced_view .iui_advanced
{
	display: unset;
}
.iui_advanced_view tr.iui_advanced
{
	display: table-row;
}

.iui_vc_intersect_delimiter
{
	height: 5px;
	background-color: var(--color_main);
	cursor: initial;
}
/*! A vágólapra másoló piktogram: a magyarázat-piktogram testvére. Minden mérete, térköze és
 * igazítása onnan van átvéve, hogy a két jel a szöveg mellett egy vonalban álljon; csak a
 * bennük lévő ábra más. A változóknak azért van tartalék értéke, mert azokat az űrlapelem
 * doboza deklarálja, a felirat viszont űrlapelem nélkül is használható. */
span[data-aid="copy_icon"].iui_form_copy_icon,
[data-aid="form_field_container"] span[data-aid="copy_icon"].iui_form_copy_icon
{
	width: var(--i_form_element_icon_size, 12px);
	height: var(--i_form_element_icon_size, 12px);
	margin-left: 3px;
	vertical-align: text-bottom;
	top: var(--i_form_element_icon_offset, -6px);
	cursor: pointer;
}

/*! A hátsó lap: jobbra és fölfelé eltolva látszik ki az elülső mögül. A keret és a háttér
 * ugyanaz, mint a magyarázat-piktogram dobozáé — a befoglaló elem viszont keret és háttér
 * nélküli, mert itt a két lap maga a rajz. */
span[data-aid="copy_icon"].iui_form_copy_icon::before
{
	content: "";
	position: absolute;
	right: 0px;
	top: 0px;
	width: 7px;
	height: 8px;
	border: 1px solid var(--color_font_aux);
	border-radius: var(--i_form_element_icon_radius, 3px);
	background-color: var(--color_bg_window);
}

/*! Az elülső lap: balra és lefelé, a hátsót részben takarva. Azért az ::after adja, mert az
 * rajzolódik később, tehát ez kerül fölülre — így látszik a két lap egymáson. */
span[data-aid="copy_icon"].iui_form_copy_icon::after
{
	content: "";
	position: absolute;
	left: 0px;
	bottom: 0px;
	width: 7px;
	height: 8px;
	border: 1px solid var(--color_font_aux);
	border-radius: var(--i_form_element_icon_radius, 3px);
	background-color: var(--color_bg_window);
}

/*! Kattintás közbeni visszajelzés mindkét piktogramon: amíg az egérgomb le van nyomva, a jel
 * a fő színre vált. Tisztán css, nincs mögötte időzítő — a visszajelzés így pontosan addig
 * tart, ameddig a felhasználó műveletet végez. */
span[data-aid="copy_icon"].iui_form_copy_icon:active::before,
span[data-aid="copy_icon"].iui_form_copy_icon:active::after,
span[data-aid="event_icon"].iui_form_event_icon:active,
span[data-aid="event_icon"].iui_form_event_icon:active::after
{
	border-color: var(--color_main);
}
span[data-aid="event_icon"].iui_form_event_icon:active::before
{
	background-color: var(--color_main);
}

/*! A műveletet indító piktogram: a magyarázat-piktogram testvére, ugyanazzal a kerettel,
 * háttérrel, mérettel és igazítással — a benne lévő ábra egy jobb felső sarokba mutató nyíl.
 * A hívó ehhez köti az eseménykezelőt, és nem magához az értékhez: a jogosultság-ellenőrzés a
 * bekötéskor eltávolítja azt az elemet, amire a művelet ül, tehát az értéken ülő művelet
 * tiltásnál magát az adatot is elvinné. Így a tiltás csak a jelet viszi el. */
span[data-aid="event_icon"].iui_form_event_icon,
[data-aid="form_field_container"] span[data-aid="event_icon"].iui_form_event_icon
{
	width: var(--i_form_element_icon_size, 12px);
	height: var(--i_form_element_icon_size, 12px);
	margin-left: 3px;
	vertical-align: text-bottom;
	top: var(--i_form_element_icon_offset, -6px);
	border: 1px solid var(--color_font_aux);
	border-radius: var(--i_form_element_icon_radius, 3px);
	background-color: var(--color_bg_window);
	cursor: pointer;
}

/*! A nyíl szára: átlós vonal a bal alsó saroktól a jobb felső felé. */
span[data-aid="event_icon"].iui_form_event_icon::before
{
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	width: var(--i_form_element_icon_line_width, 2px);
	height: 8px;
	margin-left: calc( var(--i_form_element_icon_line_width, 2px) / -2 );
	margin-top: -4px;
	background-color: var(--color_font_aux);
	transform: rotate( 45deg );
}

/*! A nyíl hegye: a jobb felső sarokba mutató derékszög, a szár végén. A vonala vékonyabb a
 * szárénál, és beljebb ül a doboz sarkától: így elválik a kerettől, és nem olvad vele össze. */
span[data-aid="event_icon"].iui_form_event_icon::after
{
	content: "";
	position: absolute;
	right: 2px;
	top: 2px;
	width: 4px;
	height: 4px;
	border-top: 1px solid var(--color_font_aux);
	border-right: 1px solid var(--color_font_aux);
}

/*! A meta-adatlap azonosság-sávja. A sáv az ablak eszközsávjában ül, tehát a lapok görgetése
 * nem viszi el; alul szaggatott vonal választja el a tartalomtól, mert nem az adatlap része,
 * hanem afölött álló, állandó információ. */
.iui_meta_identity
{
	border-bottom: 1px dashed var(--color_border);
}
/*! Az ikon lekerekítése a listasorokban használt értéket követi, hogy ugyanaz a rekord
 * ugyanúgy nézzen ki a listában és az adatlapján. Keret nem kell: a shell_icon saját
 * háttérszínt és ikont visel, tehát üres állapotban sincs mit jelölni. */
.iui_meta_identity_icon
{
	border-radius: 3px;
}
/*! A rekord neve a sáv elsődleges információja, ezért a törzsszövegnél nagyobb. Ugyanaz a
 * méret, mint a lapok címsoráé — a kettő a két legfontosabb felirat a képernyőn.
 * A típussor mérete szándékosan marad a régi: a névnek kell kiemelkednie, nem a sávnak. */
.iui_meta_identity_name
{
	font-size: calc( var(--i_font_main_size) + 7px );
	font-weight: bold;
}
/*! A típus, a tartalomtípus és az állapot másodlagos: kisebb és halványabb, mint a név. */
.iui_meta_identity_type
{
	font-size: calc( var(--i_font_main_size) - 2px );
	color: var(--color_font_aux);
}
/*! Egy bekapcsolt jelző. Csak az alapértelmezéstől eltérő állapot kap címkét.
 * A címke az attribútum saját css osztályát viseli, ezért a benne álló piktogram képe és a
 * címke háttérszíne is onnan jön — a jel az adatlapon ugyanaz, mint a listákban. */
.iui_meta_badge
{
	font-size: calc( var(--i_font_main_size) - 3px );
	border: 1px solid var(--color_border);
	border-radius: 9px;
	padding: 1px 7px;
	color: var(--color_font_aux);
	white-space: nowrap;
}

/*! A címkében álló piktogram. Kisebb, mint a listasorokban, mert a címke betűje is kisebb.
 * A méretet és a megjelenítési módot itt kell megadni: az alap .iui_att_icon szabály 30 px-es,
 * a display meg a background-repeat pedig csak a listás környezetben (.shell_div) van
 * beállítva. */
.iui_meta_badge .iui_att_icon
{
	display: inline-block;
	width: 14px;
	height: 14px;
	margin-right: 4px;
	vertical-align: text-bottom;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: 12px 12px;
}

/*! A címkék háttérszíne attribútumonként ugyanaz, mint a hozzájuk tartozó piktogramé — így a
 * jel és a címke egybeolvad, és a szín maga is információ. Ahol az attribútumnak nincs saját
 * színe (publikus), ott a címke a semleges alapon marad, és csak a piros piktogram jelöl. */
.iui_meta_badge.secret,
.iui_meta_badge.readonly,
.iui_meta_badge.lock,
.iui_meta_badge.iui_archive,
.iui_meta_badge.content_type
{
	color: var(--color_font_inverse);
	border-color: transparent;
}
.iui_meta_badge.secret
{
	background-color: red;
}
.iui_meta_badge.readonly,
.iui_meta_badge.lock
{
	background-color: orange;
}
.iui_meta_badge.iui_archive
{
	background-color: #555;
}
.iui_meta_badge.content_type
{
	background-color: green;
}
