div.formBack {
	display: none;
	flex-flow: column nowrap;
	justify-content: center;
	align-items: center;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	height: 100%;
	background: rgba(0,0,0,0.75);
	z-index: 10;
	opacity:0;
	transition: opacity 100ms ease-in;
	pointer-events: none;
}

div.formBack:target {
	display: flex;
	opacity:1;
	pointer-events: auto;
}

div.search_form {
	max-width: 960px;
	width: calc(95% - 20px);
}

#btn_closeLogin.formClose {
	display: none;
}

div.formContent {
	flex-flow: column nowrap;
	width: calc(100% - 20px);
	padding: 10px;
	flex-grow: 1;
	flex-shrink: 1;
}
div.formContent div {
	display: flex;
	flex-flow: row nowrap;
	justify-content: flex-start;
	flex-grow: 1;
	flex-shrink: 1;
	padding: 3px 0;
	align-items: center;
}
div.formContent div > label.checkbox{
	margin-top: 12px;
}
div.formContent div.ContextMenu{
	padding: 1px;
}
div.formContent div div {
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
	/*padding: 0;*/
}
div.formContent div label {
	min-width: 120px;
	font-size: 90%;
	text-align: right;
	margin-right: 5px;
	white-space: nowrap;
}
div.formContent div label.fixedWidth {
	width: 120px;	
	white-space: normal;
}
div.formContent > div > div > label {
	min-width: unset;
	margin-right: 0;
	margin-left: 5px;
	flex-grow: 1;
}
div.formContent div input, div.formContent div select, div.formContent div textarea {
	min-width: 10px;
	width: 10%;
	flex-shrink: 1;
	flex-grow: 9;
}
div.formContent div input[type="checkbox"] {
	flex-grow: 0;
	width: unset;
}

div.formContent div.form_btnWrap,
div.formContentSearch  div.form_btnWrap {
	display: flex;
	flex-flow: row nowrap;
	justify-content: space-between;
	flex-shrink: 1;
	flex-grow: 1;
	padding: 20px 10px 0;
}
div.formContent td div.form_btnWrap {
	padding: 0;
}
div.formShort div.formContent div.form_btnWrap {
	padding-left: 5px;
	padding-right: 5px;
}

div.formContent div.divHidden { display: none; }

div.formContent div div.emailDomain {
	font-size: 75%;
	justify-content: flex-end;
}
div#div_files_img div {
	display: unset;
	flex-grow: unset;
}

label.formCol {
	display: inline-block;
	margin-right: 15px;
	padding: 3px 0px;
	width: 20%;
	min-height: 1px;
	text-align: right;
}
label.wide { width: 40%; }
label.remind {
	margin-right: 0px;
	text-align: left;
	width: 28%;
	padding-left: 10px;
}

label.formPub {
	padding: 1px 5px;
	min-width: 60px;
	display: inline-block;
}

input.formCol, select.formCol {
	width: calc(80% - 30px);
	padding: 2px;
	font-size: 1.0em;
	border: 1px solid #CCC;
	border-radius: 2px;
	outline: none;		/* Remove outline applies by navigators when focused */
}
input.short { width: 40px; }

select.formCol { width: calc(80% - 23px); }

input.formDate { width: 100px; }

select.formColPlus {
	width: calc(80% - 65px);
	border: 1px solid #CCC;
	border-radius: 2px;
	outline: none;		/* Remove outline applies by navigators when focused */
}

input[type="checkbox"].formCol { width: auto; }

input.formCol:focus, select.formCol:focus {
	border-color: rgba(82, 168, 236, 0.75);
	box-shadow: 0 0 8px rgba(82, 168, 236, 0.5);
}

input.correct, select.correct {
	border: 1px solid rgba(68, 191, 68, 0.75);
	outline: none;		/* Remove outline applies by navigators when focused */
}

input.correct:focus, select.correct:focus {
	border-color: rgba(68, 191, 68, 0.75);
	box-shadow: 0 0 8px rgba(68, 191, 68, 0.5);
}

input.incorrect, select.incorrect {
	border: 1px solid rgba(191, 68, 68, 0.75);
	outline: none;		/* Remove outline applies by navigators when focused */
}

input.incorrect:focus, select.incorrect:focus {
	border-color: rgba(191, 68, 68, 0.75);
	box-shadow: 0 0 8px rgba(191, 68, 68, 0.5);
}

div.formContent div div.used {
	position: absolute;
	margin: -15px 0px 0px 75px;
	color: red;
	font-size: 75%;
	border: 3px solid;
	border-radius: 10px;
	padding: 4px;
	background: white;
	opacity: 0;
	transition: all 0.3s ease 0s;
	transform-origin: center center;
	transform: scale(0, 0);
	opacity: 0;
}
@media screen and (-webkit-min-device-pixel-ratio:0) and (min-resolution:.001dpcm) {
    div.formContent div div.used {	/* Chrome margin correction */
		margin: 2px 0px 0px 75px;
	}
}
div.formContent div div.usedShow {
	opacity: 0.9;
	transform: scale(1);
	transition: all 0.1s ease 0s;
}
div.formContent div input.used {
	color: rgb(255, 53, 53);
	text-shadow: 0 0 2px rgb(255, 53, 53);
	filter:progid:DXImageTransform.Microsoft.Shadow(color=#999999,direction=135,strength=3);
}

span.formDate {
	display: inline-block;
	width: calc(100% - 22px);
	border: 1px solid;
	margin: 0 5px;
	padding: 1px 5px;
	font-size: 90%;
	text-align: center;
}
span.formUser {
	display: inline-block;
	width: calc(100% - 22px);
	/*min-width: 120px;*/
	border: 1px solid;
	padding: 1px 5px;
	margin: 0 5px;
	font-size: 90%;
	text-align: center;
}

div.divInput {
	overflow: hidden;
	height: 1%;
	padding-bottom: 10px;
}

div.divInputLeft {
	float: left;
	width: 42%;
}

div.divRadio {
	display: inline-block;
	padding-top: 3px;
}
p#p_confirmMsg {
	text-align: center;
	margin-top: 0px;
	margin-bottom: 7px;
	color: #000000;
}
p#p_confirmMsgDelete{
	/*color: #de2834;*/
}

label.labRadioColor {
	display: inline-block;
	cursor: pointer;
	position: relative;
	right: 25px;
}
label.labRadioColor:before {
	content: "";
	display: inline-block;
	width: 18px;
	height: 18px;
	border: 2px solid #aaa;
	border-radius: 7px;
}
label.labRadioRed:before { background-image: linear-gradient(to bottom, #fff, #f00); }
label.labRadioOrange:before { background-image: linear-gradient(to bottom, #fff, #EAAE1D); }
label.labRadioGreen:before { background-image: linear-gradient(to bottom, #fff, #0f0); }
label.left { width: 48%; }

input[type=radio]:checked + label.labRadioColor:before {
	content: "\2022";
	color: #444;
	font-size: 32px;
	line-height: 14px;
}

#div_publish_status {
	overflow: hidden;
	text-align: left;
}
.fldStatus {
	border: 1px dashed gray;
	margin-top: 5px;
	padding: 5px 10px;
	font-size: 80%;
	color: gray;
}
.fldStatus  a {
	margin: 0;
	display: inline;
	font-size: 120%;
}
.fldStatus  a.left{ float: right; }
.fldStatus  p {
	margin: 0;
	padding: 0;
	font-size: 120%;
	color: black;
}

#table_publish  {
	width: 100%
}
#table_publish th {
	font-size: 95%;
	font-weight: normal;
	text-align: center;
}

div#div_formState { flex-flow: column nowrap; }
div#div_formState label {
	min-width: unset;
	text-align: left;
}
input#input_date {
	width: calc(30% - 24px);
	flex-grow: 1;
	flex-shrink: 1;
}
input#input_remind1, input#input_remind2, input#input_remind3 {
	width: calc(15% - 24px);
	max-width: 40px;
	margin-left: 5px;
	flex-grow: 1;
	flex-shrink: 1;
}

/* SEARCH FORM */
.formContentSearch {
	flex-flow: column nowrap;
	width: 100%;
	flex-grow: 1;
	flex-shrink: 1;
}
.formContentSearch > div {
	display: flex;
	flex-flow: row nowrap;
	justify-content: flex-start;
	align-items: baseline;
	flex-grow: 1;
	flex-shrink: 1;
	padding: 3px 0;
}
.formContentSearch div input[type="text"],
.formContentSearch div select,
.formContentSearch div textarea {
	min-width: 10px;
	width: 10%;
	flex-shrink: 1;
	flex-grow: 9;
	font-size: 95%;
}
.formContentSearch {
	width: 100%;
}
.formContentSearch div:not(.new-line){
	display: inline-block;
	margin-bottom: 0;
}
/*.formContentSearch div.new-line{
	margin-bottom: 10px;
}*/
.formContentSearch div.new-line > label {
	display: inline-block;
	margin-bottom: 0;
	margin-right: 5px;
	width: 170px;
	text-align: right;
	font-size: 90%;
}
.formContentSearch div.new-line > label.checkboxOnly {
	width: auto;
}

/* FORM DESIGN */
div.form {
	display: flex;
	flex-flow: column nowrap;
	justify-content: space-between;
	align-items: flex-start;
	align-content: flex-start;
	background: #fcfcfc;
	border-radius: 3px;
	max-width: 700px;
	width: calc(95% - 20px);
	position: relative;
}
div.formShort { max-width: 450px; }
div.formBig { max-width: 900px; }
div.formFullPage{ max-width: 100%; max-height: 100%;}
div.formTitle {
	justify-content: flex-start;
	width: 100%;
	flex-grow: 1;
	flex-shrink: 1;
	padding: 15px 0 15px 0;
	height: unset;
	border-bottom: 1px solid #E9E9E9;
}
div.formTitle span {
	font-size: 1.3em;
	white-space: nowrap;
	padding: 2px 10px;
	color: #555555;
	font-family: Helvetica, Verdana, Arial, sans-serif;
	font-size: 1.15em;
	font-weight: bold;
}
div.formTitle span.red{
	color: #de2834;
}
div.formTitle span.red i{
	vertical-align: -5px;
	margin-right: 5px;
}
a.formClose {
	color: #aaaaaa;
	position: absolute;
	right: 0;
	top: 0;
	text-align: center;
	text-decoration: none;
	font-weight: bold;
	font-size: 1.6em;
	padding: 8px 17px 9px 17px;
	cursor: pointer;
}
a.formClose:hover { color: #CC2714; background-color: #f7f7f7; border-radius: 0 3px 3px 0; }
.formContentSearch{
	width: calc(100% - 20px);
	padding: 10px;
}
/* END FORM DESIGN */

div.formContent div.xhrError,
.formContentSearch div.xhrError,
.formLib div.xhrError{
	color: #E33636;
	text-align: center;
	justify-content: center;
	background-color: #FFEDED;
	padding: 10px;
	margin: 15px 0 0 0;
	border: 1px solid #F57A7A;
	border-radius: 3px;
	font-size: .9em;
}
div.formContent div.xhrWarning,
.formContentSearch div.xhrWarning,
.formLib div.xhrWarning{
	color: #E0C900;
	text-align: center;
	justify-content: center;
	background-color: #FFFFE1;
	padding: 10px;
	margin: 15px 0 0 0;
	border: 1px solid #EFD934;
	border-radius: 3px;
	font-size: .9em;
	flex-flow: column nowrap;
	max-height: 250px;
	overflow-y: scroll;
	word-break: break-all;
}

/* FORM OEM */
.formLib{
	background: #fcfcfc;
	border-radius: 3px;
	position: absolute;
	overflow: auto;
	top: 10px;
	right: 10px;
	bottom: 10px;
	left: 10px;
	display: flex;
	flex-flow: column nowrap;
	z-index: 999;
}
.formLibTitle{
	flex-shrink: 0;
	border-bottom: 1px solid #E9E9E9;
}
.formLibTitle span{
	padding: 15px 10px;
	display: inline-block;
	color: #555555;
	font-family: Helvetica, Verdana, Arial, sans-serif;
	font-size: 1.15em;
	font-weight: bold;
}
.formLibTitle .formLibClose{
	position: absolute;
	right: 0;
	top: 0;
	text-align: center;
	text-decoration: none;
	font-weight: bold;
	font-size: 1.6em;
	padding: 8px 17px 9px 17px;
	color: #aaaaaa;
}
.formLibTitle .formLibClose:hover{
	color: #CC2714;
	background-color: #f7f7f7;
	border-radius: 0 3px 0 0;
}
.formLibContent{
	padding: 10px;
	border-bottom: 1px solid rgba(0,0,0,0.2); /* #e9e9e9 */
}
.formLibContent div:not(.file_tag){
	display: flex;
	flex-flow: row nowrap;
	justify-content: flex-start;
	flex-grow: 1;
	flex-shrink: 1;
	padding: 3px 0;
	align-items: center;
}
.formLibContent div label{
	min-width: 130px;
	font-size: 90%;
	text-align: right;
	margin-right: 5px;
	white-space: nowrap;
}
.formLibContent div input,
.formLibContent div select,
.formLibContent div textarea{
	min-width: 10px;
	width: 10%;
	flex-shrink: 1;
	flex-grow: 9;
}
.formLibContent div input[type="checkbox"],
.formLibContent div input[type="radio"] {
    flex-grow: 0;
	cursor: pointer;
    width: unset;
	display: none;
}
.libTopBar{
	padding: 10px;
	background-color: #e0e0e0;
}
.formLibContentLibrary{
	flex-grow: 1;
	flex-shrink: 1;
	flex-flow: column nowrap;
	overflow: auto;
	border-top: 1px solid rgba(0,0,0,0.2); /* #e9e9e9 */
	border-bottom: 1px solid rgba(0,0,0,0.2); /* #e9e9e9 */
	background-color: #e9e9e9;
}
.formLibButtons{
	padding: 10px;
	flex-shrink: 0;
	display: flex;
	flex-flow: row nowrap;
	justify-content: space-between;
	border-top: 1px solid #e9e9e9;
}
.formBackLib {
	display: none;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background: rgba(0,0,0,0.75);
	z-index: 10;
	opacity:0;
	transition: opacity 100ms ease-in;
	pointer-events: none;
}
.formBackLib:target {
	display: flex;
	opacity: 1;
	pointer-events: auto;
}
/* END FORM OEM */

div.formContent div span#u_departments input[type="checkbox"] + label,
div.formContent div span#d_departments input[type="checkbox"] + label,
div.formContent div span#d_languages input[type="checkbox"] + label,
div.formContent div span#ld_languages input[type="checkbox"] + label {
    margin-left: 25px;
    margin-top: 5px;
    position: relative;
	display: inline-block;
}

div.formContent div span#u_departments input[type="checkbox"] + label::before,
div.formContent div span#d_departments input[type="checkbox"] + label::before,
div.formContent div span#d_languages input[type="checkbox"] + label::before,
div.formContent div span#ld_languages input[type="checkbox"] + label::before {
    left: -25px;
    bottom: 0;
	content: '\00a0';
}

div.formContent div span#u_departments input[type="checkbox"] + label::after,
div.formContent div span#d_departments input[type="checkbox"] + label::after,
div.formContent div span#d_languages input[type="checkbox"] + label::after,
div.formContent div span#ld_languages input[type="checkbox"] + label::after {
    left: -25px;
    bottom: 5px;
	white-space: nowrap;
	content: '\00a0';
}

#d_languages,
#ld_languages {
    padding: 5px 0;
}

#u_departments,
#d_departments {
	padding: 5px;
	border: 1px solid transparent;
	word-break: break-all;
}
#u_departments.incorrect,
#d_departments.incorrect {
	border: 1px solid rgba(191, 68, 68, 0.75);
}
#u_departments.correct,
#d_departments.correct {
	border: 1px solid rgba(68, 191, 68, 0.75);
}