@import url(fonts/roboto.css);
@import url(fonts/mali.css);
@import url(fonts/fontawesome.css);


html {
	scroll-behavior: smooth;
}
body {
	cursor: default;
	margin: 0px;

	position: relative;

	color: #222222;
	
	overflow-x: hidden;
	overflow-y: scroll;
	background-color: #7eb599;
}
body, table, td, th, div, form, input, textarea, ul, ol, li {
	font-family: 'Roboto',sans-serif;
	font-style: normal;
	font-size: 15px;
	line-height: 18px;
	font-weight: normal;
}
.userText {
	font-family: 'Mali',serif;
	font-style: italic;
	font-size: 14px;
	line-height: 22px;
	font-weight: normal;
}

sub, sup, small {
	font-size: small;
}
a {
	color: #668800;
	text-decoration: none;
	cursor: pointer;
}
a:hover {
	color: #668800;
	text-decoration: none;
}

table td {
	text-align: left;
}

#navigation {
	clear: left;
	width: 214px;
	border-radius: 0 5px 5px 0;
	overflow: hidden;
	float: left;
	position: relative;
	z-index: 1;
	margin-top: 0px;
	-moz-user-select: none;
	-webkit-user-select: none;
	-o-user-select: none;
	-ms-user-select: none;
	user-select: none;
	position: absolute;
}
#navigation .logo,
#navigation .logo:hover,
.logo,
.logo:hover {
	text-align: center;
	color: #000000;
	letter-spacing: 3px;
	padding: 0 10px 3px 4px;
	font-weight: normal;
	background: rgba(255,255,255,0.8);
	background: #7eb599;
	background: rgba(0,0,0,0.6);
	border-radius: 0 5px 0 0;
	position: relative;
	z-index: 1;
}
#navigation .logo:hover,
.logo:hover {
	background: rgba(255,255,255,0.2);
}
#navigation .logo img,
.logo img {
	margin-top: 3px;
}
#navigation .logo:hover,
.logo:hover {
	opacity: 1;
}

.navigation a,
.navigation {
	word-spacing: 0;
	letter-spacing: 1px;
	font-size: 16px;
	line-height: 30px;
}
.navigation a,
#navigation .navigation a {
	display: block;
	padding: 2px 5px;
	color: #FFFFFF;
	background: rgba(0,0,0,0.6);
	border: 0 none;
}
#navigation a.active {
	background: rgba(255,255,255,0.6);
	color: #000000;
}
.navigation a:hover {
	background: rgba(255,255,255,0.2);
}

b, label {
	letter-spacing: 1px;
	color: #000000;
	font-weight: bold;	
}
label {
	display: inline-block;
	width: 120px;
	line-height: 28px;
}
label.sub {
	font-weight: normal;
}
div.boxes a {
	display: block;
	float: left;
	width: 170px;
	text-align: center;
}
h1, h2, h3 {
	margin: 0;
	color: #000000;
	font-weight: normal;
}
h1 {
	font-size: 30px;
	line-height: 30px;

}

h2 {
	font-size: 24px;
	line-height: 30px;
}
h3{
	font-size: 16px;
	line-height: 30px;
}

form {
	margin: 0px;
}



hr {
	height: 1px;
	border: 0px;
	border-top: 2px dotted #7eb599;
	border-top: 2px dotted #7eb599;
	color: #7eb599;
	width: 100%;
}

img {
	border: 0;
}


#langSwitch {
	position: absolute;
	top: -20px;
	right: 0;
}
#langSwitch a,
#langSwitch a:hover {
	color: #FFFFFF;
	text-shadow: 0 0 3px #000000;
}




table.gallery_thumb {
	margin: 32px;
	margin-top: 0px;
	margin-bottom: 14px;
	height: 180px;
	width: 255px;
	cursor: pointer;
	float: left;
}


div.homeSubNav a,
div.homeSubNav {
	text-shadow: 0 0 3px black;
	color: white;
}
div.homeSubNav a:hover {
	border-color: white;
}




div#SAXmlFrame_content {
	position: relative;
	padding: 10px;
	text-align: left;
}
#contentContainer {
	position: relative;
	text-align: left;
	text-align: center;
}
#contentContainer .contentContainer {
	background: rgba(255,255,255,0.8);
	width: 700px;
	min-height: 600px;
	padding: 10px;
	box-sizing: border-box;
	text-align: left;
	border-radius: 5px;
	z-index: 0;
/*
	overflow-x: hidden;
	overflow-y: auto;
*/
}






form, form * {
	line-height: 28px;
}
.input,
input, textarea, select {
	border: 1px solid #CCCCCC;
	border: 1px solid transparent;
	background: rgba(255,255,255,0.5);
	margin: 0;
	padding: 0px 4px;
	color: #000000;
	height: 28px;
	border-radius: 3px;
	box-shadow: 0 0 2px #888;
	vertical-align: top;
}
textarea {
	line-height: 20px;
	resize: both;
	max-width: 100%;
	box-sizing: border-box;
}

input[type=text], input[type=password],
input[type=email], input[type=tel], input[type=number],
input[type=date], input[type=time], input[type=datetime],
input[type=file], textarea, select {
	padding: 0px 5px;
}
.button,
.button:hover,
input[type=button], input[type=submit], input[type=file] {
	display: inline-block;
	line-height: 28px;
	border-radius: 3px;
	color: #000000;
	cursor: pointer;
}
.button,
input[type=button], input[type=submit], input[type=file] {
	padding: 0px 10px 0px 10px;
	background: transparent;
	box-shadow: inset 0 0 3px #000000;
}
.button:hover, .JSAX_select:hover,
input[type=button]:hover, input[type=submit]:hover, input[type=file]:hover {
	background-color: rgba(255,255,255,1);
	background-color: rgba(126,181,153,0.2);
}
input[type=file] {
	padding: 0;
	box-shadow: none;
	width: 1px;
	visibility: hidden;
}
input[type=checkbox], input[type=radio] {
	box-shadow: none;
}
select option {
	background: #FFFFFF;
	color: #000000;
}
select option[selected],
select option:hover {
	background: #EEEEEE;
	color: #333333;
}
select, select option {
	font-family: 'Raleway',sans-serif;
	font-weight: 200;
	font-weight: normal;
}
input:disabled {
	color: gray;
}

input.date,
input[type=date] {
	width: 80px;
}
input.time,
input[type=time] {
	width: 42px;
	padding: 0 0 0 5px
}
input.datetime,
input[type=datetime] {
	width: 120px;
}











ul.table {
	list-style: none;
	padding: 0;
	margin: 0;
	display: table;
	width: 100%;
}
ul.table > li > span,
ul.table > ul > li > span,
ul.table > div > li > span {
	padding: 0 2px 0 2px;
	vertical-align: top;
	display: inline-block;
	box-sizing: border-box;
	overflow: hidden;
	white-space: pre;
	border-left: 1px dashed #7eb599;
}
ul.table > li.title > span {
	font-weight: bold;
	cursor: default;
}
ul.table > li > span.date {
	position: relative;
}
ul.table > li.title:hover {
	background-color: transparent;
}

ul.table > li,
ul.table > ul > li,
ul.table > div > li {
	line-height: 30px;
	border-bottom: 1px dashed #7eb599;
	border-right: 1px dashed #7eb599;
	cursor: pointer;

	display: grid;
	position: relative;

	z-index: 1;

	grid-template-columns: 1fr 1fr 1fr 2fr;
}



ul.table > li:hover {
	background-color: rgba(126,181,153,0.2);
}
ul.table > li.active {
	background-color: rgba( 255, 255, 255,0.5);
	border-bottom-color: transparent;
	background-color: rgba(255,255,255,0.35);
	position: relative;
	z-index: 1;
}
ul.table .detail {
	display: block;
	background-color: rgba( 0, 0, 0, 0.05);
	box-shadow: 0 2px 5px black;
	border-radius: 5px;
	padding: 5px;
	border-bottom: 0;
	margin: 0 -5px 5px -5px;
    padding: 0 5px 5px 5px;
	margin: -37px -5px 5px -5px;
    padding: 37px 5px 5px 5px;
}
ui.table > div > span {
	padding: 0 5px;
	display: inline-block;
	border-right: 1px dashed #7eb599;
	height: 30px;
	vertical-align: top;
	overflow: hidden;
	white-space: nowrap;
}








div.box {
	height: 180px;
	width: 180px;
	background: black url(box.png) no-repeat top left;
	padding: 10px;
}











div#bodyFog h1 {
	color: #222222;
	display: none;
}
div#bodyFog_d {
	position: absolute;
	background: #000000;
	top: 0px;
	left: 0px;
	height: 100%;
	width: 100%;
	z-index: 999;
	color: #222222;
	display: none;
	opacity: 0.2;
}

div#bodyFog {
	position: absolute;
	background: rgba( 0, 0, 0, 0.5);
	top: 0px;
	left: 0px;
	height: 100%;
	width: 100%;
	z-index: 999;
	color: #222222;
	display: none;
}
div#dialogFrame {
	background: #e5f0eb; /* 20% of #7eb599 */
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	margin: 40px auto 40px auto;
	z-index: 1000;
	text-align: left;
	border: 1px solid #CCCCCC;
	box-shadow: 0px 5px 10px #000000;
	width: 800px;
	max-width: calc(100% - 40px);
}


div#dialogFrame .bar {
	padding: 0px;
	padding-left: 2px;
	background: rgba(126, 181, 153, 1);
	border-color: #F0F0F0;
	border-bottom: 1px solid #CCCCCC;
	line-height: 22px;
	font-weight: bold;
}
div#dialogFrame .bar .buttonX {
	float: right;
	border-left: 1px solid #C7C7C7;
	border-bottom: 1px solid #CCCCCC;
	background: #FFFFFF;
	cursor: pointer;
	height: 22px;
}
div#dialogFrame .bar .buttonX i {
	font-size: 18px;
	line-height: 18px;
	margin: 2px 3px;
}
div#dialogFrame .bar .buttonX:hover i {
	color: red;
}
div#dialogFrame .bar #dialogTitle {
	padding-left: 3px;
}
div#dialogFrame .bar #dialogTitle,
div#dialogFrame .bar #dialogTitle * {
	font-size: 14px;
	color: #222222;
}


div#dialogContainer {
	padding: 20px;
	padding: 5px;
	margin-bottom: 20px;
	margin-bottom: 0px;
}







body center#mainCenterAlignment {
}

#pageContainer {
	width: 700px;
	margin: 20px 0;
}

#topBar {
	height: 0px;
	padding: 0;
}

#pageFooter {
	margin-top: -18px;
	color: white;
	clear: left;
	text-shadow: 0 0 3px #000;
}








#smartOptionContainer {
	position: absolute;
	list-style: none;
	padding: 0;
	margin: 0;
	z-index: 1001;
	min-width: 160px;
	background: #EAF0F0;
	box-shadow: 0 3px 3px black;
}
#smartOptionContainer li {
	padding: 0 5px;
	cursor: pointer;
	border-top: 1px solid #FFFFFF;
	line-height: 30px;
}
#smartOptionContainer li.selected {
	background: #DAE0E0;
}




/* message box style */
div.message_box {
	position: absolute;
	top: -20px;
	cursor: default;
}
div.message_box div {
	color: #FFFFFF;
	background-color: rgba(0,0,0,0.5);
	padding: 1px 10px;
	border-bottom: 1px solid white;
}
div.message_box div,
div.message_box div * {
	color: #FFFFFF;
}
div.message_box div.message_success,
div.message_box div.message_success * {
	color: #33CC33;
	border-color: #33CC33;
}
div.message_box div.message_failed,
div.message_box div.message_error,
div.message_box div.message_fatal,
div.message_box div.message_failed *,
div.message_box div.message_error *,
div.message_box div.message_fatal * {
	color: #FF3333;
	border-color: #FF3333;
}





span#serverTime {
	display: none;
}













/* tooltip */
#tooltip {
	position: absolute;
	display: none;

	z-index: 1001;
	cursor: default;
	margin-top: -2px;
	padding-top: 8px;
	text-align: left;
	float: left;
	background: url(tooltip.png) no-repeat top center;
}
#tooltip table td {
    background-color: #FFFFFF;
	font-size: 13px;
	line-height: 18px;
	padding: 5px 10px;
	text-align: center;
	border-radius: 3px;
	box-shadow: 0 3px 3px black;
}
.tooltip,
html body .tooltip,
html body center#mainCenterAlignment .tooltip {
  display: none!important;
}




/* JSAX.form.select */
.JSAX_select {
	cursor: default;
	display: none;
	white-space: nowrap;
	line-height: 28px;
	background: rgba( 255,255,255,0.5);
	border: 1px solid transparent;
	border-radius: 3px;
	position: relative;
	min-width: 28px;
	vertical-align: top;
	-moz-user-select: none;
	-webkit-user-select: none;
	-ms-user-select: none;
	user-select: none;
	box-shadow: 0 0 2px #888;
}

.JSAX_select span.JSAX_select_view {
	padding: 0px 22px 0px 5px;
	background: url(select.gif) right 2px no-repeat;
	overflow: hidden;
	line-height: 16px;
	line-height: 28px;
	min-height: 28px;
}
.JSAX_select span.JSAX_select_viewBin {
	box-sizing: border-box;
	padding: 0 5px;
	display: inline-block;
}
.JSAX_select span.JSAX_select_viewBin img {
	position: absolute;
	right: 6px;
	top: 6px;
}

.JSAX_select ul {
	left: 0;
	display: block;
	padding: 0;
	overflow: auto;
	position: absolute;
	margin: 0px 0px 0px -1px;
	border: 1px solid #CCCCCC;
	border-top: 0;
	list-style: none outside;
	background-color: #FFFFFF;
	z-index: 1001;
}
.JSAX_select ul li {
	line-height: 16px;
	overflow: hidden;
	display: block;
	padding: 0px 3px 1px 3px;
	padding: 2px;
	background: #FFFFFF;
	background-color: #FFFFFF;
	border-top: 1px solid #CCCCCC;
	text-align: left;
	z-index: 1001;
	min-height: 16px;
}
.JSAX_select ul li:hover {
	background-color: #F0F0F0;
}
.JSAX_select ul li.JSAX_select_selected {
	background-color: #CCCCCC;
}






.mono {
	font-family: monospace;
	letter-spacing: -1px;
}



/* dateSelect */
table.dateSelect {
	background: #E0E0E0;
	z-index: 1001;
	border-top: 1px outset #FFFFFF;
	background: #EAF0F0;
	box-shadow: 0 3px 3px black;
	width: 200px;
}
table.dateSelect tr {}
table.dateSelect th,
table.dateSelect td { cursor: default; font-size: 14px; line-height: 25px; text-align: center; color: #777; overflow: hidden; vertical-align: middle; }
table.dateSelect th { font-size: 9px; font-weight: normal; }
table.dateSelect td.dayField:hover { background: #FFFFFF; }
table.dateSelect td.dayField { width: 1em; font-weight: bold; font-family: monospace; font-size: 17px; padding: 0px 1px 0px 1px; }
table.dateSelect td.dayField.wd0 { color: #AA6666; } /* sunday redish */
table.dateSelect td.dayField.wd6 { color: #AA6666; } /* saturday redish */
table.dateSelect td.dayField.inactive,
table.dateSelect td.dayField.inactive:hover { color: #C0C0C0; }
table.dateSelect .current { box-shadow: inset 0 0 10px #888; }
table.dateSelect .active,
table.dateSelect .active:hover { color: #FFFFFF; background: #777; }
table.dateSelect ul { list-style: none; padding: 0; margin: 0; }
table.dateSelect span.dateSelect_select { width: 49%; }
table.dateSelect input,
table.dateSelect span.tib { width: 20%; padding: 2.5%; line-height: 32px; margin: 0; text-align: center; vertical-align: top; display: inline-block; font-weight: bold; box-shadow: none; }
table.dateSelect span.tib:hover { color: #FFFFFF; background: #777; }
table.dateSelect span.g { background: #D0D0D0; }
table.dateSelect span.m { background: #E0E0E0; }
table.dateSelect span.w { background: #FFFFFF; }
table.dateSelect span span { color: black; }






#navigation.navigation_closed {
	cursor: pointer;
	height: 60px;
	width: 60px;
	margin-bottom: -60px;
	border-radius: 0 0 5px 0;
	background: url("icon_40.png") no-repeat center center rgba(0, 0, 0, 0.6);
	margin-top: 0;
}
#navigation.navigation_closed * {
	display: none;
}



body .icon {
	color: transparent;
	height: 36px;
	width: 36px;
	font-size: 36px;
	text-align: center;
	box-shadow: 0 0 3px #000000 inset;
	display: inline-block;
	border-radius: 3px;
	vertical-align: top;
	background-image: url(icons32.png);
	background-position: 2px 2px;
	background-repeat: no-repeat;
	cursor: pointer;
	border: 0 none;
}
.icon:hover {
	background-color: rgba(126, 181, 153, 0.2);
	background-image: url(icons32b.png);
}
body .icon.small {
	transform: scale(0.6);
	margin: -10px;
	vertical-align: text-bottom;
	box-shadow: none;
}
body .fa {
	color: #7eb599;
}
a.fa {
	width: 36px;
	line-height: 36px;
	font-size: 28px;
	padding: 0;
	box-sizing: border-box;
	box-shadow: 0 0 3px #000000 inset;
	display: inline-block;
	border-radius: 3px;
	text-align: center;
	vertical-align: middle;
	cursor: pointer;
	position: relative;
}
a.fa::before {
	line-height: 100%;
}
a.fa:hover {
	color: black;
}
.icon.fa,
.icon.fa:hover {
	background-image: none;
}
.red {
	color: #BB0000;
}
.fa.red {
	color: #DD8070;
}
.green,
.fa.green {
	color: #668800;
}
h1 .fa,
h2 .fa {
	color: inherit;
}


body *.search { background-position: -30px 2px; }
body *.floppy { background-position: -62px 2px; }
body *.pencil { background-position: -96px 2px; }
body *.delete { background-position: -126px 2px; }
body *.shredd { background-position: -158px 2px; }
body *.accept { background-position: -190px 2px; }
body *.human { background-position: -222px 2px; }
body *.ma { background-position: -256px 2px; }
body *.photo { background-position: -286px 2px; }
body *.attachment { background-position: -318px 2px; }
body *.move { background-position: -350px 2px; }
body *.clock { background-position: -384px 2px; }
body *.printer { background-position: -414px 2px; }
body *.hammer { background-position: -447px 2px; }
body *.mail { background-position: -478px 2px; }
body *.calendar { background-position: -510px 2px; }
body *.map { background-position: -541px 2px; }
body *.sheetedit { background-position: -575px 2px; }
body *.checklist { background-position: -607px 2px; }
body *.archive { background-position: -638px 2px; }
body *.gears { background-position: -670px 2px; }

body div#navigation a *.icon {
	box-shadow: none;
	height: 32px;
	width: 32px;
	margin-right: 5px;
	margin-top: -3px;
}
body div#navigation a:hover *.icon {
	background-image: url(icons32b.png);
}

body div#navigation a *.fa {
	line-height: 32px;
	box-shadow: none;
	font-size: 24px;
	height: 32px;
	width: 32px;
	margin-right: 10px;
	text-align: center;
	float: left;
}
body div#navigation a:hover *.fa {
	color: black;
	background-image: none;
}









.dataTable > div {
	line-height: 30px;
	border-bottom: 1px dashed #7eb599;
	cursor: pointer;
}
.dataTable > div:hover {
	background: rgba( 255, 255, 255, 0.5);
}
.dataTable > div:last-of-type {
	border-bottom: 0 none;
}
.dataTable img {
	vertical-align: text-bottom;
}
.dataTable > div > span {
	padding: 0 5px;
	display: inline-block;
	border-right: 1px dashed #7eb599;
	height: 30px;
	width: 120px;
	vertical-align: top;
	overflow: hidden;
}
.dataTable .c {
	font-weight: bold;
	cursor: default;
}
.dataTable > div > span.d {
	width: 76px;
}
.dataTable .detail {
	background: white;
	box-shadow: 0 0 5px gray;
	padding: 0 5px;
	cursor: default;
	border-bottom: 0 none;
	border-radius: 5px;
}

@media handheld, screen and (max-width: 460px) {
	.dataTable > div > span + span + span + span {
		display: none;
	}
}
@media handheld, screen and (max-width: 330px) {
	.dataTable > div > span + span + span {
		display: none;
	}
}















div.contentContainer .gray,
div.contentContainer .gray * {
	color: #B0B0B0;
}
a.XBut {
	background: url(cross.png) no-repeat center center rgba( 255,255,255,0.5);
	border: 1px solid #CCCCCC;
	border-radius: 3px;
	display: inline-block;
	vertical-align: top;
	height: 28px;
	width: 28px;
	margin-top: -1px;
}
div.contentContainer .gray a.XBut {
	background-image: url(cross_gray.png);
}





.fileContainer li {
	list-style: none;
	margin-left: 123px;
	width: calc( 100% - 123px);
	line-height: 20px;
	padding: 5px 0 5px 0;
	border-top: 1px dashed #7eb599;
    display: inline-block;
	white-space: pre;
	margin-bottom: -4px;
	position: relative;
	max-width: 100%;
	box-sizing: border-box;
}
.fileContainer span.entityTitle {
	position: absolute;
	right: 0;
	text-shadow: 0 0 2px white;
}
.fileContainer span.d {
	position: absolute;
	left: 40px;
	top: 3px;
}
.fileContainer li:hover {
	background-color: rgba(126,181,153,0.2);
}
.fileContainer li i {
	height: 30px;
	width: 30px;
	display: inline-block;
	text-align: center;
	vertical-align: middle;
}
.fileContainer li .button i {
	line-height: 30px;
	width: 20px;
}
.fileContainer li img {
	vertical-align: middle;
}
.fileContainer li u.fa,
div#fileViewContainer a.fa {
	text-align: center;
	box-shadow: 0 0 2px black;
	border-radius: 3px;

	font-size: 25px;
	line-height: 30px;
	width: 30px;
}
div#fileViewContainer a.fa {
	font-size: 20px;
	line-height: 23px;
	width: 24px;
}
div#fileViewContainer a.fa {
	position: absolute;
	top: 0;
	right: 24px;
	color: white;
}
div#fileViewContainer a.button {
	position: absolute;
	top: 50px;
	text-shadow: 0 0 3px white;
	background-color: rgba(126,181,153,0.7);
}
div#fileViewContainer a.button:hover {
	background-color: rgba(126,181,153,1);
}

.fileContainer li img.tool {
	position: absolute;
	top: 14px;
	left: 23px;
	cursor: pointer;
	border-radius: 5px;
}
div#fileViewContainer img.tool {
	position: absolute;
	right: 24px;
	top: 0;
	cursor: pointer;
	padding: 4px;
}
div#fileViewContainer img.tool:hover,
.fileContainer li img.tool:hover {
	background: black;
	border-radius: 5px;
}
div#fileCMenu {
}
div#fileCMenu img {
	height: 200px;
	resize: vertical;
	float: right;
	margin-top: -34px;
}
div#fileCMenu img,
#fileViewContainer img,
#fileViewContainer + a img,
.fadeContainer img {
	image-orientation: none;
}
div#fileCMenu u.fa {
	text-decoration: none;
	background: rgba(255,255,255,0.8);
}
div#fileCMenu u.fa-trash,
div#fileViewContainer a.fa-trash {
	color: #DD8070;
}
div#fileCMenu u.fa:hover,
div#fileViewContainer a.fa:hover {
	color: black;
}













.fadeContainer {
	height: 400px;
	width: 100%;
	resize: vertical;
	position: relative;
	box-shadow: 0 0 5px gray;
	border-radius: 5px;
}
.fadeContainer img {
	min-width: 100%;
	min-height: 100%;
	max-width: 100%;
	max-height: 100%;
	z-index: 0;
	animation-duration: 1000ms;
	animation-iteration-count: 1;
	animation-timing-function: ease-in-out;
	animation-name: imFadeNI;
	animation-direction: normal;
	transform-origin: 50% 50%;
	cursor: default;
	transform: scale(1);
	height: auto;
	width: auto;
	object-fit: contain;
}
.fadeContainer div.po img {
	animation-name: imFadePO;
}
.fadeContainer div.pi img {
	animation-name: imFadePI;
}
.fadeContainer div.no img {
	animation-name: imFadeNO;
}
.fadeContainer img.v {
	height: auto;
	width: 290px;
	left: 0px;
	top: -145px;
}
@keyframes imFadeNI {
	0% { opacity: 0; }
	100% { opacity: 1; }
}
@keyframes imFadePO {
	0% {
		opacity: 1;
		transform-origin: 50% 50%;
		transform: scale(1);
	}
	100% {
		opacity: 0;
		transform-origin: 50% 50%;
		transform: scale(2);
		display: none;
	}
}
@keyframes imFadePI {
	0% {
		opacity: 0;
		transform-origin: 50% 50%;
		transform: scale(2);
	}
	80% {
		opacity: 1;
	}
	100% {
		transform-origin: 50% 50%;
		transform: scale(1);
	}
}
@keyframes imFadeNO {
	0% { opacity: 1; }
	50% { opacity: 1; }
	100% { opacity: 0; }
}
@keyframes imText {
	0% {
		bottom: -40px;
	}
	100% {
		bottom: 0;
	}
}
@keyframes imPBar {
	0% {
		opacity: 0.5;
	}
	100% {
		opacity: 0;
	}
}
.fadeContainer > div {
	height: 100%;
	width: 100%;
    text-align: center;
	top: 0px;
}
.fadeContainer div.controls * {
}
.fadeContainer div.controls {
	position: absolute;
	top: 0;
	z-index: 1;
	height: auto;
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
}
.fadeContainer div.controls div.pBar {
	position: absolute;
	top: 0px;
	height: 35px;
	line-height: 32px;
	width: calc(100% - 80px);
	left: 40px;
	text-align: center;
	opacity: 0.33;
	overflow: hidden;
	
	animation-duration: 3000ms;
	animation-iteration-count: infinite;
	animation-timing-function: ease-in-out;
	animation-name: imPBar;
	animation-direction: alternate;
}
.fadeContainer:fullscreen div.controls:hover div.pBar,
.fadeContainer div.controls:hover div.pBar {
	opacity: 1;
	animation-name: none;
	overflow: visible;
	height: fit-content;
}
.fadeContainer div.controls div.pBar img {
	max-width: 30px;
	max-height: 30px;
	min-width: 15px;
	min-height: 15px;
	line-height: 32px;
	border-radius: 2px;
	cursor: pointer;
	animation: none;
	margin: 1px;
	box-shadow: 0 0 3px black;
	border: 1px solid black;
	vertical-align: middle;
}
.fadeContainer div.controls div.pBar img.active {
	box-shadow: 0 0 3px #AAF;
	border: 1px solid #AAF;
}
.fadeContainer span.fa {
	position: absolute;
	background: #FFFFFF;
	opacity: 0.3;
	font-weight: bold;
	text-align: center;
	cursor: pointer;
	width: 30px;
	height: 30px;
	line-height: 30px;
	border-radius: 3px;
	font-size: 25px;
	z-index: 2;
}
.fadeContainer span.fa-arrow-circle-left {
	left: 0px;
}
.fadeContainer span.fa-arrow-circle-right {
	right: 0px;
}
.fadeContainer span.fa:hover {
	opacity: 0.8;
}
.fadeContainer div .bar {
	padding: 10px;
	display: block;
	position: absolute;
	left : 0;
	bottom: 0;
	height: auto;
	background: #FFFFFF;
	opacity: 0.6;
	white-space: pre;
	
	animation-duration: 1000ms;
	animation-iteration-count: 1;
	animation-timing-function: ease-in-out;
	animation-name: imText;
	animation-direction: normal;
}
.fadeContainer div .bar:hover {
	opacity: 0.8;
}
.fadeContainer:fullscreen  div.controls div.pBar {
	height: 65px;
	line-height: 62px;
}
.fadeContainer:fullscreen div.controls div.pBar img {
	max-width: 80px;
	max-height: 60px;
}
.fadeContainer:fullscreen span.fa {
	font-size: 40px;
	height: 50px;
	line-height: 50px;
	width: 50px;
}
.fadeContainer span.fa-expand,
.fadeContainer span.fa-compress {
	bottom: 0px;
	right: 0px;
	text-align: center;
}
.fadeContainer span.fa-compress {
	display: block;
	right: 1.3em;
}
.fadeContainer.cover img {
	object-fit: cover;
}


























span.adet {
	display: block;
	white-space: pre-line;
	margin-left: 123px;
	font-family: serif;
	text-shadow: none !important;
	color: inherit !important;
}


.userText {
	white-space: pre-wrap;
	background: rgba(255,255,255,0.2);
	padding: 10px;
	display: block;
}
.userText:empty {
	display: none;
}
.icon.right {
	float: right;
}
.icon.right {
	margin-right: 40%;
}
.icon.right + .icon.right {
	margin-right: 3px;
}




#forceReload {
	display: none;
}

#navigation .more {
	display: none;
}
/* screen optimisation */
@media handheld, screen and (max-width: 1180px) {
	body center#mainCenterAlignment {
		float: left;
		margin-left: 20px;
	}
	div#navigation {
		position: relative;
		margin-top: 20px;
	}

}
@media handheld, screen and (max-width: 950px) {
	#forceReload {
		display: block;
	}
	div#pageContainer {
		left: 0px;
		margin: 20px 0;
	}
	div#pageContainer,
	div#contentContainer,
	div#contentContainer div.contentContainer {
		position: relative;
		width: 100%;
		border-radius: 0;
	}
	div#contentContainer div.contentContainer {
		float: left;
		min-height: 400px;
	}
	body center#mainCenterAlignment {
		clear: left;
		width: 100%;
		margin-left: 0;
	}
	h1#contentTitle	{
		display: none;
	}
	div#navigation {
		margin-top: 0;
	}
	div#navigation a {
		line-height: 50px;
		font-size: 20px;
		padding: 2px calc(50% - 150px);
	}
	body div#navigation a *.icon,
	body div#navigation a *.fa {
		float: left;
		margin-top: 6px;
		margin-right: -32px;
	}
	body div#navigation a *.fa {
		margin-top: 10px;
	}
	
/*
body #navigation.navigation {
	cursor: pointer;
	height: 60px;
	width: 60px;
	margin-bottom: -60px;
	border-radius: 0 0 5px 0;
	background: url("icon_40.png") no-repeat center center rgba(0, 0, 0, 0.6);
	margin-top: 0;
}
body #navigation.navigation a,
body #navigation.navigation div {
	display: none;
}
body #navigation.navigation_open a,
body #navigation.navigation_open div {
	display: block;
}
*/
	div#navigation,
	a.logo,
	a.logo:hover {
		border-radius: 0;
		width: 100%;
		text-align: center;
	}
	a.logo,
	a.logo:hover {
		padding: 10px 0;
	}
	a.logo img {
	}
	a.logo,
	a.logo:hover {
		text-align: right;
	}
	table.dateSelect {
		left: 0px!important;
		width: 100%;
	}
	table.dateSelect {
		line-height: 40px;
	}
	table.dateSelect td,
	table.dateSelect span.dateSelect_select {
		font-size: 20px;
	}
	table.dateSelect span.dateSelect_select {
		display: block;
		float: left;
	}
	table.dateSelect td {
		line-height: 34px;
	}
	
	
	div#fileUpload label {
		display: block;
	}
	.fileContainer li,
	span.adet {
		margin-left: 0;
		width: 100%;
	}
	#navigation .subnav {
		display: none;
	}
	#navigation.navigation .more {
		display: block;
	}
}



#overlayContainer > .container > .dialog, .dropdownToolbarButton > select > option, #toolbarContainer, .findbar, .secondaryToolbar, #toolbarSidebar {
	background-color: #354;
}