/*
div.forms_elements_from {
	float: left;
	width: 10%;
}

div.forms_elements_edit {
	border: 1px solid;
	float: right;
	width: 0%;
	height: auto;
}

div.forms_elements_to {
	border: 1px solid;
	float: left;
	width: 90%;
	height: auto;
}
*/

:rootX {
	--background:rgba(245, 245, 245, 0.76);
	--backgroundOutLine:#eaeaea;
	--formdetailbg:rgba(97, 49, 78, 0.81);
	--red: #ED1C24;
    --blue: #0E4A8F;
    --purple: #7E3F65;
    --purpleitembg: rgba(126,63,101,0.7);
	--darkpurple:#5e2f4b;
    --basictext: #000;
    --bluefade: #61618D;
    --textcolor: #d4cbd1;
	--boxshadow:0 5px 37px -26px var(--purple);
	--maxBoxHeight:250px;
}

div.forms_display_element_row {
	display: block;
	width: auto;
	height: auto;
}

div.forms_display_element_row div.forms_display_element_column {
	/*border: 1px solid yellow;*/
	min-height: 40px;
	position: relative;
	display: block;
	text-align: center;
	float: left;
	padding: 10px;
}

div.forms_display_element_row div.forms_display_element_column.w100 {
	width: 100%;
}

div.forms_display_element_row div.forms_display_element_column.w50 {
	width: 50%;
}

div.forms_display_element_row div.forms_display_element_column.w25 {
	width: 25%;
}

div.forms_display_element_row div.forms_display_element_column.w1 {
	width: 100%;
}

div.forms_display_element_row div.forms_display_element_column.w2 {
	width: 50%;
}
div.forms_display_element_row div.forms_display_element_column.w3 {
	width: 33.33%;
}
div.forms_display_element_row div.forms_display_element_column.w4 {
	width: 25%;
}
/*
a.linkDivideRow { margin: 0px auto; }

div.li_draggable_from {cursor: move;}
div.li_draggable_to {float: left; margin-right: 5px;}
*/


/* formular */
form.fUni {width: 100%; /*max-width: 440px; */ padding: 0px 0 10px; margin: 0 auto;}
form.fUni label.label {width: 100px; /*max-width: 440px; */ /padding: 0px 10px 10px 0px; margin: 0 auto; /float: left;}
form.fUni input.text, form.fUni textarea, form.fUni select {border: 1px solid #e1e1e1; width: 100%; background-color: #e1e1e1; padding: 10px 4px 10px 16px; height: auto;padding:0.5em 1em;font-size:0.9em; border-radius: 4px; /float: left;}
.user-login-body .inputObal input.text {
	background:var(--textcolor);	
	color:var(--purple);
	font-weight:bold;
	border-radius: 0 0 5px 5px;
}
.user-login-body .inputyObal label {
	color:var(--formdetailbg);
	padding:0.2em 1em;
	text-transform:uppercase;
	font-size:0.8em;
	font-weight:bold;
	background:var(--textcolor);
	width: auto;
    display: block;
	min-width:fit-content;
	border-radius:3px 3px 0 0;
	border-bottom:1px solid var(--purpleitembg);
}
.user-login-body .tlObal a.tlacitko {width:100%;margin:0em auto 1em;}
.user-login-body .inputObal {margin-bottom:1em;}
.user-login-body .inputObal:last-of-type {margin-bottom:0.5em;}
/* registration */ 
.user-registration-body form.fUni label.label {width:100%;display:block;}

form.fUni input.text::placeholder {color:white;font-size:0.9em;}
form.fUni textarea {height: 130px; overflow: auto; vertical-align: top;}
form.fUni select {padding: 9px 4px 9px 12px;}
input.text:focus, textarea:focus, select:focus {border: 1px solid #ffb696!important; transition: all 0.25s ease-in-out!important; -webkit-transition: all 0.25s ease-in-out!important; -moz-transition: all 0.25s ease-in-out!important;}
form.fUni table {width: 100%;}
form.fUni table tr td {padding: 8px 0 8px 0;}
form.fUni table tr td span {display: inline-block; padding: 0 0 6px 11px;}
form.fUni table tr td.right {padding-bottom: 0;}
form.fUni td.tdTlacitko {text-align: center; text-transform: uppercase;}
form.fUni table td .povinneUdaje {background: url(../images/req.gif) no-repeat left 11px; padding: 0 0 0 18px!important; font-size: .9em;}
input.req, textarea.req	{/background: url('../images/req.gif') no-repeat right 2px;}

::-webkit-input-placeholder {color: #4b4b4b; opacity: 1!important; }
:-moz-placeholder {color: #4b4b4b; opacity: 1!important;}
::-moz-placeholder {color: #4b4b4b; opacity: 1!important;}
:-ms-input-placeholder {color: #4b4b4b; opacity: 1!important;}

.ok, .chyba {font-size:0.9em;border-radius:7px;margin: 0 0 10px 0px; padding: .5em .7em 0.5em 40px !important; width: fit-content; background-repeat: no-repeat; background-position: 15px center; text-align: left!important;}
.ok {border: 1px solid #abeaab;color:green; background-color: var(--background); background-image:url('../images/ok.png');    box-shadow: 0 4px 17px -9px green;}
.chyba {display:block;border:1px solid red;color: red; background-color: #FEEFB3; background-image: url('../images/chyba.png');box-shadow:0 4px 17px -9px red;}

div.forms_display_element_row:after { 
    content: " "; 
    display: block;
    clear: both;
} 

.formElementsFront {
    display: flex;
}
.formFrontFilterItem {margin-bottom:20px;}

div.formElementsFront div.formFrontFilter { width: 20%;min-width:250px;}
div.formElementsFront div.formFrontMain {width:100%;padding:0 1.5vw;margin:0 auto;}

div.formElementsFront div.formFrontFilter {
	/background-color: var(--background);
    /border-radius: 13px 13px 0 0;
    overflow: hidden;
    /border: 1px solid var(--backgroundOutLine);
}
div.formFrontFilterItem label.filter_label {
    width: 100%;
    display: block;
    color: #4e4e5b;
    background: transparent;
    padding: 6px 6px 6px 20px;
    margin-bottom: 8px;
	font-size:16px;
	text-transform:uppercase;
	font-weight:bold;
	font-size:0.9em;
	}
div#mainDataItems {clear: both; float: left;}


body:not(.module-repository):not(.module-type-task) .produktListDetail {display:inline-block; height: 210px; width:200px; padding: 10px 10px 10px 10px; text-align: left;}
.produktListDetail:hover img.produktImg {width:280px;}
.produktImg {
	position:absolute;
	top:0;
	right:0;
	left:0;
	bottom:0;
	width:100%;
	height: 100%;
	object-fit:cover;
	/object-fit:contain;
	}

.module-repository .produktImg {object-fit:contain; padding:10px;background:white;}
.module-organization-registry .produktImg {object-fit:contain; padding:10px;background:white;}
.module-business-marketplace .produktImg {object-fit:contain; padding:10px;background:white;}

.produktListDetail a.img {display: block;
    text-align: center;
    text-decoration: none;
    width: 100%;}

.produktListDetail a.tlDetail, .produktListDetail a.tlEdit, .produktListDetail a.tlDelete, .produktListDetail a.tlCopy {text-align: left; margin: 5px 0; color: #2998c7; text-decoration: underline;}
.produktListDetail a.tlDetail:hover, .produktListDetail a.tlEdit:hover, .produktListDetail a.tlDelete:hover, .produktListDetail a.tlCopy:hover { text-decoration: none;}

.produktListDetail a.tlDetail, .produktListDetail a.tlEdit, .produktListDetail a.tlDelete, .produktListDetail a.tlCopy {margin-right: 15px;}

.produktListDetail a.tlCopy { right: 0px;}

body:not(.module-repository):not(.module-type-task) div#hlavni {
    display: grid;
    grid-template-columns: repeat( auto-fit, minmax(200px, 1fr) );
    grid-template-rows: repeat( auto-fit, minmax(200px, 1fr) );
    justify-items: center;
    grid-gap: 2vw;
    width: 100%;
    margin: 0 auto;
}

body:not(.module-repository):not(.module-type-task) .produktListDetail{
	position:relative;
	background:var(--purple);
	padding:0px;
	height:200px;
	max-width:270px;
	width:100%;
	box-shadow: 0px 0px 23px -13px var(--purple);
	overflow:hidden;
	cursor:pointer;
	/border-bottom:1px solid var(--darkpurple);
	/border-right:1px solid var(--purple);

	-webkit-transition:all 0.1s ease;
	transition:all 0.1s ease;	
}

body:not(.module-repository) .produktListDetail:hover {
	box-shadow: 0px 0px 13px -2px var(--bluefade);
}

.produktListDetail a.img {
	/background:rgb(255, 255, 255) !important;
	/padding:5px;
	box-shadow: 0 13px 17px -7px rgba(0,0,0,0.1);
}

body:not(.module-repository):not(.module-type-task) .produktListDetail:hover h2 {
	height:100%;
	display:-webkit-box;
	-webkit-box-align: center;
	-webkit-box-pack: center;
}

body:not(.module-repository):not(.module-type-task) .produktListDetail h2 {
	padding:5px;
	color:white;
	display:block;
	font-weight:bold;
	text-align:center;
	font-size:17px;
	text-transform:uppercase;
	background:var(--purpleitembg);
	overflow:hidden;
	position:absolute;
	right:0;
	bottom:0;
	left:0;
	top:0;
	height:27px;
	
	transition:height 0.2s ease;
}
.showAsTable .tlDiv {
	position:relative;
	}
.tlDiv {
	position:absolute;
	bottom:0;
	height:20px;
	width:100%;
	display:flex;
	background:var(--blue);
	}
	
.module-repository .tlDiv {
    position: relative;
    bottom: unset;
    height: 20px;
    width: calc(100% + 20px);
    display: flex;
    background: var(--blue);
    margin: 0 auto;
    transform: translate(-10px, 10px);
}

.produktListDetail a.tlDetail, .produktListDetail a.tlEdit, .produktListDetail a.tlDelete {
	
	margin:0px 10px 10px 10px !important;
	color:var(--textcolor);
	text-align:center;
    font-size: 0.8em;
    font-weight: bold;
	display:block;
	text-decoration:none;
}
.produktListDetail div.tlDiv a.tlDetail, .produktListDetail div.tlDiv a.tlEdit, .produktListDetail div.tlDiv a.tlDelete, .produktListDetail div.tlDiv a.tlCopy {display:inline-block;width:100%}

input.text.filter_element {
    background: white;
    border: 1px solid var(--purple);
    border-radius: 15px;
    color: var(--purple);
	width:90%;
	margin:0.4em auto;
	display:block;
	font-size: 0.8em;
    padding: 0.5em 1em;
	
}

.checkbox_item label {
    margin-left: 10px;
	color:var(--purple);
	font-size:10px;
}

.formFrontFilter input[type=checkbox],
.formFrontFilter input[type=radio] {
    padding: 0;
    width: 20px;
    height: 20px;
	min-width: 17px;
    max-width: 17px;
}


.formFrontFilter .checkbox_item {
    margin: 0 0 3px 0px;
    padding: 3px 3px 3px 20px;
    /border: 1px solid var(--backgroundOutLine);
	display:flex;
}

.elementContainer {
    /box-shadow: 0 -5px 25px -17px black;
	/background:#faf9fa;
	background:#ededed;
}


.elementContainerContent {
	/border-bottom: 1px solid var(--textcolor);
    padding: 14px 10px 10px;
    font-size: 14px;
	text-align: left;
    width: 100%;
    margin: auto;				  
}
.elementContainerContent.elementContainerContent_checkbox_list,
.elementContainerContent.elementContainerContent_checkbox {
	max-height:var(--maxBoxHeight);
	/overflow-Y:scroll;
}

.uvodni .elementContainerContent.elementContainerContent_checkbox_list {
	max-height:unset;
}

.elementContainerContentRequired .mCustomScrollBox {
	height:calc(var(--maxBoxHeight) - 2em);
}

label.elementContainerLabel {
    /background: var(--textcolor);
    color: var(--purpleitembg);
    padding: 3px;
    display: block;
    font-size: 0.9em;
    text-transform: uppercase;
    font-weight: bold;
}

/label.elementContainerLabel {
    background: var(--formdetailbg);
    color: var(--textcolor);
    padding: 3px;
    display: block;
    font-size: 16px;
	text-transform:uppercase;
}

.imageDisplay {
	border-radius:5px;
	object-fit: cover;
    width: 100%;
	overflow:hidden;
}

/* marketplace, value chain input fields */ 
.marketplace-body select,
.organization-registry-body select,
.marketplace-body textarea, 
.organization-registry-body textarea {
	border-radius:5px;
}

.marketplace-body input,
.organization-registry-body input,
.marketplace-body textarea,
.organization-registry-body textarea,
.marketplace-body select, 
.organization-registry-body select {
	width:100%;
	border-color:var(--textcolor);
	color:var(--bluefade);
	border-style:solid;
	border-width:1px;
}

.marketplace-body input[type=checkbox],
.organization-registry-body input[type=checkbox] {
	width:auto;
}
@media all and (max-width: 768px) {
	div#hlavni {grid-column-gap: 10px;}
	body div.formFrontFilter,
	body div.formFrontMain {
		display:block;
		width:100% !important;
		float:none !important; 
		/min-width:unset !important;
	}
	.formFrontFilterItem {
    margin-bottom: 20px;
    display: inline-block;
    width: 100%;
    position: relative;
    vertical-align: top;
    box-sizing: border-box;
    padding: 5px;
    text-align: left;
	}
	
	div.forms_display_element_row div.forms_display_element_column.w3 {
	width:100%;
	}
	
	/* modal */ 
	#form-dialog-content div.forms_display_element_column {
    width: 100%;
	}
}

div.formAdminFilterItemValues {
	max-height: 250px;
	overflow: auto;
}

.marketplace-body .cke,
.organization-registry-body .cke {
	width:100% !important;
}
.vnitrni .elementContainerContent.elementContainerContentRequired {
	padding:0 7px 7px;
}

.vnitrni .elementContainerContentRequired::before {
	content:"* Required field";
	display:block;
	font-size:10px;
	color:red;
	text-align:left;
	font-weight:400;
}
.elementContainerContent span.elementCheckbox:first-child {
	margin:0 auto;
}

.elementContainerContent span.elementCheckbox {
	display:block;
	text-align: left;
    margin: 0.6em auto 0 auto;
    /width: fit-content;
	width:100%;
	padding:3px 10px;
}

.elementContainerContent span.elementCheckbox:nth-child(even) {
	background:whitesmoke;
}

input.text {
    width: 100%;
    border: 1px solid var(--purple);
    border-radius: 10px;
    padding: 5px 15px;
}

.noDisplayFilter {display: none!important;}


/* majacky stavu u TASKu */ 
body.module-type-task div#hlavni {
    display: flex;
    /grid-template-columns: repeat( auto-fit, minmax(200px, 1fr) );
   / grid-template-rows: repeat( auto-fit, minmax(160px, 1fr) );
    justify-items: center;
   / grid-gap: 2vw;
    width: 100%;
    margin: 0 auto;
}
body.module-type-task .produktListDetail {
	position:relative;
	background:#f7f7f7;
	padding:0px;
	border-radius:4px;
	/height:200px;
	max-width:270px;
	width:100%;
	box-shadow: 0px 0px 23px -13px var(--purple);
	cursor:pointer;
	border:1px solid #e4e4e4;
	margin:5px 10px 5px 10px;

	-webkit-transition:all 0.1s ease;
	transition:all 0.1s ease;	
}
body.module-type-task .productListDetailClick {
	/display:flex;
	display:block;
	flex-direction:column;
	width:100%;
	height:100%;
	/padding:10px;
}

body.module-type-task a.tlDetailImg {
	display:block;
	text-align:center;
	width:100%;
}
body.module-type-task .productListDetailClick h2 {
	display:block;
	width:100%;
	text-align:center;
	padding:unset;
	font-size:18px;
	line-height: 1.5;
}
.formItemDetail_state_open {
	font-size:12px;
}
.formItemDetail_date_date,
.formItemDetail_end_date,
.formItemDetailType_date {
	font-size:12px;
	color:var(--purple);
}
.formItemDetail_expected_date:before,
.formItemDetail_start_date:before,
.formItemDetail_end_date:before {
	display:block;
	margin-right:5px;
	
}.formItemDetail_start_date:before {
	content:'Start date:';
}
.formItemDetail_end_date:before {
	content:'End date:';
}
.formItemDetail_expected_date:before {
	content:'Expected date:';
}

body.module-type-task p.formItemDetail_state.formItemDetailType_select_list {
    position: absolute;
    transform: translateY(calc(-100% - 1px));
    padding: 3px 7px;
    font-size: 11px;
    line-height: 1;
    text-transform: uppercase;
    color: white;
	top:0;
}

body.module-type-task .tlDiv {
	transform: translateY(100%);
	border-radius:0 0 4px 4px;
}
body.module-type-task p.formItemDetail_state.formItemDetailType_select_list.formItemDetail_state_open {
    background: #2bcf0a;
}
body.module-type-task p.formItemDetail_state.formItemDetailType_select_list.formItemDetail_state_not-started {
    background: grey;
}
body.module-type-task p.formItemDetail_state.formItemDetailType_select_list.formItemDetail_state_finnished {
    background: black;
}
body.module-type-task p.formItemDetail_state.formItemDetailType_select_list.formItemDetail_state_started {
    background: orange;
}

/* Table view */ 
*:root {
	--tableRowHeight:40px;
	--imageWidth:100px;
}
body:not(.module-repository) .showAsTable div#hlavni {
	grid-template-columns: 1fr;
	grid-template-rows:unset;
	justify-items: left;
	grid-gap: 0.7vw 1.4vw;
	display:grid;
	flex-direction:row;
	flex-wrap:wrap;
	/max-width:550px;
}

body:not(.module-repository):not(.module-type-task) .showAsTable .produktListDetail {
	background:none;
}
body:not(.module-repository) .showAsTable .produktListDetail {
	max-width:100%;
	/height:var(--tableRowHeight);
	position:relative;
	height:unset;
}
body:not(.module-repository) .showAsTable .produktListDetail .productListDetailClick {
	height:inherit;
	/line-height:var(--tableRowHeight);
	display:flex;
	flex-wrap:wrap;
	align-items: center;
}
body:not(.module-repository) .showAsTable .produktListDetail:hover h2,
body:not(.module-repository) .showAsTable .produktListDetail h2 {
	height:inherit;
	backdrop-filter: unset;
	position:relative;
	display:block;
	background:unset;
	color:var(--formlabelbackground);
	/line-height:var(--tableRowHeight);
	padding:0 1vw;
	text-align:left;
	margin:unset;
	font-size:12px;
	flex:0 1 300px;
}
.showAsTable .produktListDetail a.img {
	text-align:left;
	width:var(--imageWidth);
	min-width:var(--imageWidth);
}
.showAsTable .produktListDetail img.produktImg {
	position:relative;
	padding:unset;
	width:var(--imageWidth);
	object-fit:cover;
	/max-height:var(--tableRowHeight);
}
.module-business-marketplace .showAsTable .produktListDetail img.produktImg,
.module-type-organization-registry .showAsTable .produktListDetail img.produktImg {
	padding:6px;
	height:60px;
	object-fit:contain;
}

/* Other fields */ 
body:not(.module-repository) .showAsTable .formItemDetail_training_date,
body:not(.module-repository) .showAsTable .formItemDetail_training_type,
body:not(.module-repository) .showAsTable .formItemDetail_organization_name
 {
	font-size:12px;
	color:var(--formlabelbackground);
	margin-left:0.5vw;
}
body:not(.module-repository) .showAsTable .formItemDetail_training_date,
body:not(.module-repository) .showAsTable .formItemDetail_training_type {
	flex:0 1 150px;
}
body:not(.module-repository) .showAsTable .formItemDetail_organization_name {
	flex:1 1 200px;
}