/*
 * Licensed to the Apache Software Foundation (ASF) under one
 * or more contributor license agreements.  See the NOTICE file
 * distributed with this work for additional information
 * regarding copyright ownership.  The ASF licenses this file
 * to you under the Apache License, Version 2.0 (the
 * "License"); you may not use this file except in compliance
 * with the License.  You may obtain a copy of the License at
 *
 * http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing,
 * software distributed under the License is distributed on an
 * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
 * KIND, either express or implied.  See the License for the
 * specific language governing permissions and limitations
 * under the License.
 */

/* ----------------------------------------------------- */
/* This CSS file is used for the Flat Grey visual theme. */
/* ----------------------------------------------------- */

/* This theme uses a scalable, floating layout - so most
   sizes are expressed in EMs. PX sizes are used only for
   drop shadows and positioning around graphic images. */

/* -------------------------------------- */
/*      Resets/Browser Normalization      */
/* -------------------------------------- */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p,
	blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn,
	em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup,
	tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label,
	legend, table, caption, tbody, tfoot, thead, tr, th, td {
	border: 0;
	margin: 0;
	outline: 0;
	padding: 0;
	font-size: 100%;
	background: transparent;
	vertical-align: baseline;
}

blockquote, body, div, dl, dt, dd, fieldset, form, h1, h2, h3, h4, h5,
	h6, img, input, li, ol, p, select, span, td, textarea, th, ul {
	border-style: none;
	margin: 0;
	padding: 0;
}

a, address, body, caption, cite, code, dfn, em, strong, th, var {
	font-style: normal;
	font-weight: normal;
	text-decoration: none;
}

body, caption, th {
	text-align: left;
}

ol, ul {
	list-style: none;
}

ol.numbers {
	list-style: decimal;
	padding-left: 20px;
}

ul.dots {
	list-style: circle;
	padding-left: 20px;
}

/* ------------------------------ */
/*      Basic Element Styles      */
/* ------------------------------ */
a, a:visited {
	color: #212529;
	font-weight: bold;
}

a:hover, a:active {
	text-decoration: underline;
}

.disabled {
	color: #333366;
	text-decoration: none;
}

body, textarea, input, select {
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

body {
	font-size: 12px;
	position: relative;
	color: #212529;
	min-width: 780px;
	margin: 0;
}

hr {
	background-color: #ccc;
	color: #ccc;
	border-bottom: #fafafa 0.1em solid;
	border-right: #fafafa 0.2em solid;
	border-left: #d9d9d9 0.2em solid;
	border-top: #d9d9d9 0.1em solid;
	margin: 0.5em 0 0.5em 0;
}

h1, .h1 {
	font-size: 1.6em;
	font-weight: bold;
}

h2, .h2 {
	font-size: 1.3em;
	font-weight: bold;
}

h3, .h3 {
	font-size: 1.1em;
	font-weight: bold;
}

/* IE7 fix */
table {
	font-size: 1em;
}

/* IE7 fix */
table input {
	border: #999999 solid 0.1em;
}

textarea {
	background-color: #ffffff;
	border: #999999 solid 0.1em;
	font-size: 1.1em;
}

th, th a {
	color: #212529;
	font-weight: bold;
}

/* -------------------------- */
/*     Float Clear/Reset      */
/* -------------------------- */
.clear {
	clear: both;
	height: 0;
	visibility: hidden;
}

.no-clear .clear {
	/* Used in container elements to override
 the clear class in contained elements. */
	clear: none;
}

/* ------------------------------- */
/*      Single Element Styles      */
/* ------------------------------- */
.alert {
	/* Used for alert text */
	color: #ff0000;
}

.content-messages p {
	margin: 0.5em 0 0.5em 0;
}

.hidden {
	height: 0;
	visibility: hidden;
}

.label {
	/* Used for <input> element labels */
	font-weight: bold;
	height: 1.2em; /* Same as <input> height */
	padding-right: 1.1em;
	text-align: right;
	white-space: nowrap;
	width: 1%;
	vertical-align: middle;
}

.required, input.required {
	/* required style for <input> elements */
	background-color: #ffffdd;
}

.tooltip {
	color: #008183;
	font-style: italic;
	margin: 0.4em;
}

.visible {
	height: auto;
	visibility: visible;
}

.page-container {
	background: url("../images/big-fade.png") repeat-x 0 90px transparent;
}

.align-float {
	float: right;
}

.align-text {
	text-align: right;
}

.align-top {
	vertical-align: top;
}

.centered {
	text-align: center;
}

.page-title {
	color: #008183;
	margin-bottom: 0.5em;
	font-size: 1.3em;
	font-weight: bold;
}

.contentarea {
	margin-top: 35px;
	margin-left: 190px;
	padding: 6px 9px;
	min-height: 600px;
}

/* ------------------------ */
/*      Masthead Style      */
/* ------------------------ */
#masthead {
	background: #008183;
	color: #fff;
	font-size: 1em;
	font-weight: normal;
	height: 45px; /* Setting must be in px */
	overflow: hidden;
}

#masthead ul li {
	float: left;
	padding: 0.6em 0.6em 0.6em 0;
}

#masthead ul li a {
	color: #fff;
	font-weight: normal;
}

.last-system-msg {
	padding-left: 20px;
    display: block;
    min-width: 10px;
    height: 15px;
    background-image: url(../images/notification.png);
    background-size: 15px;
    background-repeat: no-repeat;
    background-position: 0 0.2em;
}

#masthead ul li div.last-system-msg a{
	color: #F9924B;
}

#masthead ul li a.logout {
	padding-left: 18px;
	background-image: url(../images/logout.png);
    background-size: 15px;
    background-repeat: no-repeat;
}

.preference-area {
	float: right !important;
}

.preference-area .switch-a {
    cursor: pointer;
    display: table-cell;
    background: url(../images/change.png) 0 no-repeat;
    background-size: 100% 100%; 
    height: 20px;
    width: 20px;
}

#masthead ul .logo-area {
	padding: 0.8em 1em;
}

#masthead ul .org-logo-area {
	padding: 0.6em 1em;
}

#masthead ul .org-logo-area img {
	width: auto;
	height: auto;
}

#masthead ul a:focus {
	text-decoration: underline;
}

/* ---------------------- */
/*      Footer Style      */
/* ---------------------- */
#footer {
	clear: both;
	background: #d2d6de;
	border-top: 0.1em inset #d2d6de;
	padding: 0.5em 0 0.5em 0.5em;
}

#footer a {
	color: #444;
	font-weight: normal;
}

#footer ul {
	display: inline
}

#footer ul li {
	display: inline;
	color: #444;
	font-weight: normal;
	padding: 0.5em;
}

#footer ul .first {
	border-left: none;
}

#footer ul .last {
	border-right: none;
}

#footer ul li a {
	color: #444;
	font-weight: normal;
}

#footer p {
	clear: left;
	color: #444;
	font-weight: normal;
	padding: 0.5em;
}

#footer a:focus {
	text-decoration: underline;
}

/* ------------------------------- */
/*      Top Navigation Style      */
/* ------------------------------- */
#top-navigation {
	position: absolute;
	top: 5px;
	left: 150px;
	clear: both;
	color: #fff;
	font-size: 1em;
}
#top-navigation ul li{
    margin-left: 2px;
    margin-right: 2px;
}
.navigation ul li, .navigation ul li.selected{
    background-repeat: no-repeat;
    background-size: 20px;
    background-position: 3px;
}
/* ------------------------------- */
/*      Main Navigation Style      */
/* ------------------------------- */
#main-navigation {
	color: #fff;
	font-size: 1em;
	float: left;
	margin-top: 7px;
	width: 90%;
	height: 2.8em;
	overflow: hidden;
}

#main-navigation ul li {
	float: left;
	margin-left: 3px;
	height: 2.8em;
	line-height: 2.8em;
	padding: 0 0 0 18px;
}

#main-navigation ul .disabled {
	color: #D4D0C8;
}

#main-navigation ul .selected {
	height: 2.9em;
	border-bottom: 1px solid #FFF;
	background-color: #FFF;
}

#main-navigation ul a {
	color: #fff;
	display: block;
	padding: 0 0.6em 0 0.6em;
	font-size: 0.9em;
	font-weight: normal;
	text-transform: uppercase;
	/* Uncomment next line for main-nav drop shadows */
	text-shadow: 0px 1px 1px #22323f;
}

#main-navigation ul li a:hover, #main-navigation ul .selected a {
	color: #F9924B;
	text-decoration: none;
}

#main-navigation ul a:focus {
	text-decoration: underline;
}

#main-navigation ul .selected a {
	text-shadow: none;
}
/* ------------------------------- */
/*      Navigation separator Style      */
/* ------------------------------- */
#navigation-separator{
	float: left;
	border-left: 1px solid #ccc;
    height: 30px;
    padding-left: 10px;
}
#navigation-separator a {
	display: block;
	width: 30px;
    height: 30px;
    background-size: 28px;
    background-position: 0px 2px;
    background-image: url(../images/menu.png);
    background-repeat: no-repeat;
}
#navigation-separator a.selected{
	background-image: url(../images/menu-selected.png);
}

/* ------------------------------- */
/*      second Navigation Style      */
/* ------------------------------- */
#second-navigation {
	display: none;
    color: #fff;
    font-size: 1em;
    overflow: hidden;
    position: absolute;
    top: 35px;
    background: #008183;
    padding-top: 5px;
    padding-bottom: 5px;
    z-index: 999;
}

#second-navigation ul li {
    height: 2.3em;
    line-height: 2.3em;
    padding: 0 0 0 18px;
    margin: 5px;
}

#second-navigation ul .disabled {
    color: #D4D0C8;
}

#second-navigation ul li.selected {
    height: 2.32em;
    border-bottom: 1px solid #FFF;
    background-color: #FFF;
    border-radius: 5px;
}

#second-navigation ul a {
    color: #fff;
    display: block;
    padding: 0 0.6em 0 0.6em;
    font-size: 0.9em;
    font-weight: normal;
    text-transform: uppercase;
    /* Uncomment next line for main-nav drop shadows */
    text-shadow: 0px 1px 1px #22323f;
}

#second-navigation ul li a:hover, #second-navigation ul .selected a {
    color: #F9924B;
    text-decoration: none;
}

#second-navigation ul a:focus {
    text-decoration: underline;
}

#second-navigation ul .selected a {
    text-shadow: none;
}

/* -------------------------------------- */
/*      Application Navigation Style      */
/* -------------------------------------- */
#app-navigation {
	position: absolute;
	top: 40px;
	left: 0;
	margin: 0;
	padding: 0.5em;
	width: 180px;
}

#app-navigation h1, #app-navigation h2, #app-navigation h3 {
	color: #959595;
	margin: 0.4em 0 0.6em 0;
	text-transform: uppercase;
	text-shadow: 1px 1px 0 #fff; /* Setting must be in px */
	white-space: nowrap;
	overflow: hidden;
}

#app-navigation ul {
	display: inline; /* IE Fix */
}

#app-navigation ul {
	display: block;
	background: #f5f7fa;
	min-height: 465px;
	border: 1px solid #ccc;
}

#app-navigation ul li {
	/*
	background-color: #fff;
	border: 0.1em solid #d2d6de;*/
	padding: 0.5em;
	margin: 0.1em 0.3em 0.3em 0;
	white-space: nowrap;
    overflow: hidden;
}

#app-navigation ul .disabled {
	color: #D4D0C8;
}

#app-navigation ul a {
	color: #444;
	display: block;
	font-weight: normal;
	padding: 0.1em 0.3em 0.1em 0.3em;
}

#app-navigation ul .selected, #app-navigation ul .selected {
	background-color: #fff;
	margin-right: 0;
}

#app-navigation ul .selected a {
	color: #F9924B;
	padding: 0.1em 0.3em 0 0.3em;
}

#app-navigation ul a:hover {
	text-decoration: none;
	color: #111;
}

#app-navigation ul a:focus {
	text-decoration: underline;
}

/* ------------------------- */
/*      Screenlet Style      */
/* ------------------------- */
.screenlet {
	background-color: #FFFFFF;
	border-top: 0.2em solid #008183;
	border-right: 0.1em solid #ccc;
	border-bottom: 0.1em solid #ccc;
	border-left: 0.1em solid #ccc;
	height: auto !important;
	height: 1%;
	margin-bottom: 1em;
	overflow: auto;
}

.screenlet-body {
	background-color: #FFFFFF;
	height: auto !important;
	height: 1%;
	padding: 0.4em;
}

.screenlet-body div {
	margin: 0.8em 0.1em
}

/* Special Screenlet style for locale and timezone window */
.lists.screenlet {
	margin-left: 25%;
	margin-right: 25%;
	margin-top: 1em;
}

.lists.screenlet .basic-table tr td {
	text-align: center;
}

.lists.screenlet .basic-table tr td a {
	display: block;
}

/* No padding screenlet decorator */
.no-padding {
	padding: 0;
	border: none;
}

.no-padding .h1, .no-padding .h2, .no-padding .h3, .no-paddingr h1,
	.no-padding h2, .no-padding h3 {
	padding: 0.7em;
}

/* ----------------------------------- */
/*      Screenlet Title Bar Style      */
/* ----------------------------------- */
.screenlet-title-bar {
	background: #f9f9f9;
	color: #ffffff;
	height: 1%; /* IE fix */
	min-height: 1.5em;
	padding: 0.5em 0.2em;
}

.screenlet-title-bar .h1, .screenlet-title-bar .h2, .screenlet-title-bar .h3,
	.screenlet-title-bar h1, .screenlet-title-bar h2, .screenlet-title-bar h3
	{
	background: none;
	color: #212529;
	text-shadow: 1px 1px 0 #fff; /* Setting must be in px */
}

.screenlet-title-bar ul {
	display: inline; /* IE Fix */
}

.screenlet-title-bar ul li {
	background: none;
	border-left: 0.1em solid #dedede;
	color: #222;
	float: right;
	font-size: 1em;
	font-weight: bold;
	padding: 0.1em 0.5em 0.2em 0.5em;
}

.screenlet-title-bar ul .h1, .screenlet-title-bar ul .h2,
	.screenlet-title-bar ul .h3 {
	border-left: none;
	float: left;
}

.screenlet-title-bar h1, .screenlet-title-bar .h1 {
	font-size: 1.6em;
}

.screenlet-title-bar h2, .screenlet-title-bar .h2 {
	font-size: 1.3em;
}

.screenlet-title-bar h3, .screenlet-title-bar .h3 {
	font-size: 1.1em;
}

.screenlet-title-bar .h3 a {
	color: #222;
	display: inline;
}

.screenlet-title-bar ul a {
	color: #222;
	display: block;
}

.screenlet-title-bar ul a:visited {
	color: #222;
}

.screenlet-title-bar ul a:hover {
	color: #F9924B;
	text-decoration: none;
}

.screenlet-title-bar ul .disabled {
	color: #CCCCCC;
}

.screenlet-title-bar ul .collapsed, .screenlet-title-bar ul .collapsed:hover
	{
	background: url(../images/expand.gif) no-repeat center center;
	min-height: 1.1em;
	min-width: 1.1em;
}

.screenlet-title-bar ul .expanded, .screenlet-title-bar ul .expanded:hover
	{
	background: url(../images/collapse.gif) no-repeat center center;
	min-height: 1.1em;
	min-width: 1.1em;
}

.screenlet-title-bar ul .collapsed a, .screenlet-title-bar ul .expanded a
	{
	/* IE fix */
	cursor: default;
}

/* ------------------------------------------------ */
/*      Basic Navigation (Vertical Menu) Style      */
/* ------------------------------------------------ */
.basic-nav {
	/* indent menu - helpful for widgets */
	padding-left: 1em;
}

.basic-nav ul a {
	color: #212529;
	font-size: 1.1em;
}

.basic-nav ul .selected, .basic-nav ul .selected a {
	color: #0000ff;
}

.basic-nav ul a:hover {
	color: #0000ff;
}

.basic-nav ul .disabled, .basic-nav ul .disabled a {
	color: #D4D0C8;
}

/* ------------------------------------- */
/*      Button Bar Navigation Style      */
/* ------------------------------------- */
.button-bar {
	display: table;
	margin-bottom: 1.0em;
}

.button-bar ul {
	display: inline; /* IE Fix */
}

.button-bar form, .button-bar ul li {
	float: left;
	font-weight: bold;
	margin-right: 5px;
}

.button-bar ul .opposed {
	float: right;
}

.button-bar ul a {
	display: block;
}

.button-bar .opposed, .button-bar .opposed li, .button-bar ul .opposed {
	float: right;
}

/* ------------------------------- */
/*      Button Bar Decorators      */
/* ------------------------------- */
.button-style-1 {
	display: table;
}

.button-style-1 ul li {
	margin-right: 0.5em;
	margin-bottom: 0.5em;
}

.button-style-2 {
	display: table;
}

.button-style-2 ul li {
	margin-right: 0.5em;
	margin-bottom: 0.5em;
}

.button-style-2 {
	display: table;
}

.tool-bar {
	padding: 0.2em;
}

.tool-bar ul li {
	padding: 0.1em;
}

.tab-bar {
	display: table;
	border-bottom: 0.01em solid #ccc;
	padding-left: 10px;
	width: 100%;
	box-sizing: border-box;
}

.tab-bar ul li {
	margin-right: 0.5em;
	margin-bottom: -1px;
	background: #fff;
	border-top: 0.1em solid #ccc;
	border-right: 0.1em solid #ccc;
	border-left: 0.1em solid #ccc;
	padding: 0.8em;
	white-space: nowrap;
}

.tab-bar ul a, .tab-bar ul a:visited {
	color: #666;
}

.tab-bar ul .selected {
	border-bottom: 0.1em solid #FFF;
}

.tab-bar ul a:hover, .tab-bar ul .selected, .tab-bar ul .selected a,
	.tab-bar ul .selected a:hover {
	color: #F9924B;
	text-decoration: none;
}

.tab-bar ul a:focus {
	text-decoration: underline;
}

.tab-bar ul .disabled {
	color: #ccc;
}
.action-bar a {
	margin-right: 5px;
}

/* ---------------------- */
/*      Table Styles      */
/* ---------------------- */
.basic-table {
	background-color: #ffffff;
	color: #212529;
	margin-bottom: 1em;
	width: 100%;
}

form table, form .basic-table, .screenlet-body .basic-table {
	background: transparent;
	margin-bottom: 0;
}

.basic-table tr td {
	/* Style for all cells */
	padding: 0.8em 0.1em;
	vertical-align: middle;
}

.basic-table tr .align-bottom {
	vertical-align: bottom;
}

.basic-table tr .align-top {
	vertical-align: top;
}

.basic-table tr .label, .basic-table tr .group-label {
	/* field labels for forms */
	font-weight: bold;
	text-align: right;
	padding-right: 1.5em;
	white-space: nowrap;
	width: 1%;
}

.basic-table tr .group-label {
	/* "header" for field label groups */
	font-size: 1.2em;
	padding: 2em 1.5em 0 0;
}

.basic-table tr th, .basic-table .header-row {
	font-weight: bold;
	text-align: left;
}

.basic-table .header-row td {
	background: #eee;
}

.basic-table .header-row td a {
	color: #212529;
}
/*      Sort field style      */
.basic-table .header-row th .sort-order-asc, .basic-table .header-row td .sort-order-asc
    {
    background: url(../images/arrow-wt-up.png) no-repeat right;
    padding-left: 0.5em;
    padding-right: 20px; /* Setting must be in px */
}

.basic-table .header-row th .sort-order-desc, .basic-table .header-row td .sort-order-desc
    {
    background: url(../images/arrow-wt-dw.png) no-repeat right;
    padding-left: 0.5em;
    padding-right: 20px; /* Setting must be in px */
}

.basic-table .header-row th .sort-order, .basic-table .header-row td .sort-order
    {
    background: url(../images/arrow-wt.png) no-repeat right;
    background-size: 13px;
    padding-left: 0.5em;
    padding-right: 20px; /* Setting must be in px */
}

.basic-table .alternate-row {
	/* Alternating row style */
	background-color: #eeeeee;
}

.basic-table .selected {
	background: #FFFCCF;
}

.basic-table .alternate-rowSelected {
	background: #FFF55F;
}

.basic-table .Validate {
	/*Style use by alt-row-style on list*/
	background: #A0D5F7;
}

.basic-table .alternate-rowValidate {
	/*Style use by alt-row-style on list*/
	background: #72A8F2;
}

.basic-table .Warn {
	/*Style use by alt-row-style on list*/
	background: #f55C5C;
}

.basic-table .alternate-rowWarn {
	/*Style use by alt-row-style on list*/
	background: #FC7455;
}

.basic-table tr .button-col {
	/* button column style - for the small
collection of buttons used in lists */
	vertical-align: top;
	padding: 0.3em;
}

.basic-table tr .button-col a, .basic-table tr .button-col button,
	.basic-table tr .button-col input[type="reset"], .basic-table tr .button-col input[type="submit"],
	.basic-table tr .button-col input[type="button"] {
	-webkit-appearance: none;
	-moz-border-radius: 1em;
	-webkit-border-radius: 1em;
	border-radius: 1em;
	background: #ddd url(../images/button.png) repeat-x;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff),
		color-stop(1, #ddd));
	background: -moz-linear-gradient(top center, #fff 0%, #ddd 100%);
	border: 0.1em solid;
	border-color: #ddd #bbb #999;
	cursor: pointer;
	color: #212529;
	display: inline-block;
	font-size: 0.9em;
	font-weight: bold;
	outline: 0;
	overflow: visible;
	padding: 0.1em 0.5em 0.2em 0.5em;
	text-decoration: none;
	text-shadow: #fff 0 1px 1px; /* Setting must be in px */
	/*text-transform:uppercase;*/
	width: auto;
	/* IE7 */
	*padding-top: 0.2em;
	*padding-bottom: 0;
}

.basic-table .collapsed {
	visibility: collapse;
}

/*      Alternate table header style      */
.basic-table .header-row-2 th, .basic-table .header-row-2 td {
	background-color: #999;
	border-bottom: 0;
	border-left: 0.1em solid #aaa;
	border-right: 0.1em solid #888;
	color: #ffffff;
	font-weight: bold;
}

/*      Sort field style      */
.basic-table .header-row-2 th .sort-order-asc, .basic-table .header-row-2 td .sort-order-asc
	{
	background: url(../images/arrow-gr-up.png) no-repeat right;
	padding-left: 0.5em;
	padding-right: 20px; /* Setting must be in px */
}

.basic-table .header-row-2 th .sort-order-desc, .basic-table .header-row-2 td .sort-order-desc
	{
	background: url(../images/arrow-gr-dw.png) no-repeat right;
	padding-left: 0.5em;
	padding-right: 20px; /* Setting must be in px */
}

.basic-table .header-row-2 th .sort-order, .basic-table .header-row-2 td .sort-order
	{
	background: url(../images/arrow-gr.png) no-repeat right;
	padding-left: 0.5em;
	padding-right: 20px; /* Setting must be in px */
	color: #fff
}

/* ------------------------------------- */
/*      Table decorator - Hover bar      */
/* ------------------------------------- */
.hover-bar tr:hover {
	background-color: #cccccc;
	cursor: default;
}

.hover-bar .header-row-1:hover, .hover-bar tr th:hover {
	background-color: #ffffff;
	color: #212529;
}

/* -------------------------------- */
/*      Table decorator - Grid      */
/* -------------------------------- */
.dark-grid {
	border-right: 0.1em solid #212529;
	border-top: 0.1em solid #212529;
}

.dark-grid td, .dark-grid .header-row-2 th, .dark-grid .header-row-2 td
	{
	border-bottom: 0.1em solid #212529;
	border-left: 0.1em solid #212529;
}

.light-grid {
	border-right: 0.1em solid #eeeeee;
	border-top: 0.1em solid #eeeeee;
}

.light-grid td, .light-grid .header-row td {
	border-bottom: 0.1em solid #eeeeee;
	border-left: 0.1em solid #eeeeee;
}

/* ------------------------------------ */
/*      Table decorator - Calendar      */
/* ------------------------------------ */
.calendar {
	border-right: 0.1em solid #cccccc;
}

.calendar tr td {
	border-bottom: 0.1em solid #cccccc;
	border-left: 0.1em solid #cccccc;
	vertical-align: top;
	padding: 0.5em;
}

.calendar .header-row td {
	background-color: #999;
	border-bottom: 0.1em solid #cccccc;
	border-left: 0.1em solid #cccccc;
	color: #ffffff;
	height: auto;
	text-align: center;
}

.calendar tr td .add-new {
	float: right;
}

.calendar tr td .h1 {
	color: #212529;
	float: left;
}

.calendar .current-period {
	background-color: #ffffcc;
}

.calendar .active-period {
	background-color: #eeeeee;
}

/* ================== */
/* Tree Styles      */
/* ================== */

.basic-tree ul {
	padding-left: 1em;
}

.basic-tree li {
	padding-left: 1em;
	white-space: nowrap;
}

.basic-tree li .expanded {
	background: url(../images/collapse.gif) no-repeat left center;
	padding-right: 1em;
}

.basic-tree li .collapsed {
	background: url(../images/expand.gif) no-repeat left center;
	padding-right: 1em;
}

.basic-tree li .leafnode {
	background: url(../images/expand-collapse-placeholder.gif) no-repeat left
		center;
	padding-right: 1em;
}

.basic-tree li .treeitem {
	/* treeitem is deprecated */
	border-style: none;
	color: #212529;
	font-size: 1em;
}

.basic-tree li a:hover {
	color: #0000ff;
}

/* --------------------- */
/*      Form Styles      */
/* --------------------- */
.basic-form {
	margin-bottom: 1em;
}

.basic-form table {
	width: 100%;
}

.basic-form table .header-row:hover {
	/*background-color: #ffffff;*/
	color: #212529;
}

.basic-form table tr .label, .basic-form table tr .group-label {
	/* field labels for forms */
	font-weight: bold;
	text-align: right;
	padding-right: .5em;
}

.basic-form table tr .group-label {
	/* "header" for field label groups */
	font-size: 1.2em;
	padding: 2em 1.5em 0 0;
}

.basic-form table tr th, .basic-form table .header-row {
	font-weight: bold;
	text-align: left;
}

.basic-form table .header-row:hover, .basic-form table tr th:hover {
	color: #212529;
}

.basic-form table .header-row td {
	border-bottom: 0.1em solid #ccc9;
}

.basic-form table tr td .disabled {
	color: #FFFF;
	text-decoration: none;
}

/*      Form decorator - Form Widget      */
.form-widget table tr .label, .form-widget-table tr .label {
	/* Added for backward compatibility */
	width: 20%;
}

.form-widget table, .form-widget-table {
	width: auto;
}

.form-widget-table {
	margin-bottom: 1em;
}

/* ------------------------------- */
/*      List Navigation Style      */
/* ------------------------------- */
.nav-pager {
	font-weight: bold;
	line-height: 3.5em;
	height: 3.5em;
	margin: 0.5em 0 0.5em 0;
}

.nav-pager ul {
	display: inline; /* IE Fix */
}

.nav-pager ul li {
	float: left;
	vertical-align: center;
}

.nav-pager ul li a {
	display: block;
}

.nav-pager ul a {
	padding: 0 1em 0 1em;
	text-decoration: none;
}

.nav-pager ul a:hover {
	color: #FFF;
	background-color: #F9924B;
}

.nav-pager ul .nav-pagesize, .nav-pager ul .nav-page-select, .nav-pager ul .nav-displaying
	{
	padding: 0 1em 0 1em;
}

.nav-pager ul .nav-first-disabled, .nav-pager ul .nav-previous-disabled,
	.nav-pager ul .nav-next-disabled, .nav-pager ul .nav-last-disabled {
	color: #D4D0C8;
	padding: 0 1em 0 1em;
}

.nav-pager ul .nav-displaying {
	border-right: none;
}

/* ------------------------------- */
/*      Visual Embellishments      */
/* ------------------------------- */
.field-lookup a {
	background: url(../images/fieldlookup.gif) no-repeat 0 0;
	display: inline-block;
	vertical-align: top;
	margin-top: 0.6em;
	width: 16px; /* Setting must be in px */
	height: 16px; /* Setting must be in px */
}

.field-lookup a.clearField {
	width: auto;
}

.upload-file-container {
    width: 250px;
}

.upload-fields{
    padding: 0;
    margin: 5px;
}

.upload-fields li{
    padding: 0;
    margin: 10px 0;
}

.upload-button {
    display: block;
    width: 30px;
    height: 20px;
    margin-top: 10px;
    background: url(../images/upload-btn.png) no-repeat 0 0;
    padding-left: 20px;
}

.progress-content {
    display: none;
}

.progress-content div {
    display: inline-block;
}

.progress-content .progress-bar {
    width: 30%;
    height: 7px;
    line-height: 7px;
    margin-left: 5px;
}

.progress-content .progress-num {
    margin-left: 5px;
}
.upload-file-tip {
	font-size: 0.9em;
	color: #ccc;
}

/* --------------------------- */
/*      FieldGroup Styles      */
/* --------------------------- */
.fieldgroup-title-bar {
	font-size: 1em;
	font-weight: bold;
	padding: 0.1em 0.5em 0.2em 0.5em;
}

.fieldgroup-title-bar ul .collapsed, .fieldgroup-title-bar ul .collapsed:hover
	{
	background: url(../images/expand.gif) no-repeat left center;
	min-height: 1.1em;
	min-width: 1.1em;
}

.fieldgroup-title-bar ul .expanded, .fieldgroup-title-bar ul .expanded:hover
	{
	background: url(../images/collapse.gif) no-repeat left center;
	min-height: 1.1em;
	min-width: 1.1em;
}

.fieldgroup-title-bar a {
	cursor: pointer;
	text-decoration: none;
	padding-left: 10px; /* Setting must be in px */
	color: #212529;
}

/* ----------------------------------------- */
/*      Portlet configuration screenlet      */
/* ----------------------------------------- */
.portlet-config {
	background-color: #D4D0C8;
	border: 0.2em solid #D4D0C8;
	margin-bottom: 0.5em;
}

.portlet-config-title-bar .title {
	color: #555555;
	font-size: 1.2em;
	float: left;
}

.portlet-config-title-bar ul {
	display: inline; /* IE Fix */
}

.portlet-config-title-bar ul li {
	float: right;
	font-size: 1em;
	font-weight: bold;
	padding: 0.1em 0.5em 0.2em 0.5em;
}

.portlet-config-title-bar ul li.move-up {
	background: url(../images/arrow-single-up-green.png) no-repeat center
		center;
}

.portlet-config-title-bar ul li.move-down {
	background: url(../images/arrow-single-down-green.png) no-repeat center
		center;
}

.portlet-config-title-bar ul li.move-left {
	background: url(../images/arrow-single-left-green.png) no-repeat center
		center;
}

.portlet-config-title-bar ul li.move-right {
	background: url(../images/arrow-single-right-green.png) no-repeat center
		center;
}

.portlet-config-title-bar ul li.move-top {
	background: url(../images/arrow-end-up-green.png) no-repeat center center;
}

.portlet-config-title-bar ul li.move-bottom {
	background: url(../images/arrow-end-down-green.png) no-repeat center
		center;
}

.portlet-config-title-bar ul li.remove {
	background: url(../images/mini-trash.png) no-repeat center center;
}

.portlet-config-title-bar ul li.edit {
	background: url(../images/mini-edit.png) no-repeat center center;
}

/* == Portal Manager Toolbar == */
#manage-portal-toolbar {
	background-color: #D4D0C8;
	margin-bottom: 0.5em;
}

#manage-portal-toolbar ul li {
	float: left;
	padding: 0.1em 0.5em 0.2em 0.5em;
}

#manage-portal-toolbar #config-on-off, #manage-portal-toolbar #manage-portal-page,
	#manage-portal-toolbar #add-column {
	float: right;
}

#manage-portal-toolbar #portal-page-name {
	font-size: 1.5em;
	font-weight: bold;
}

.manage-portal-column-toolbar #add-portlet,
	.manage-portal-column-toolbar #delete-column,
	.manage-portal-column-toolbar #column-width {
	float: right;
}

/*=================== For the quickadd page =================================*/
.quickaddall {
	float: right;
	padding-bottom: 1em;
	padding-top: 1em;
}

.quickaddtable {
	display: inline-block;
	clear: both;
}

.quickaddtable span {
	display: inline;
	border-right: 0.1em solid #999999;
	border-top: 0.1em solid #999999;
	margin: 0;
	padding: 0.3em;
}

.quickaddtable p {
	clear: left;
	height: 100% !important;
	height: 1em;
}

.quickaddtable span.pid {
	width: 10%;
}

.quickaddtable span.name {
	width: 50%;
	text-align: left;
}

.quickaddtable span.listPrice {
	width: 10%
}

.quickaddtable span.totalPrice {
	width: 10%
}

.quickaddtable span.qty {
	width: 10%
}

/* `Widths
----------------------------------------------------------------------------------------------------*/
.input_tiny {
	width: 50px;
}

.input_small {
	width: 100px;
}

.input_medium {
	width: 150px;
}

.input_large {
	width: 200px;
}

.input_xlarge {
	width: 250px;
}

.input_xxlarge {
	width: 300px;
}

.input_full {
	width: 100%;
}

/*
	Added via JS to <textarea> and class="input_full".
	Applies to IE6, IE7. Other browsers don't need it.
*/
.input_full_wrap {
	display: block;
	padding-right: 8px;
}

/* `UI Consistency
----------------------------------------------------------------------------------------------------*/
::-moz-focus-inner {
	border: 0;
}

input[type="search"]::-webkit-search-decoration {
	display: none;
}

input, button, select, textarea {
	margin: 0;
	vertical-align: middle;
}

a.buttontext, a.buttontextbig, .smallSubmit, .smallSubmit:hover,
	.mediumSubmit, .largeSubmit, .loginButton, .button-style-1 a,
	.button-style-1 ul a, .button-style-2 ul a, .button-style-2 a, .button,
	button, input[type="reset"], input[type="submit"], input[type="button"],
	li.buttontext a
	{
	background-color: #F9924B;
	border: 0.1em solid transparent;
	cursor: pointer;
	color: #FFF;
	display: inline-block;
	font-size: 1.2em;
	font-weight: bold;
	outline: 0;
	overflow: visible;
	padding: 0.4em 1em 0.4em;
	text-decoration: none;
	/*text-transform:uppercase;*/
	width: auto;
	/* IE7 */
	*padding-top: 0.2em;
	*padding-bottom: 0;
}

a.buttontext img {
	vertical-align: bottom;
}

button {
	/* IE7 */
	*padding-top: 0.1em;
	*padding-bottom: 0.1em;
}

a.disabled, button[disabled], input[type="reset"][disabled], input[type="submit"][disabled],
	input[type="button"][disabled] {
	color: #888;
	border-color: #ddd #ddd #ccc;
}

textarea, select, input[type="date"], input[type="datetime"], input[type="datetime-local"],
	input[type="email"], input[type="month"], input[type="number"], input[type="password"],
	input[type="search"], input[type="tel"], input[type="text"], input[type="time"],
	input[type="url"], input[type="week"] {
	-webkit-appearance: none;
	-moz-border-radius: 0;
	-webkit-border-radius: 0;
	border-radius: 0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	/*background-color: #fff;*/
	border: 0.1em solid;
	border-color: #e1e1e1;
	color: #212529;
	outline: 0;
	padding: 0.2em 0.3em;
	height: 2.5em;
	/* IE7 */
	*padding-top: 0.2em;
	*padding-bottom: 0.1em;
	*height: auto;
}

/*
	Separate rule for Firefox.
	Cannot stack with WebKit's.
*/
input.placeholder_text, textarea.placeholder_text {
	color: #888;
}

::-webkit-input-placeholder {
	color: #888;
}

textarea[disabled], select[disabled], input[type="date"][disabled],
	input[type="datetime"][disabled], input[type="datetime-local"][disabled],
	input[type="email"][disabled], input[type="month"][disabled], input[type="number"][disabled],
	input[type="password"][disabled], input[type="search"][disabled], input[type="tel"][disabled],
	input[type="text"][disabled], input[type="time"][disabled], input[type="url"][disabled],
	input[type="week"][disabled] {
	background-color: #eee;
	color: #888;
}

.button-style-1 a:focus, .button-style-1 ul a:focus, .button-style-2 ul a:focus,
	.button-style-2 a:focus, .smallSubmit:focus, button:focus, button:active,
	input:focus, input:active, select:focus, select:active, textarea:focus,
	textarea:active {
	-moz-box-shadow: #5c809c 0 0 5px;
	-webkit-box-shadow: #5c809c 0 0 5px;
	box-shadow: #5c809c 0 0 5px;
	/* for Opera */
	z-index: 1;
}

select {
	/* Tweaks for Safari + Chrome. */
	background-image: url(../images/select_arrow.gif);
	background-repeat: no-repeat;
	background-position: right center;
	padding-right: 20px;
}

textarea, select[multiple] {
	height: auto;
}

select[multiple], select[multiple] {
	background-image: none;
	padding: 0;
}

textarea {
	overflow: auto;
	resize: vertical;
	width: 100%;
}

optgroup {
	color: #000;
	font-style: normal;
	font-weight: normal;
}

/* `IE6
----------------------------------------------------------------------------------------------------*/
.ie6_button, * html button {
	background: #ddd url(../images/button.png) repeat-x;
	border: 0.1em solid;
	border-color: #ddd #bbb #999;
	cursor: pointer;
	color: #212529;
	font: bold 1.2em Arial, sans-serif;
	padding: 0.2em 1em 0;
	overflow: visible;
	width: auto;
}

* html button {
	padding-top: 0.1em;
	padding-bottom: 0.1em;
}

.ie6_input, * html textarea, * html select {
	background: #fff;
	border: 0.1em solid;
	border-color: #848484 #c1c1c1 #e1e1e1;
	color: #000;
	padding: 0.2em 0.3em 0.1em;
	font-size: 1.3em;
	font-family: Arial, sans-serif;
	vertical-align: top;
}

* html select {
	margin-top: 0.1em;
}

.placeholder_text, .ie6_input_disabled, .ie6_button_disabled {
	color: #888;
}

.ie6_input_disabled {
	background: #eee;
}

/* ----------------------------------- */
/*      Event/Error Message Style      */
/* ----------------------------------- */
.eventMessage, .errorMessage {
	background-color: #FFFFEE;
	border: solid #212529 0.1em;
	font-size: 1.1em;
	font-weight: bold;
	margin: 1em;
	padding: 1em;
	position: absolute;
	left: 50%;
	margin-left: -200px;
	z-index: 999;
}

.eventMessage {
	color: #212529;
}

.errorMessage {
	color: #ff0000;
}

/* ------------------------ */
/*      Product Styles      */
/* ------------------------ */
.basePrice {
	color: #000000;
}

.normalPrice {
	color: #008000;
}

.salePrice {
	color: #ff0000;
}

.product-prevnext {
	text-align: right;
}

.productsummary-container {
	border-top: #999 solid 0.1em;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
}

.productsummary {
	border-bottom: #999 solid 0.1em;
	/* using min-height as an alternative to clear: both; because that, in some browsers, will clear the top-level columns and not just in this div (Mozilla based, namely) */
	min-height: 6em;
	overflow: visible;
	padding: 0.5em;
	position: relative;
}

.productsummary .smallimage {
	float: left;
	/* position: absolute; top: 5px; left: 5px; */
	margin: 0 0.5em 0.5em 0;
}

.productsummary .smallimage img {
	border: #CCC solid 0.1em;
	height: 5em;
}

.productsummary .productbuy {
	float: right;
	margin: 0.5em;
	text-align: right;
	width: 13em;
}

.productsummary .productinfo {
	/* margin-left: 60px; */
	text-align: left;
}

#productdetail #long-description {
	border-top: #999 solid 0.1em;
	margin-top: 1em;
	padding-top: 0.5em;
}

#productdetail #reviews {
	border-top: #999 solid 0.1em;
	margin-top: 1em;
	padding-top: 0.5em;
}

#productdetail #associated-products {
	border-top: #999 solid 0.1em;
	margin-top: 1em;
	padding-top: 0.5em;
}

.treeWrapper {
	background-color: #ffffff;
	border-top: 0.1em solid #000000;
	border-left: 0.1em solid #000000;
	color: #000000;
	font-size: 1.6em;
	font-weight: normal;
	margin-left: 1.2em;
	margin-top: 0.2em;
	text-decoration: none;
}

/* ------------------------- */
/*      HTML Log Styles      */
/* ------------------------- */
.DEBUG {
	color: #808080;
}

.WARN {
	color: #0000ff;
	font-weight: bold;
}

.INFO {
	color: #008000;
}

.ERROR {
	border: 0.2em solid #ff0000;
	color: #ff0000;
	font-weight: bold;
}

/* ---------------------------- */
/*     Multi-Column Styles      */
/* ---------------------------- */
#column-container {
	position: relative;
}

#column-container h1, #column-container .h1, #column-container h2,
	#column-container .h2 {
	margin-bottom: 0.5em;
}

#column-container h1, #column-container .h1 {
	color: #008183;
}

#column-container .left {
	float: left;
	/* alt: position: absolute; top: 0px; left: 0px; */
	width: 22em;
	margin-right: 1em;
}

#column-container .left-larger {
	float: left;
	/* alt: position: absolute; top: 0px; left: 0px; */
	width: 25em;
	margin-right: 1em;
}

.lefthalf {
	float: left;
	height: 1%;
	left: 0;
	margin: 0% 1% 1% 0%;
	width: 49%;
}

.righthalf {
	float: right;
	height: 1%;
	margin: 0 0 1% 1%;
	right: 0;
	width: 49%;
}

#column-container .right {
	float: right;
	margin-left: 1em;
	width: 22em;
}

#column-container .leftonly {
	margin-left: 23em;
	width: auto;
}

#column-container .leftonly-larger {
	margin-left: 26em;
	width: auto;
}

#column-container .rightonly {
	margin-right: 23em;
	width: auto;
}

#column-container .center {
	margin-left: 23em;
	margin-right: 23em;
	width: auto;
}

#column-container .nocolumns {
	width: auto;
}

/* ------------------------------ */
/* Deprecated styles - DO NOT USE */
/* ------------------------------ */
.apptitle {
	background-color: #333;
	color: #FFFFFF;
	display: block;
	font-size: 1.3em;
	font-weight: bold;
	line-height: 2em;
	width: 100%;
}

.boxhead {
	color: #FFFFFF;
	font-size: 1.1em;
	font-weight: bold;
}

.boxlink {
	float: right;
}

DIV.boxtop {
	background-color: #333;
	border-color: #999999;
	border-style: solid;
	margin: 0 auto 0 auto;
	padding: 0.1em 0.4em 0.1em 0.4em;
	text-align: center;
}

DIV.boxhead-left {
	border: none;
	color: #FFFFFF;
	float: left;
	font-size: 1.1em;
	font-weight: bold;
	width: auto;
}

DIV.boxhead-fill {
	border: none;
	color: #FFFFFF;
	font-size: 1.1em;
	font-weight: bold;
	text-align: center;
	width: 0;
}

DIV.boxhead-right {
	border: none;
	color: #FFFFFF;
	float: right;
	font-size: 1.1em;
	font-weight: bold;
	width: auto;
}

A.boxheadbutton {
	color: #FFFFFF;
	font-size: 1.1em;
}

A.boxheadbutton:hover {
	color: #ff0000;
	text-decoration: none;
}

.boxoutside {
	background-color: #FFFFFF;
	border: 0.1em solid #999999;
}

.boxtop {
	background-color: #333;
	border: 0 solid #999999;
	padding: 0.1em 0.4em 0.1em 0.4em;
}

.boxbottom {
	background-color: #FFFFFF;
	border: 0 solid #999999;
	padding: 0.4em;
}

.webToolList h3 {
	margin: 0.75em 0 0.09em 0;
	text-transform: uppercase;
}

A.linktext {
	color: #333;
}

A.linktext:hover {
	color: #ff0000;
}

.buttontextdisabled {
	color: #333333;
}

.submenutextinfo {
	border-right: 0.1em solid #5886C6;
	color: #ffffff;
	font-size: 0.9em;
	font-weight: bold;
	padding-left: 0.5em;
	padding-right: 0.5em;
}

.submenutext, A.submenutext, A.submenutext:visited {
	border-right: 0.1em solid #5886C6;
	color: #ffff00;
	font-size: 0.9em;
	font-weight: bold;
	padding-left: 0.2em;
	padding-right: 0.5em;
}

A.submenutext:hover {
	color: #ffff00;
}

.submenutextdisabled, A.submenutextdisabled {
	border-right: 0.1em solid #5886C6;
	color: #CCCCCC;
	font-size: 0.9em;
	font-weight: bold;
	padding-left: 0.2em;
	padding-right: 0.5em;
}

A.submenutextdisabled:hover {
	color: #ffff00;
}

.submenutextinforight {
	color: #ffffff;
	font-size: 0.9em;
	font-weight: bold;
	padding-left: 0.2em;
}

.submenutextright, A.submenutextright {
	color: #ffff00;
	font-size: 0.9em;
	font-weight: bold;
	padding-left: 0.2em;
}

A.submenutextright:hover {
	color: #ffff00;
}

.submenutextrightdisabled, A.submenutextrightdisabled {
	color: #CCCCCC;
	font-size: 0.9em;
	font-weight: bold;
	padding-left: 0.2em;
}

A.submenutextrightdisabled:hover {
	color: #ffff00;
}

A.lightbuttontext {
	border: none;
	color: #222;
}

A.lightbuttontext:hover {
	color: #ccc;
}

A.lightbuttontextsmall {
	border: none;
	color: #222;
	font-size: 0.8em;
}

A.lightbuttontextsmall:hover {
	color: #ccc;
}

.lightbuttontextdisabled {
	color: #CCCCCC;
	font-weight: bold;
}

DIV.row {
	background-color: #B4B0AA;
	margin: 0 auto 0 auto;
	text-align: center;
}

DIV.col {
	border: none;
	float: left;
	width: auto;
}

DIV.col-fill {
	background-color: #B4B0AA;
	border: none;
	color: #333;
	font-weight: bold;
	text-align: center;
	width: 0;
}

DIV.col-right {
	border: none;
	float: right;
	width: auto;
}

.leftclear {
	clear: left;
	height: 1%;
}

DIV.endcolumns {
	/* deprecated - use .clear */
	clear: both;
}

DIV.simple-right-small {
	float: right;
	width: 2em;
	text-align: right;
}

DIV.simple-right-half {
	float: right;
	width: 50%;
	text-align: right;
}

.left-border {
	float: left;
	margin-right: 1em;
	width: 22em;
	border-right: 0.5em dotted #ccc;
	background-color: #eee;
	height: 100%;
}

DIV.widget-container {
	margin-bottom: 2em;
}

DIV.column-left-wide {
	background-color: #CCCCCC;
	border: #000000 solid 0.2em;
	float: left;
	overflow: auto;
	width: 30em;
}

img.cssImgXLarge {
	/*border: 1px black solid;*/
	max-width: 200px;
	max-height: 150px;
}

img.cssImgLarge {
	/*border: 1px black solid;*/
	max-width: 100px;
	max-height: 75px;
}

img.cssImgStandard {
	/*border: 1px black solid;*/
	max-width: 70px;
	max-height: 52px;
}

img.cssImgSmall {
	/*border: 1px black solid;*/
	max-width: 50px;
	max-height: 37px;
}

/* From http://jqueryui.com/demos/autocomplete/maxheight.html */
/* When displaying a long list of options, you can simply set the max-height for the autocomplete menu to prevent the menu from growing too large */
.ui-autocomplete {
	max-height: 250px;
	overflow-y: auto;
	/* prevent horizontal scrollbar */
	overflow-x: hidden;
}
.ui-autocomplete::-webkit-scrollbar {
	width:0px;
}
/* IE 6 doesn't support max-height
 * we use height instead, but this forces the menu to always be this tall
 */
* html .ui-autocomplete {
	height: 250px;
}

/* The custom CSS for adjust the JsTree */
.jstree-default .jstree-leaf>ins {
	background-position: -36px 0;
	vertical-align: top;
}

html> /**/ body .jstree-default a {
	white-space: normal !important;
	height: auto;
}
/* IE6 and below */
* html .jstree-default a {
	white-space: normal;
	height: auto;
}
/* IE7 */
*+html .jstree-default a {
	white-space: normal;
	height: auto;
}

.required.error {
	border:1px solid #F9924B;
}

label.error {
	color: #F9924B;
	padding-left: 5px;
}
.close-menu-button{
	position: absolute;
	cursor: pointer;
	top: 250px;
	width: 20px;
	height: 50px;
    background-size: 11px;
    background-repeat: no-repeat;
    background-position: 0;
}
.close-menu-button.right{
    background-image: url(../images/slide-right.png);
    left: 1px;
}
.close-menu-button.left{
    background-image: url(../images/slide-left.png);
    left: 174px;
}

/************************************ styles for forms *************************************/

.basic-form .list-table, .list-table {
    border-collapse: collapse;
    padding: 0;
}
.basic-form .list-table tr td, .list-table tr td {
    width: auto;
    height: 20px;
    padding: 5px;
    border: 1px solid #EEE;
}
.basic-form .list-table tr.header-row td, .list-table tr.header-row td{
    text-align: center;
    vertical-align: middle;
}

/****************************** left menus *******************************/

#app-navigation ul li{
    padding-left: 40px;
    background-repeat: no-repeat;
    background-size: 20px;
    background-position: 20px 5px;
}
#app-navigation ul li{
    background-image: url("../images/menu-item.png");
}
#app-navigation ul li.selected{
    background-image: url("../images/menu-item-selected.png");
}

/****************************** styles for buttons *********************************************/

.btn {
    color: #FFF;
    background-color: #008183;
    padding: 0.5em 0.5em;
    text-decoration: none;
    border: 1px solid transparent;
    display: inline-block;
}
.btn.selected {
	background-color: #F9924B;
}
.btn.icon {
    padding-left: 2.2em;
    vertical-align: middle;
    background-size: 16px;
    background-repeat: no-repeat;
    background-position: 6px 6px;
}
.btn.icon.new {
    background-image: url("../images/new.png");
}
.btn.icon.view {
    color: #008183;
    background-image: url("../images/view.png");
    background-color: transparent;
}
.btn.icon.viewBtn {
    background-image: url("../images/view-btn.png");
}
.btn.icon.edit {
    background-image: url("../images/edit.png");
}
.btn.icon.update {
    background-image: url("../images/update.png");
}
.btn.icon.submit {
    color: #FFF;
    font-size: 1em;
    font-weight: normal;
    padding: 0.5em 0.5em 0.5em 2.2em;
}
.btn.icon.save {
    background-image: url("../images/save.png");
}
.btn.icon.submit.save {
    background-color: #008183;
}
.btn.icon.disable {
    background-image: url("../images/disable.png");
    background-color: #ccc;
}
.btn.icon.enable {
    background-image: url("../images/enable.png");
}
.btn.icon.cancel {
    background-image: url("../images/cancel.png");
    background-color: #CCC;
}
.btn.icon.delete {
    background-image: url("../images/delete.png");
    background-color: #CCC;
}
.btn.icon.reset {
    background-image: url("../images/reset.png");
}
.btn.icon.download {
    background-image: url("../images/download.png");
}
.btn.icon.import {
    background-image: url("../images/import.png");
}
.btn.icon.export {
    background-image: url("../images/export.png");
}
.btn.icon.print {
    background-image: url("../images/print.png");
}
.btn.icon.upload {
    background-image: url("../images/upload.png");
}
.btn.icon.scan {
    background-image: url("../images/scan.png");
}

.btn.icon.copy {
    background-image: url("../images/copys.png");
}

.btn a,
a.btn:link, 
a.btn:hover, 
a.btn:active, 
a.btn:visited {
    color: #FFF;
    text-decoration: none;
}
.btn.icononly {
	padding: 1.2em;
    vertical-align: middle;
    background-size: 20px;
    background-repeat: no-repeat;
    background-color: transparent;
}
.btn.icononly.apply {
	background-image: url("../images/apply.png");
}
/*********************************** message and tips **********************************/
.help-tip{
    background-image: url("../images/tip.png");
    background-repeat:no-repeat;
    background-size:20px;
    padding:2px 0 5px 20px;
    color: #F9924B;
}
#flash-messages {
    display: none;
    position: absolute;
    left: 50%;
    top: 50%;
}
.message {
    background-repeat: no-repeat;
    background-size: 20px;
    background-position: 3px 18px;
    min-height: 40px;
}
.message .text{
    display: block;
    padding: 20px 0 20px 30px;
}
.message.confirm{
    background-image: url("../images/question.png");
}
.message.successed{
    background-image: url("../images/successed.png");
}
.message.failed{
    background-image: url("../images/failed.png");
}
.message .inputs{
    padding: 0px 0 20px 5px;
}
.message .buttons{
    text-align: center;
}
.warning, .error, .failed {
    color: #F9924B;
}
.successed {
    color: green;
}
textarea.required {
    width: 450px;
}

/*********************************** breadcrumb ********************************/

.breadcrumb-bar>ul>li a {
    color: #FFF;
    text-decoration: none;
}
.breadcrumb-bar>ul>li {
    display: block;
    background: #008183;
    position: relative;
    height: 40px;
    line-height: 40px;
    padding: 0 10px 0 5px;
    text-align: center;
    margin-right: 23px;
}
.breadcrumb-bar>ul>li:before {
    border-color: #008183;
    border-left-color: transparent;
}
.breadcrumb-bar>ul>li:after {
    border-left-color: #008183;
}
.breadcrumb-bar>ul>li:first-child {
    padding-left: 15px;
    -webkit-border-radius: 4px 0 0 4px;
    -moz-border-radius: 4px 0 0 4px;
    -ms-border-radius: 4px 0 0 4px;
    -o-border-radius: 4px 0 0 4px;
    border-radius: 4px 0 0 4px;
}
.breadcrumb-bar>ul>li:first-child:before {
    border: none;
}
.breadcrumb-bar>ul>li:last-child {
    padding-right: 15px;
    -webkit-border-radius: 0 4px 4px 0;
    -moz-border-radius: 0 4px 4px 0;
    -ms-border-radius: 0 4px 4px 0;
    -o-border-radius: 0 4px 4px 0;
    border-radius: 0 4px 4px 0;
}
.breadcrumb-bar>ul>li:last-child:after {
    border: none;
}
.breadcrumb-bar>ul>li:before, .breadcrumb-bar>ul>li:after {
    content: "";
    position: absolute;
    top: 0;
    border: 0 solid #008183;
    border-width: 20px 10px;
    width: 0;
    height: 0;
}
.breadcrumb-bar>ul>li:before {
    left: -20px;
    border-left-color: transparent;
}
.breadcrumb-bar>ul>li:after {
    left: 100%;
    border-color: transparent;
    border-left-color: #008183;
}
.breadcrumb-bar>ul>li:hover, .breadcrumb-bar>ul>li.selected {
    background-color: #F9924B;
}
.breadcrumb-bar>ul>li:hover:before, .breadcrumb-bar>ul>li.selected:before {
    border-color: #F9924B;
    border-left-color: transparent;
}
.breadcrumb-bar>ul>li:hover:after, .breadcrumb-bar>ul>li.selected:after {
    border-left-color: #F9924B;
}
.breadcrumb-bar>ul>li:active {
    background-color: #F9924B;
}
.breadcrumb-bar>ul>li:active:before {
    border-color: #F9924B;
    border-left-color: transparent;
}
.breadcrumb-bar>ul>li:active:after {
    border-left-color: #F9924B;
}
.breadcrumb-bar>ul>li.disabled {
    color: #FFFFFF;
    background-color: #EEEEEE;
}
.breadcrumb-bar>ul>li.disabled:before {
    border-color: #EEEEEE;
    border-left-color: transparent;
}
.breadcrumb-bar>ul>li.disabled:after {
    border-left-color: #EEEEEE;
}

/********************************** dialog *******************************/

.dialog-tab {
    border: none;
}
.dialog-tab .ui-tabs-nav {
    background: none;
    border-radius: 0;
    border-top: none;
    border-left: none;
    border-right: none;
}
#ajax-login-container {
	width: 350px;
}