@media screen {
    body {
        position: absolute;
        bottom: 4px;
        top: 0px;
        bottom: 0px;
        left: 0px;
        right: 0px;
        min-width: 320px;
        font-size: 10pt;
    }
    
    .shadow {
        -moz-box-shadow: 0px 3px 4px 0px rgb(80, 80, 80);
        -webkit-box-shadow: 0px 3px 4px 0px rgb(80, 80, 80);
        /*-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=1, Direction=1, Color='rgb(80, 80, 80)')"; /* For IE 8 /
		filter		: progid:DXImageTransform.Microsoft.Shadow(Strength=1, Direction=1, Color='rgb(80, 80, 80)');/* For IE 5.5 - 7 */
        box-shadow: 0px 3px 4px 0px rgb(80, 80, 80);
    }
    .inset-shadow {
        /*-moz-box-shadow: 0px 1px 1px 1px rgb(80, 80, 80) inset;
		-webkit-box-shadow: 0px 1px 1px 1px rgb(80, 80, 80) inset;
		/*-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=1, Direction=1, Color='rgb(80, 80, 80)')"; /* For IE 8 /
		filter		: progid:DXImageTransform.Microsoft.Shadow(Strength=1, Direction=1, Color='rgb(80, 80, 80)');/* For IE 5.5 - 7 
		box-shadow	: 0px 1px 1px 1px rgb(80, 80, 80) inset;*/
        -moz-box-shadow: 1px 1px 5px 1px rgb(40, 40, 40) inset;
        box-shadow: 1px 1px 5px 1px rgb(40, 40, 40) inset;
        -webkit-box-shadow: 1px 1px 5px 1px rgb(40, 40, 40) inset;
    }
    .blue-bg {
        background: rgb(92, 131, 208);
        /* Old browsers */
        background: -moz-linear-gradient(top, rgb(92, 131, 208) 0%, rgb(9, 59, 144) 100%);
        /* FF3.6+ */
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgb(92, 131, 208)), color-stop(100%, rgb(9, 59, 144)));
        /* Chrome,Safari4+ */
        background: -webkit-linear-gradient(top, rgb(92, 131, 208) 0%, rgb(9, 59, 144) 100%);
        /* Chrome10+,Safari5.1+ */
        background: -o-linear-gradient(top, rgb(92, 131, 208) 0%, rgb(9, 59, 144) 100%);
        /* Opera 11.10+ */
        background: -ms-linear-gradient(top, rgb(92, 131, 208) 0%, rgb(9, 59, 144) 100%);
        /* IE10+ */
        background: linear-gradient(to bottom, rgb(92, 131, 208) 0%, rgb(9, 59, 144) 100%);
        /* W3C */
        filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#5c83d0', endColorstr='#093b90', GradientType=0);
        /* IE6-9 */
    }
    .centered-lgrad-bg {
        background: rgb(230, 230, 230);
        background: -moz-linear-gradient(top, rgba(230, 230, 230, 1) 0%, rgba(34, 47, 54, 1) 50%, rgba(84, 84, 84, 1) 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(230, 230, 230, 1)), color-stop(50%, rgba(34, 47, 54, 1)), color-stop(100%, rgba(84, 84, 84, 1)));
        background: -webkit-linear-gradient(top, rgba(230, 230, 230, 1) 0%, rgba(34, 47, 54, 1) 50%, rgba(84, 84, 84, 1) 100%);
        background: -o-linear-gradient(top, rgba(230, 230, 230, 1) 0%, rgba(34, 47, 54, 1) 50%, rgba(84, 84, 84, 1) 100%);
        background: -ms-linear-gradient(top, rgba(230, 230, 230, 1) 0%, rgba(34, 47, 54, 1) 50%, rgba(84, 84, 84, 1) 100%);
        background: linear-gradient(to bottom, rgba(230, 230, 230, 1) 0%, rgba(34, 47, 54, 1) 50%, rgba(84, 84, 84, 1) 100%);
        filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#e6e6e6', endColorstr='#545454', GradientType=0);
    }
    .lgrad-bg {
        background: rgb(254, 254, 254);
        background: -moz-linear-gradient(top, rgba(254, 254, 254, 1) 9%, rgba(230, 230, 230, 1) 96%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(9%, rgba(254, 254, 254, 1)), color-stop(96%, rgba(230, 230, 230, 1)));
        background: -webkit-linear-gradient(top, rgba(254, 254, 254, 1) 9%, rgba(230, 230, 230, 1) 96%);
        background: -o-linear-gradient(top, rgba(254, 254, 254, 1) 9%, rgba(230, 230, 230, 1) 96%);
        background: -ms-linear-gradient(top, rgba(254, 254, 254, 1) 9%, rgba(230, 230, 230, 1) 96%);
        background: linear-gradient(to bottom, rgba(254, 254, 254, 1) 9%, rgba(230, 230, 230, 1) 96%);
        filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#fefefe', endColorstr='#e6e6e6', GradientType=0);
    }
    .lgray-bg {
        background: rgb(230, 230, 230);
        background: -moz-linear-gradient(top, rgba(230, 230, 230, 1) 0%, rgba(34, 47, 54, 1) 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(230, 230, 230, 1)), color-stop(100%, rgba(34, 47, 54, 1)));
        background: -webkit-linear-gradient(top, rgba(230, 230, 230, 1) 0%, rgba(34, 47, 54, 1) 100%);
        background: -o-linear-gradient(top, rgba(230, 230, 230, 1) 0%, rgba(34, 47, 54, 1) 100%);
        background: -ms-linear-gradient(top, rgba(230, 230, 230, 1) 0%, rgba(34, 47, 54, 1) 100%);
        background: linear-gradient(to bottom, rgba(230, 230, 230, 1) 0%, rgba(34, 47, 54, 1) 100%);
        filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#e6e6e6', endColorstr='#222f36', GradientType=0);
    }
    .gray-bg {
        background: rgb(240, 240, 240);
        /* Old browsers */
        background: -moz-linear-gradient(top, rgba(240, 240, 240, 1) 0%, rgba(184, 182, 184, 1) 100%);
        /* FF3.6+ */
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(240, 240, 240, 1)), color-stop(100%, rgba(184, 182, 184, 1)));
        /* Chrome,Safari4+ */
        background: -webkit-linear-gradient(top, rgba(240, 240, 240, 1) 0%, rgba(184, 182, 184, 1) 100%);
        /* Chrome10+,Safari5.1+ */
        background: -o-linear-gradient(top, rgba(240, 240, 240, 1) 0%, rgba(184, 182, 184, 1) 100%);
        /* Opera 11.10+ */
        background: -ms-linear-gradient(top, rgba(240, 240, 240, 1) 0%, rgba(184, 182, 184, 1) 100%);
        /* IE10+ */
        background: linear-gradient(to bottom, rgba(240, 240, 240, 1) 0%, rgba(184, 182, 184, 1) 100%);
        /* W3C */
        filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#f0f0f0', endColorstr='#b8b6b8', GradientType=0);
        /* IE6-9 */
    }
    .gray-bg-flat {
        background: rgb(240, 240, 240);
    }
    .dgray-bg {}
    .btn-add,
    .btn-remove,
    .btn-edit {
        /*background-color: rgb(201,215,239); /* Old browsers */
        /*background	: -moz-linear-gradient(top,  rgb(201,215,239) 10%, rgb(154,181,228) 80%); /* FF3.6+ */
        /*background	: -webkit-gradient(linear, left top, left bottom, color-stop(10%,rgb(201,215,239)), color-stop(80%,rgb(154,181,228))); /* Chrome,Safari4+ */
        /*background	: -webkit-linear-gradient(top,  rgb(201,215,239) 10%,rgb(154,181,228) 80%); /* Chrome10+,Safari5.1+ */
        /*background	: -o-linear-gradient(top,  rgb(201,215,239) 10%,rgb(154,181,228) 80%); /* Opera 11.10+ */
        /*background	: -ms-linear-gradient(top,  rgb(201,215,239) 10%,rgb(154,181,228) 80%); /* IE10+ */
        /*background	: linear-gradient(to bottom,  rgb(201,215,239) 10%,rgb(154,181,228) 80%); /* W3C */
        /*filter		: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c9d7ef', endColorstr='#9ab5e4',GradientType=0 ); /* IE6-9 */
        display: inline-block;
        vertical-align: middle;
        border-radius: 18px;
        border: 2px solid;
        /* rgb(34, 145, 200);*/
        font-size: 10pt;
        text-align: center;
        width: 23px;
        height: 22px;
        padding-top: 1px;
        cursor: pointer;
        /*padding-left: 1px;
		padding-right: 2px;
		padding-bottom: 1px;*/
    }
    .btn-add:hover,
    .btn-remove:hover,
    .btn-edit:hover {
        background-color: rgb(255, 120, 120);
        box-shadow: 0px 0px 0px, 0px 0px 0px, 0px 0px 0px, 0px 0px 4px rgb(80, 80, 80) inset;
        /*color		: rgb(254, 254, 254);*/
        font-weight: bold;
        height: 23px;
        padding-top: 0px;
    }
    .btn-edit img {
        margin-top: -4px;
        margin-left: -2px;
    }
    .btn-add~.btn-remove {
        display: none;
    }
    .btn-add~.btn-edit {
        display: none;
    }
    .row-controls {
        width: 55px;
        white-space: nowrap;
        opacity: 0.45;
    }
    .check-column {
        width: 25px;
    }
    .clonable:hover .row-controls {
        *visibility: visible;
        opacity: 1;
    }
    .tab-contents {
        border: 1px solid rgb(255, 220, 220);
        border-radius: 4px 4px 4px 4px;
        height: inherit;
        margin-left: auto;
        margin-right: auto;
        margin-top: -1px;
        width: 99%;
    }
    .calendar-button {
        width: 16px;
        display: inline-block;
        cursor: pointer;
        border-radius: 3px;
        border: 1px solid rgba(250, 120, 120, 0.2);
        vertical-align: middle;
    }
    .current-date,
    .caution {
        background: rgba(0, 128, 255, 51.3);
        ;
        /* browsers */
        /*font-weight	: bolder;
		background-color: rgb(250, 230, 70);
		background	: -moz-linear-gradient(top, rgb(250, 250, 150) 10%, rgb(250, 230, 70) 80%);  FF3.6+ 
		background	: -webkit-gradient(linear, left top, left bottom, color-stop(10%,rgb(250, 250, 150)), color-stop(80%,rgb(250, 230, 70)));  Chrome,Safari4+ 
		background	: -webkit-linear-gradient(top, rgb(250, 250, 150) 10%, rgb(250, 230, 70) 80%); / Chrome10+,Safari5.1+ 
		background	: -o-linear-gradient(top, rgb(250, 250, 150) 10%, rgb(250, 230, 70) 80%);  Opera 11.10+ 
		background	: -ms-linear-gradient(top, rgb(250, 250, 150) 10%, rgb(250, 230, 70) 80%); IE10+ 
		background	: linear-gradient(to bottom, rgb(250, 250, 150) 10%, rgb(250, 230, 70) 80%); W3C 
		filter		: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FAFA96', endColorstr='#FAE646',GradientType=0 );  IE6-9 */
        /*-moz-box-shadow: 0px 1px 4px -1px rgb(80, 80, 80);
		*-webkit-box-shadow: 0px 1px 4px -1px rgb(80, 80, 80);
		*box-shadow	: 0px 1px 4px -1px rgb(80, 80, 80);*/
    }
    .text-center {
        text-align: center;
    }
    .badge {
        background-color: #ccc;
        text-decoration: none;
        font-style: italic;
        padding: 0.5rem;
        /* color: #fff; */
    }
    #prin {
        height: 100%;
        width: 100%;
        overflow: auto;
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
    }
    #printable,
    #printable-dialog {
        overflow: auto;
        position: fixed;
        left: 0px;
        top: 0px;
        right: 0px;
        bottom: 0px;
    }
    #print-contents,
    #print-dialog-contents {
        margin-top: 10px;
    }
}

@PAGE {
    margin: 4mm;
    size: 210mm 297mm;
}

@media print {
    #print {
        display: none;
    }
    #print-control {
        display: none;
        visibility: hidden;
        width: 0px;
    }
    #print-control>* {
        display: none;
        visibility: hidden;
    }
    #print-contents,
    #print-dialog-contents {
        margin-top: 0;
    }
    #page-header {
        display: none;
    }
    #session_info {
        display: none;
    }
    #page-body>* {
        display: none;
    }
    #page-body>#page-contents {
        display: block;
        background-color: rgb(255, 255, 255);
    }
    #page-body>#page-contents>* {
        display: none;
    }
    #page-body>#page-contents>.prin {
        display: block;
        overflow: visible;
    }
    #page-body>.tab-contents {
        display: block;
        background-color: rgb(255, 255, 255);
    }
    #page-body>.tab-contents>.tab-submenu>* {
        display: none;
    }
    #page-body>.tab-contents>.tab-contents-view {
        display: block;
    }
    #page-body>.tab-contents>.tab-contents-view>* {
        display: none;
    }
    #page-body>.tab-contents>.tab-contents-view>.prin {
        display: block;
        overflow: visible;
    }
    /*{
		border-collapse: collapse;
		border		: none;
	}*/
    th {
        text-align: center;
        vertical-align: middle;
        cursor: pointer;
    }
    .non-prin,
    .btn-add,
    .btn-remove,
    .btn-edit {
        display: none;
        border: none;
    }
    .calendar-button {
        display: none;
    }
    .lgrad-bg {
        background: rgb(230, 230, 230);
    }
    .lgray-bg {
        background: rgb(230, 230, 230);
    }
    .gray-bg {
        background-color: rgb(230, 230, 230);
    }
}

@media (min-width: 10px) and (max-width: 300px) {
    #website_name img {
        display: none;
    }
    .blank {
        display: none;
        height: 0;
    }
}

@media (min-width: 720px) and (max-width: 6000px) {
    /*html{
		height		:98.5%;
	}*/
    #available_leave {
        *float: left;
        margin-top: 3px;
        *width: 150px;
        *height: auto;
    }
    .path-input {
        min-width: 443px;
    }
    #page-menu+.after-menu {
        left: 20%;
    }
}

@media (min-width: 1080px) {
    #website-name {
        left: 328px;
    }
}

@media (min-width: 0px) and (max-width: 1080px) {
    #website-name {
        left: 30.9%;
    }
}

@media (min-width:
/*32*/

0px) and (max-width: 721px) {
    #page-menu+.after-menu {
        left: 140px;
    }
}

@media (min-width: 0px) and (max-width: 420px) {}

html {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
}

body {
    font-family: Trebuchet MS;
    border-radius: 6px 6px 6px 6px;
}

#javascript_error {
    /*must have shadow*/
    position: absolute;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    border: 1px solid maroon;
    width: 98%;
    color: rgb(255, 255, 255);
    font-weight: bolder;
    background-color: rgb(214, 20, 20);
    box-shadow: 0px 5px 5px rgb(80, 80, 80);
}

#server-response {
    position: fixed;
    z-index: 12;
    margin-top: 14px;
    margin-right: 25px;
    right: 0;
}

#server-response>div {
    margin-left: 2px;
    margin-right: 2px;
    background-color: rgba(254, 254, 254, 0.95);
    padding: 4px 4px 4px 4px;
    overflow: auto;
    max-width: 600px;
    min-height: 22px;
    max-height: 400px;
}

#server-response .btn-close {
    position: absolute;
    /*margin-top	: -2px;*/
    top: -12px;
    right: 15px;
    padding: 0px;
    font-size: 60%;
    font-weight: bold;
    text-align: center;
}

#page-header {
    /*must have shadow*/
    color: rgb(212, 13, 8);
    border-radius: 6px 6px 0px 0px;
    height: 95px;
    position: absolute;
    right: 0;
    left: 0;
}

#page-body {
    margin-left: auto;
    margin-right: auto;
    z-index: 0;
    border-radius: 0px 0px 6px 6px;
    border-top-color: rgb(212, 13, 8);
    border-top-style: solid;
    border-top-width: 2px;
    position: absolute;
    bottom: 0;
    top: 95px;
    right: 0;
    left: 0;
    /*background-color: rgb(252, 252, 252);*/
    /*height		: 86.1%;*/
    /*position		: relative;*/
    /*top			: 6px;*/
}

#page-menu {
    /* background-color: rgb(245,245,245); */
    /*margin-right	: 1px;*/
    /*max-width		: 260px;*/
    /*position		: relative;*/
    /*text-align	: center;
	padding			: 5px 10px 5px 10px;
	padding-top		: 0.4%;
	padding-left	: 0.4%;
	padding-right	: 0.4%;*/
    font-style: bold;
    min-width: 140px;
    overflow: auto;
    position: absolute;
    top: 0;
    bottom: 0;
    width: 20%;
    z-index: 1;
}

#page-contents {
    font-family: Trebuchet MS;
    overflow: auto;
    padding: 0px 6px 0px 6px;
    -webkit-overflow-scrolling: touch;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0px;
    padding-bottom: 5%;
}

#btn-show-hide-menu {
    padding: 0;
    *width: 28px;
    *height: 65px;
    position: fixed;
    text-align: center;
    top: 55%;
    margin-top: -11px;
    margin-left: -36px;
    *font-size: 8pt;
    z-index: 2;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=35)";
    filter: alpha(opacity=35);
    -moz-opacity: 0.35;
    -khtml-opacity: 0.35;
    opacity: 0.35;
}

#btn-show-hide-menu:hover {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    -moz-opacity: 1;
    -khtml-opacity: 1;
    opacity: 1;
}

#company-logo {
    /*right			: 6%;*/
    /*margin-left	: 15px;*/
    /*margin-top	: 7px;*/
    height: 71px;
    *border: 1px solid;
}

#company-logo a {
    width: 30%;
    max-width: 320px;
}

#company-logo img {
    /*width			: 22%;
	border			: none;
	margin-left		: 8px;*/
    width: 100%;
}

#website-name,
#website-name-off {
    /*text-align	: center;
	position		: absolute;
	border			: 1px solid;
	width			: 100px;
	bottom			: 0;
	top				: 0;*/
    position: absolute;
    top: 0;
    height: 70px;
    right: 48px;
    text-align: center;
}

#website-name-off {
    left: 48px;
}

#website-name img,
#website-name-off img {
    width: 40%;
    min-width: 150px;
}

#user-name {
    position: absolute;
    top: 50px;
    right: 16px;
}

.Centerer {
    display: inline-block;
    height: 100%;
    vertical-align: middle;
}

.Centered {
    display: inline-block;
    vertical-align: middle;
    *width: 25%;
    *min-width: 100px;
    *margin-left: -200px;
}

.centered_fixed_width {
    width: 200px;
}

#session_info {
    /*must have shadow*/
    border-top-color: rgb(161, 169, 172);
    border-top-style: solid;
    border-top-width: 1px;
    border-bottom-color: rgb(161, 169, 172);
    border-bottom-style: solid;
    border-bottom-width: 1px;
    height: 22px;
    z-index: 4;
    /*background	: rgb(154, 181, 228);*/
    /*background	: rgb(10,60,145); /* Old browsers */
    /*text-align	: right;*/
    /*box-shadow	: 0px 5px 5px rgb(80, 80, 80);*/
    /*text-shadow	: 1px 1px rgb(10, 10, 10),1px 2px rgb(100, 100, 100);*/
    /*text-shadow	: -1px 0px rgba(0, 0, 0, 0.9), 
					  0px 1px rgba(0, 0, 0, 0.9),
					  1px 0px rgba(0, 0, 0, 0.9),
					  0px -1px rgba(0, 0, 0, 0.9);*/
}

.btn-link {
    padding-left: 4px;
    padding-right: 8px;
    padding-top: 0px;
    border-style: solid;
    border-width: 1px;
    /*border-color	: rgb(255, 75, 75);*/
    border-color: rgb(161, 169, 172);
    border-top: none;
    border-bottom: none;
    height: inherit;
}

.btn-browse {
    font-weight: bold;
    border: 1px solid rgb(50, 50, 50);
    padding: 4px;
    /*background-color: rgba(34, 47, 54, 0.2);
	background		: rgb(214,214,214);
	background		: -moz-linear-gradient(top, rgba(214,214,214,1) 34%, rgba(150,150,150,1) 100%);
	background		: -webkit-gradient(linear, left top, left bottom, color-stop(34%,rgba(214,214,214,1)), color-stop(100%,rgba(150,150,150,1)));
	background		: -webkit-linear-gradient(top, rgba(214,214,214,1) 34%,rgba(150,150,150,1) 100%);
	background		: -o-linear-gradient(top, rgba(214,214,214,1) 34%,rgba(150,150,150,1) 100%);
	background		: -ms-linear-gradient(top, rgba(214,214,214,1) 34%,rgba(150,150,150,1) 100%);
	background		: linear-gradient(to bottom, rgba(214,214,214,1) 34%,rgba(150,150,150,1) 100%);
	filter			: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d6d6d6', endColorstr='#969696',GradientType=0 );*/
}

.btn-browse img {
    width: 20px;
    vertical-align: middle;
    margin-top: -3px;
    margin-right: 2px;
}

.btn-browse:hover {
    cursor: pointer;
}

.btn-browse-down {
    background: rgb(150, 150, 150);
    background: -moz-linear-gradient(top, rgba(150, 150, 150, 1) 0%, rgba(214, 214, 214, 1) 76%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(150, 150, 150, 1)), color-stop(76%, rgba(214, 214, 214, 1)));
    background: -webkit-linear-gradient(top, rgba(150, 150, 150, 1) 0%, rgba(214, 214, 214, 1) 76%);
    background: -o-linear-gradient(top, rgba(150, 150, 150, 1) 0%, rgba(214, 214, 214, 1) 76%);
    background: -ms-linear-gradient(top, rgba(150, 150, 150, 1) 0%, rgba(214, 214, 214, 1) 76%);
    background: linear-gradient(to bottom, rgba(150, 150, 150, 1) 0%, rgba(214, 214, 214, 1) 76%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#969696', endColorstr='#d6d6d6', GradientType=0);
    border-color: rgb(130, 130, 130);
}

#session_info .left_aligned {
    /*border-left	: none;*/
    border-radius: 0px 8px 8px 0px;
}

#session_info .right_aligned {
    /*border-right	: none;*/
    border-radius: 8px 0px 0px 8px;
}

.float-right {
    float: right;
}

.float-left {
    float: left;
}

#session_info a {
    /*color			: rgb(212, 13, 8);*/
    font-weight: bold;
    text-decoration: none;
}

#session_info a:hover {
    text-shadow: -1px 0px rgba(134, 165, 222, 0.1), 0px 1px rgba(134, 165, 222, 0.1), 1px 0px rgba(134, 165, 222, 0.1), 0px -1px rgba(134, 165, 222, 0.1);
}

.gradient {
    background: rgb(92, 131, 208);
    /* Old browsers */
    background: -moz-linear-gradient(top, rgb(92, 131, 208) 0%, rgb(9, 59, 144) 100%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgb(92, 131, 208)), color-stop(100%, rgb(9, 59, 144)));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgb(92, 131, 208) 0%, rgb(9, 59, 144) 100%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgb(92, 131, 208) 0%, rgb(9, 59, 144) 100%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, rgb(92, 131, 208) 0%, rgb(9, 59, 144) 100%);
    /* IE10+ */
    background: linear-gradient(to bottom, rgb(92, 131, 208) 0%, rgb(9, 59, 144) 100%);
    /* W3C */
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#5c83d0', endColorstr='#093b90', GradientType=0);
    /* IE6-9 */
}

#available_leave p {
    font-size: 10pt;
    border-bottom: 1px solid silver;
    margin-top: 1px;
    cursor: default;
}

.duration-time {
    display: none;
}

.duration-time input {
    width: 30px;
}

.duration-days {
    width: 50px;
}

.fx-easing {
    -webkit-transition: all 200ms ease-in-out;
    -moz-transition: all 200ms ease-in-out;
    -o-transition: all 200ms ease-in-out;
    -ms-transition: all 200ms ease-in-out;
}

.hidden {
    display: none;
}

#print {
    position: absolute;
    right: 12px;
    margin-top: 16px;
    margin-bottom: 0.7%;
    z-index: 4;
    border-radius: 4px 4px 18px 18px;
    border-top: none;
    text-align: center;
    width: 36px;
    padding-top: 5px;
}

#print img {
    width: 20px;
    border-radius: 14px;
    padding: 3px;
    border: 1px solid rgba(34, 47, 57, 0.35);
}

#print:hover {
    transform: scale(1.2);
}

#print:hover img {
    background-color: rgb(244, 244, 245);
    border: 1px solid rgba(34, 47, 57, 0.35);
    -webkit-box-shadow: 0px 0px 4px 2px rgb(134, 147, 157);
    -moz-box-shadow: 0px 0px 4px 2px rgb(134, 147, 157);
    box-shadow: 0px 0px 4px 2px rgb(134, 147, 157);
    transform: scale(1.2);
}

#print a:active img {
    background-color: rgb(255, 120, 120);
    box-shadow: 0px 2px 5px rgb(80, 80, 80) inset;
}


/*#print-control{
	width			: inherit;
	margin-left		: auto;
	margin-right	: auto;
	color			: rgb(255, 255, 255);
	font-weight		: bold;
	padding			: 4px 0px 3px 0px;
	position		: absolute;
	background-color: rgba(0, 0, 0, 0.2);
	z-index			: 1;
}*/

#printable,
#printable-dialog {
    background-color: rgba(255, 255, 255, 0.95);
    z-index: 5;
    display: none;
}

#print-control {
    /*width			: inherit;*/
    margin-left: auto;
    margin-right: auto;
    left: 0px;
    right: 20px;
    top: 0px;
    color: rgb(255, 255, 255);
    font-weight: bold;
    padding: 5px 0px 5px 0px;
    position: fixed;
    background-color: rgba(0, 0, 0, 0.8);
    
}

#print-control * {
    margin: 0px 4px 0px 4px;
}

#print-control span {
    display: inline-block;
    min-width: 60px;
    text-align: center;
    border-radius: 4px;
    cursor: pointer;
    border: 1px solid rgb(212, 13, 8);
}

#print-control * {
    margin: 0px 4px 0px 4px;
}

#print-control span {
    display: inline-block;
    min-width: 60px;
    text-align: center;
    border-radius: 4px;
    cursor: pointer;
    border: 1px solid rgb(212, 13, 8);
}

#prin {
    left: 0;
    top: 0;
    background-color: rgba(255, 255, 255, 0.95);
    position: absolute;
    display: none;
    z-index: 11;
}

.amount {
    width: 90px;
}

.fixed-table-container{
    position:relative;
}
.fixed-table-header{
    position:absolute;
    top:0;
}
.fixed-table-body{
    height:60vh;
    overflow:scroll;
}


/*__________________CALENDAR STYLES__________________*/

#year_calendar {
    text-align: center;
}
 
.calendar-month {
    background-color: rgb(252, 251, 255);
    border: 1px solid silver;
    border-radius: 16px 16px 16px 16px;
    cursor: default;
    font-size: 11pt;
    margin: 6px;
    padding: 2px 2px 4px 2px;
    width: 220px;
    opacity: 0.98;
}

.date-picker {
    display: none;
    position: absolute;
    z-index: 2;
}

#year_calendar .calendar-month {
    display: inline-block;
    position: relative;
    vertical-align: middle;
}

.calendar-heading {
    /*must have shadow*/
    /*background 	: rgb(89,141,219); /* Old browsers */
    /*background 	: -moz-linear-gradient(top,  rgba(89,141,219,1) 5%, rgba(40,85,155,1) 80%); /* FF3.6+ */
    /*background 	: -webkit-gradient(linear, left top, left bottom, color-stop(5%,rgba(89,141,219,1)), color-stop(80%,rgba(40,85,155,1))); /* Chrome,Safari4+ */
    /*background 	: -webkit-linear-gradient(top,  rgba(89,141,219,1) 5%,rgba(40,85,155,1) 80%); /* Chrome10+,Safari5.1+ */
    /*background 	: -o-linear-gradient(top,  rgba(89,141,219,1) 5%,rgba(40,85,155,1) 80%); /* Opera 11.10+ */
    /*background 	: -ms-linear-gradient(top,  rgba(89,141,219,1) 5%,rgba(40,85,155,1) 80%); /* IE10+ */
    /*background 	: linear-gradient(to bottom,  rgba(89,141,219,1) 5%,rgba(40,85,155,1) 80%); /* W3C */
    /*filter 		: progid:DXImageTransform.Microsoft.gradient( startColorstr='#598ddb', endColorstr='#28559b',GradientType=0 ); /* IE6-9 */
    border: 1px solid rgb(255, 120, 120);
    color: rgb(235, 235, 235);
    *text-align: center;
    padding-bottom: 1px;
    border-radius: 14px;
    font-weight: bold;
    min-height: 22px;
    padding: 1px 2px 1px 2px;
}

.light-gradient {
    background: rgb(89, 141, 219);
    /* Old browsers */
    background: -moz-linear-gradient(top, rgba(89, 141, 219, 1) 5%, rgba(0, 85, 221, 1) 80%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(5%, rgba(89, 141, 219, 1)), color-stop(80%, rgba(0, 85, 221, 1)));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgba(89, 141, 219, 1) 5%, rgba(0, 85, 221, 1) 80%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgba(89, 141, 219, 1) 5%, rgba(0, 85, 221, 1) 80%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, rgba(89, 141, 219, 1) 5%, rgba(0, 85, 221, 1) 80%);
    /* IE10+ */
    background: linear-gradient(to bottom, rgba(89, 141, 219, 1) 5%, rgba(0, 85, 221, 1) 80%);
    /* W3C */
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#598ddb', endColorstr='#0055dd', GradientType=0);
    /* IE6-9 */
}

.navigation-bar {
    /*background	: -moz-linear-gradient(top,  rgb(100,140,210) 0%, rgb(50,90,175) 100%); /* FF3.6+ */
    /*background	: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(100,140,210)), color-stop(100%,rgb(50,90,175))); /* Chrome,Safari4+ */
    /*background	: -webkit-linear-gradient(top,  rgb(100,140,210) 0%,rgb(50,90,175) 100%); /* Chrome10+,Safari5.1+ */
    /*background	: -o-linear-gradient(top,  rgb(100,140,210) 0%,rgb(50,90,175) 100%); /* Opera 11.10+ */
    /*background	: -ms-linear-gradient(top,  rgb(100,140,210) 0%,rgb(50,90,175) 100%); /* IE10+ */
    /*background	: linear-gradient(to bottom,  rgb(100,140,210) 0%,rgb(50,90,175) 100%); /* W3C */
    /*filter		: progid:DXImageTransform.Microsoft.gradient( startColorstr='#648cd2', endColorstr='#325aaf',GradientType=0 ); /* IE6-9 */
    border-left-color: rgb(125, 158, 217);
    text-align: center;
    width: inherit;
    margin-left: auto;
    margin-right: auto;
    padding-bottom: 3px;
    color: rgb(0, 0, 0);
}

.navigation-bar a {
    clear: both;
    text-decoration: none;
    color: rgb(0, 0, 0);
    display: inline-block;
    vertical-align: middle;
}

.btn-prev {
    /*float			: left;
	background-color: rgb(100,150,250);*/
    display: inline-block;
    vertical-align: middle;
    position: relative;
}

.btn-next {
    /*float			: right;*/
    /*background-color: rgb(100,150,250);*/
    display: inline-block;
    vertical-align: middle;
    position: relative;
    margin-left: auto;
    margin-right: 0;
}

.navigation-menu {
    display: inline-block;
    vertical-align: middle;
    text-align: center;
    padding: 4px 8px 4px 8px;
    border-radius: 4px;
    margin-top: 4px;
    margin-left: auto;
    margin-right: auto;
    box-shadow: 1px 1px 5px 1px rgb(80, 80, 80) inset;
    -webkit-box-shadow: 1px 1px 5px 1px rgb(80, 80, 80) inset;
    /*border		: 1px solid rgb(125, 158, 217);
	color			: rgb(250, 250, 255);
	min-height		: 29px;
	padding			: 1px 2px 1px 2px;*/
    font-weight: bold;
    border-radius: 16px;
}

.notification-count {
    background: -moz-linear-gradient(top, rgb(100, 140, 210) 0%, rgb(50, 90, 175) 100%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgb(100, 140, 210)), color-stop(100%, rgb(50, 90, 175)));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgb(100, 140, 210) 0%, rgb(50, 90, 175) 100%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgb(100, 140, 210) 0%, rgb(50, 90, 175) 100%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, rgb(100, 140, 210) 0%, rgb(50, 90, 175) 100%);
    /* IE10+ */
    background: linear-gradient(to bottom, rgb(100, 140, 210) 0%, rgb(50, 90, 175) 100%);
    /* W3C */
    vertical-align: super;
    font-size: 8pt;
    color: rgb(255, 150, 150);
    font-weight: bold;
    border: 1px solid rgb(125, 158, 217);
    padding-left: 3px;
    padding-right: 3px;
    border-radius: 6px;
    position: absolute;
    margin-top: -6px;
    margin-left: 1px;
}

#navigation-prev {
    margin-right: 2px;
}

#navigation-next {
    margin-left: 2px;
}

.calendar-button:hover {
    border: 1px solid rgb(250, 120, 120);
}

.navigation-button {
    /*must have shadow*/
    display: inline-block;
    border: 1px solid rgb(230, 230, 230);
    border-radius: 12px;
    font-weight: bold;
    text-align: center;
    width: 22px;
    /*box-shadow	: 0px 2px 5px rgb(80, 80, 80);*/
    margin-top: 2px;
    margin-bottom: 2px;
    height: 22px;
    line-height: 22px;
    vertical-align: middle;
}

.navigation-button:hover {
    cursor: pointer;
    border-color: rgb(255, 120, 120);
}

.navigation-button:active {
    box-shadow: 0px 2px 5px rgb(80, 80, 80) inset;
    background-color: rgb(255, 120, 120);
    border-color: rgb(134, 165, 222);
}

.calendar-title {
    display: inline-block;
    text-align: center;
    min-width: 100px;
    cursor: default;
    padding-top: 2px;
    /*border		: 1px solid rgb(240, 160, 180);*/
    position: relative;
    width: 160px;
    height: 100%;
    vertical-align: middle;
    border-radius: 12px;
}

.calendar-title select,
.calendar-title img {
    display: none;
    outline: none;
    font-size: 11pt;
    vertical-align: middle;
}

.calendar-title select {
    border: 1px solid;
    border-right-width: 3px;
}

.calendar-title input {
    /*height		: 22px;*/
    text-align: center;
    font-size: 9pt;
}

.calendar-title div {
    display: inline-block;
    margin-bottom: 0;
}

.date-picker .calendar-title div {
    display: none;
}

.date-picker .calendar-title select,
.date-picker .calendar-title img {
    display: inline-block;
    cursor: pointer;
    vertical-align: middle;
}


/*
.calendar-title:hover select, .calendar-title:hover img{
	display			: inline-block;
	vertical-align	: middle;
	cursor			: pointer;
}*/

.date-picker .calendar-title:hover {
    cursor: move;
}

.calendar-week-days {
    font-weight: bold;
    text-align: center;
    margin-top: 2px;
    border-bottom: 1px solid rgb(0, 0, 0);
    width: 210px;
    margin-left: auto;
    margin-right: auto;
}

.calendar-dates {
    margin-top: 2px;
    width: 210px;
    margin-left: auto;
    margin-right: auto;
}

.week-day {
    display: inline-block;
    width: 22px;
    margin-top: 2px;
    margin-left: 4px;
    margin-right: 4px;
    border-radius: 8px;
    vertical-align: middle;
    text-align: center;
}

.clickable-day {
    cursor: pointer;
    border-bottom: 2px solid rgb(252, 251, 255);
}

.clickable-day:hover {
    *font-weight: bold;
    border-bottom-color: rgb(250, 115, 115);
    color: rgb(250, 115, 115);
}

.selected-date {
    font-weight: bold;
    border-bottom: 2px solid rgb(250, 115, 115);
    color: rgb(250, 115, 115);
}

.weekend {
    background-color: rgba(153, 255, 51, 3);
    ;
    *background-color: rgb(250, 250, 250);
    /* Old browsers */
    *background: -moz-linear-gradient(top, rgb(250, 250, 250) 10%, rgb(245, 245, 245) 80%);
    /* FF3.6+ */
    *background: -webkit-gradient(linear, left top, left bottom, color-stop(10%, rgb(250, 250, 250)), color-stop(80%, rgb(245, 245, 245)));
    /* Chrome,Safari4+ */
    *background: -webkit-linear-gradient(top, rgb(250, 250, 250) 10%, rgb(245, 245, 245) 80%);
    /* Chrome10+,Safari5.1+ */
    *background: -o-linear-gradient(top, rgb(250, 250, 250) 10%, rgb(245, 245, 245) 80%);
    /* Opera 11.10+ */
    *background: -ms-linear-gradient(top, rgb(250, 250, 250) 10%, rgb(245, 245, 245) 80%);
    /* IE10+ */
    *background: linear-gradient(to bottom, rgb(250, 250, 240) 10%, rgb(245, 245, 245) 80%);
    /* W3C */
    *filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#FAFAFA', endColorstr='#F5F5F5', GradientType=0);
    /* IE6-9 */
}

.success,
.approved {
    background: rgba(153, 153, 255, 0.7);
    /* Old browsers */
    filter: progid: DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#9999FF', endColorstr='#9999FF');
    /* IE */
    /*border		: 1px solid rgb(146, 208, 80);*/
    /*background	: -moz-linear-gradient(top, rgb(170,250,120) 10%, rgb(146, 208, 80) 80%); /* FF3.6+ */
    /*background	: -webkit-gradient(linear, left top, left bottom, color-stop(10%,rgb(170,250,120)), color-stop(80%,rgb(146, 208, 80))); /* Chrome,Safari4+ */
    /*background	: -webkit-linear-gradient(top, rgb(170,250,120) 10%, rgb(146, 208, 80) 80%); /* Chrome10+,Safari5.1+ */
    /*background	: -o-linear-gradient(top, rgb(170,250,120) 10%, rgb(146, 208, 80) 80%); /* Opera 11.10+ */
    /*background	: -ms-linear-gradient(top, rgb(170,250,120) 10%, rgb(146, 208, 80) 80%); /* IE10+ */
    /*background	: linear-gradient(to bottom, rgb(170,250,120) 10%, rgb(146, 208, 80) 80%); /* W3C */
    /*filter		: progid:DXImageTransform.Microsoft.gradient( startColorstr='#AAFA78', endColorstr='#92D050',GradientType=0 ); /* IE6-9 */
}

.rejected,
.failed {
    background: rgba(212, 13, 8, 0.6);
    /* Old browsers */
    /*border			: 1px solid rgb(212, 13, 8);*/
    /*background	: -moz-linear-gradient(top,  rgb(255,147,147) 26%, rgb(250,55,55) 100%); /* FF3.6+ */
    /*background	: -webkit-gradient(linear, left top, left bottom, color-stop(26%,rgb(255,147,147)), color-stop(100%,rgb(250,55,55))); /* Chrome,Safari4+ */
    /*background	: -webkit-linear-gradient(top,  rgb(255,147,147) 26%,rgb(250,55,55) 100%); /* Chrome10+,Safari5.1+ */
    /*background	: -o-linear-gradient(top,  rgb(255,147,147) 26%,rgb(250,55,55) 100%); /* Opera 11.10+ */
    /*background	: -ms-linear-gradient(top,  rgb(255,147,147) 26%,rgb(250,55,55) 100%); /* IE10+ */
    /*background	: linear-gradient(to bottom,  rgb(255,147,147) 26%,rgb(250,55,55) 100%); /* W3C */
    /*filter		: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff9393', endColorstr='#fa3737',GradientType=0 ); /* IE6-9 */
}

.warning,
.pending {
    background: rgba(255, 51, 51, 51.3);
    ;
    /* browsers */
    filter: progid: DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#e60000', endColorstr='#e60000');
    /* IE */
    /*background		: rgba(255,51,51);/* Old browsers */
    /*border			: 1px solid rgb(255, 165, 5);
	padding			: 0px 2px;*/
    /*background	: -moz-linear-gradient(top, rgb(250, 210, 100) 10%, rgb(255, 165, 5) 80%); /* FF3.6+ */
    /*background	: -webkit-gradient(linear, left top, left bottom, color-stop(10%,rgb(250, 210, 100)), color-stop(80%,rgb(255, 165, 5))); /* Chrome,Safari4+ */
    /*background	: -webkit-linear-gradient(top, rgb(250, 210, 100) 10%, rgb(255, 165, 5) 80%); /* Chrome10+,Safari5.1+ */
    /*background	: -o-linear-gradient(top, rgb(250, 210, 100) 10%, rgb(255, 165, 5) 80%); /* Opera 11.10+ */
    /*background	: -ms-linear-gradient(top, rgb(250, 210, 100) 10%, rgb(255, 165, 5) 80%); /* IE10+ */
    /*background	: linear-gradient(to bottom, rgb(250, 210, 100) 10%, rgb(255, 165, 5) 80%); /* W3C */
    /*filter		: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FAD264', endColorstr='#FFA505',GradientType=0 ); /* IE6-9 */
}

.holiday {
    background: rgba(255, 165, 5, 0.9);
    /*background		: -moz-radial-gradient(center, ellipse cover,  rgba(220,220,220,1) 0%, rgba(213,213,213,1) 50%, rgba(201,201,201,1) 100%);
	background		: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,rgba(220,220,220,1)), color-stop(50%,rgba(213,213,213,1)), color-stop(100%,rgba(201,201,201,1)));
	background		: -webkit-radial-gradient(center, ellipse cover,  rgba(220,220,220,1) 0%,rgba(213,213,213,1) 50%,rgba(201,201,201,1) 100%);
	background		: -o-radial-gradient(center, ellipse cover,  rgba(220,220,220,1) 0%,rgba(213,213,213,1) 50%,rgba(201,201,201,1) 100%);
	background		: -ms-radial-gradient(center, ellipse cover,  rgba(220,220,220,1) 0%,rgba(213,213,213,1) 50%,rgba(201,201,201,1) 100%);
	background		: radial-gradient(ellipse at center,  rgba(220,220,220,1) 0%,rgba(213,213,213,1) 50%,rgba(201,201,201,1) 100%);
	filter			: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dcdcdc', endColorstr='#c9c9c9',GradientType=1 );*/
    /*color			: rgb(212, 13, 8);	*/
}

.absent {
    background: rgb(200, 200, 200);
    /* Old browsers */
    background: -moz-linear-gradient(top, rgb(200, 200, 200) 10%, rgb(150, 150, 150) 80%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(10%, rgb(200, 200, 200)), color-stop(80%, rgb(150, 150, 150)));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgb(200, 200, 200) 10%, rgb(150, 150, 150) 80%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgb(200, 200, 200) 10%, rgb(150, 150, 150) 80%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, rgb(200, 200, 200) 10%, rgb(150, 150, 150) 80%);
    /* IE10+ */
    background: linear-gradient(to bottom, rgb(200, 200, 200) 10%, rgb(150, 150, 150) 80%);
    /* W3C */
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#c8c8c8', endColorstr='#969696', GradientType=0);
    /* IE6-9 */
    color: rgb(50, 50, 50);
}


/*__________________CALENDAR STYLES END__________________*/

.dialog {
    background: rgba(166, 169, 171);
    border: 1px solid rgb(34, 47, 54);
    border-radius: 8px 8px 8px 8px;
    cursor: default;
    display: none;
    margin-left: auto;
    margin-right: auto;
    padding: 3px;
    position: absolute;
    z-index: 2;
}

#formula-list {
    right: 40px;
    z-index: 4;
    width: 220px;
    position: fixed;
}

.inherit-width {
    width: 100%;
}

.aboutdialog {
    font-size: 10pt;
}

.opendialog {
    width: 320px;
}

.aboutdialog,
.claimtypesdialog,
.companydialog,
.companydialogall,
.leavetypesdialog,
.paytypesdialog {
    width: 362px;
}

.leavetypesdialog {
    width: 400px !important;
}

.claimtypesdialog,
.paytypesdialog {
    width: 700px !important;
    overflow: hidden;
}

.messagesdialog,
.employeesdialog {
    width: 540px;
}

.TransactionDetailDialog {
    width: 1000px;
}

.Transdetailtable {
    width: 90%;
}

.TransDetailDialItem {
    overflow: auto !important;
    height: 100px !important;
    min-width: 250px !important;
}

.changeCompaniesDialog {
    width: 300px;
}

.changeCompaniesDialogContents {
    height: 140px!important;
    padding-top: 25px;
}

.focused-dialog {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    -moz-opacity: 1;
    -khtml-opacity: 1;
    opacity: 1;
    z-index: 12;
}

.focused-dialog .dialog-title {
    font-weight: bolder;
}

.dialog-title {
    font-size: 10pt;
    padding: 4px;
    border-radius: 6px 6px 0px 0px;
    margin-bottom: 4px;
    padding: 6px;
}

.btn-close {
    /*background 	: rgb(89,141,219); /* Old browsers */
    /*background 	: -moz-linear-gradient(top,  rgba(89,141,219,1) 5%, rgba(40,85,155,1) 80%); /* FF3.6+ */
    /*background 	: -webkit-gradient(linear, left top, left bottom, color-stop(5%,rgba(89,141,219,1)), color-stop(80%,rgba(40,85,155,1))); /* Chrome,Safari4+ */
    /*background 	: -webkit-linear-gradient(top,  rgba(89,141,219,1) 5%,rgba(40,85,155,1) 80%); /* Chrome10+,Safari5.1+ */
    /*background 	: -o-linear-gradient(top,  rgba(89,141,219,1) 5%,rgba(40,85,155,1) 80%); /* Opera 11.10+ */
    /*background 	: -ms-linear-gradient(top,  rgba(89,141,219,1) 5%,rgba(40,85,155,1) 80%); /* IE10+ */
    /*background 	: linear-gradient(to bottom,  rgba(89,141,219,1) 5%,rgba(40,85,155,1) 80%); /* W3C */
    /*filter 		: progid:DXImageTransform.Microsoft.gradient( startColorstr='#598ddb', endColorstr='#28559b',GradientType=0 ); /* IE6-9 */
    border-radius: 15px;
    border-width: 2px;
    color: rgb(235, 235, 255);
    float: right;
    width: 24px;
    font-size: 10pt;
    font-weight: 1px;
    height: 24px;
    display: inline-block;
    vertical-align: middle;
    text-align: center;
    padding: 0px;
    /*margin-right 	: 3px;*/
}

.btn-close:hover {
    color: rgb(250, 56, 86);
}

.btn-close:active {
    color: rgb(255, 255, 255);
    font-size: 8pt;
}

.dialog-message {
    background-color: rgba(230, 230, 230, 0.5);
    border: 1px solid silver;
    /*border-top-color: rgb(134, 165, 222);
	border-top-style: solid; 
	border-top-width: 1px;*/
    max-height: 320px;
    overflow: auto;
    padding-left: 4px;
    padding-right: 4px;
}

.dialog-message-icon {
    /*text-align	: center;
	border-style	: solid;
	border-width	: 2px;
	border-color	: black;*/
    margin-top: 4px;
}

.dialog-message img {
    width: 270px;
}


/*.shadow{
	background		: -webkit-radial-gradient(rgb(150,150,150) 10%, rgb(250, 250, 250) 80%); /* Safari *
	background		: -o-radial-gradient(rgb(150,150,150) 10%, rgb(250, 250, 250) 80%); /* For Opera 11.1 to 12.0 *
	background		: -moz-radial-gradient(rgb(150,150,150) 10%, rgb(250, 250, 250) 80%); /* For Firefox 3.6 to 15 *
	background		: linear-gradient(rgb(150,150,150) 10%, rgb(250, 250, 250) 80%);
	height			: 8px;
	margin-bottom	: -1px;
	margin-left		: auto;
	margin-right	: auto;
	width			: 99.2%;
}*/

.opendialog-path {
    margin-bottom: 4px;
    margin-top: 4px;
    border: 1px solid rgb(201, 215, 239);
    padding-right: 2px;
    background-color: rgb(250, 250, 250);
    height: 20px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.opendialog-current-path {
    border: none;
    outline: none;
    background-color: rgb(250, 250, 250);
    width: 286px;
    text-overflow: ellipsis;
}

.btn-back {
    padding: 0px 6px 1px 6px;
    border-right: 2px solid rgb(201, 215, 239);
    float: left;
    margin-right: 2px;
    background-color: rgb(201, 215, 239);
}

.btn-back:hover {
    cursor: pointer;
    background: rgb(235, 241, 246);
    /* Old browsers */
    background: -moz-linear-gradient(top, rgba(235, 241, 246, 1) 0%, rgba(171, 211, 238, 1) 50%, rgba(137, 195, 235, 1) 51%, rgba(213, 235, 251, 1) 100%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(235, 241, 246, 1)), color-stop(50%, rgba(171, 211, 238, 1)), color-stop(51%, rgba(137, 195, 235, 1)), color-stop(100%, rgba(213, 235, 251, 1)));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgba(235, 241, 246, 1) 0%, rgba(171, 211, 238, 1) 50%, rgba(137, 195, 235, 1) 51%, rgba(213, 235, 251, 1) 100%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgba(235, 241, 246, 1) 0%, rgba(171, 211, 238, 1) 50%, rgba(137, 195, 235, 1) 51%, rgba(213, 235, 251, 1) 100%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, rgba(235, 241, 246, 1) 0%, rgba(171, 211, 238, 1) 50%, rgba(137, 195, 235, 1) 51%, rgba(213, 235, 251, 1) 100%);
    /* IE10+ */
    background: linear-gradient(to bottom, rgba(235, 241, 246, 1) 0%, rgba(171, 211, 238, 1) 50%, rgba(137, 195, 235, 1) 51%, rgba(213, 235, 251, 1) 100%);
    /* W3C */
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#ebf1f6', endColorstr='#d5ebfb', GradientType=0);
    /* IE6-9 */
    font-weight: bold;
}

.dialog-contents {
    /*border 		: 1px solid rgb(201,215,239);*/
    border: 1px solid rgb(34, 47, 54);
    overflow: auto;
    height: 280px;
    margin-bottom: 4px;
    background-color: rgb(250, 250, 250);
}

.opendialog-folder {
    padding-left: 4px;
    padding-right: 4px;
    overflow: hidden;
    white-space: nowrap;
    *text-overflow: ellipsis;
}

.opendialog-folder:hover {
    background-color: rgb(109, 186, 242);
    cursor: pointer;
    display: block;
    /*border		: 1px solid rgb(255, 255, 255);*/
}

.selec:hover {
    background-color: rgb(109, 186, 242);
    cursor: pointer;
}

.opendialog-folder * {
    display: inline-block;
    vertical-align: middle;
}

.folder-name {
    overflow: hidden;
    text-overflow: ellipsis;
}

.dialog-controls {
    text-align: center;
}

.dialog-controls input {
    width: 55px;
    padding-left: 0px;
    padding-right: 0px;
    /*text-align		: center;*/
}

.dialog-textarea {
    max-width: 150px;
    min-width: 150px;
    min-height: 220px;
    height: 45px;
    vertical-align: top;
}

.viewdescription-textarea {
    max-width: 200px;
    min-width: 200px;
    min-height: 80px;
    height: 80px;
    vertical-align: top;
    overflow: scroll;
}

.use-default,
.reload {
    font-size: 9pt;
    display: block;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    text-decoration: none;
    /*border 		: 1px solid rgb(201,215,239);*/
    width: 40%;
    border-radius: 35px;
}

.use-default:hover,
.reload:hover {
    text-decoration: underline;
}

.input-status {
    /*visibility		: hidden;*/
    display: none;
}

textarea:focus+.input-status {
    /*visibility		: visible;*/
    display: block;
}

.selected {
    /*background	: rgb(193,226,255); /* Old browsers */
    /*background	: -moz-linear-gradient(top,  rgba(193,226,255,1) 0%, rgba(109,186,242,1) 100%); /* FF3.6+ */
    /*background	: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(193,226,255,1)), color-stop(100%,rgba(109,186,242,1))); /* Chrome,Safari4+ */
    /*background	: -webkit-linear-gradient(top,  rgba(193,226,255,1) 0%,rgba(109,186,242,1) 100%); /* Chrome10+,Safari5.1+ */
    /*background	: -o-linear-gradient(top,  rgba(193,226,255,1) 0%,rgba(109,186,242,1) 100%); /* Opera 11.10+ */
    /*background	: -ms-linear-gradient(top,  rgba(193,226,255,1) 0%,rgba(109,186,242,1) 100%); /* IE10+ */
    /*background	: linear-gradient(to bottom,  rgba(193,226,255,1) 0%,rgba(109,186,242,1) 100%); /* W3C */
    /*filter		: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c1e2ff', endColorstr='#6dbaf2',GradientType=0 ); /* IE6-9 */
    font-weight: bold;
    background-color: rgb(0, 64, 128);
    color: rgb(255, 255, 255);
}

.control-panel {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    /*min-width		: 280px;
	*max-width		: 280px;
	*display		: block;
	*border			: 1px solid;*/
    border-radius: 8px;
    padding: 6px 6px 5px 6px;
    z-Index: 1;
}

.control-panel span {
    /*border		: 1px solid rgb(50, 90, 206);
	*border-radius	: 0px 0px 6px 6px;
	*padding-top	: 2px;*/
    display: inline-block;
}

.control-field {
    min-width: 240px;
    height: 24px;
    font-weight: bold;
    margin-bottom: 4px;
    border: 1px solid rgb(245, 245, 245);
}

.control-button {
    width: 28px;
    cursor: pointer;
    border-radius: 6px;
    /*border		: 1px solid;
	padding			: 2px;*/
    border: 1px solid rgb(34, 47, 54);
    background: rgb(166, 169, 171);
}

.control-link:active {
    border: 2px solid red;
}

.control-button:hover {
    background: rgb(166, 169, 171);
    background: -moz-linear-gradient(top, rgba(166, 169, 171, 1) 0%, rgba(201, 201, 201, 1) 50%, rgba(166, 169, 171, 1) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(166, 169, 171, 1)), color-stop(50%, rgba(201, 201, 201, 1)), color-stop(100%, rgba(166, 169, 171, 1)));
    background: -webkit-linear-gradient(top, rgba(166, 169, 171, 1) 0%, rgba(201, 201, 201, 1) 50%, rgba(166, 169, 171, 1) 100%);
    background: -o-linear-gradient(top, rgba(166, 169, 171, 1) 0%, rgba(201, 201, 201, 1) 50%, rgba(166, 169, 171, 1) 100%);
    background: -ms-linear-gradient(top, rgba(166, 169, 171, 1) 0%, rgba(201, 201, 201, 1) 50%, rgba(166, 169, 171, 1) 100%);
    background: linear-gradient(to bottom, rgba(166, 169, 171, 1) 0%, rgba(201, 201, 201, 1) 50%, rgba(166, 169, 171, 1) 100%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#a6a9ab', endColorstr='#a6a9ab', GradientType=0);
}

.avatar {
    border: 1px solid black;
    margin: 0px auto 0px auto;
    padding: 2px;
    width: 220px;
    height: 290px;
}

.avatar-img {
    height: 265px;
    border: 1px solid black;
    margin: 0px auto 0px auto;
    background-color: rgb(240, 245, 245);
}

.avatar-img img {
    display: block;
    width: 100%;
    height: 100%;
}

.avatar-controls {
    height: 22px;
    width: 80px;
    /*border			: 1px solid black;*/
    margin: -1px 0px 0px auto;
    text-align: center;
    border: 1px solid;
    /*padding-right	: 12px;*/
    border-radius: 0px 0px 4px 4px;
}

.avatar-controls a img,
.avatar-controls a:visited img {
    border: 1px solid rgb(0, 0, 0)/*rgb(9,59,144)*/
    ;
    border-bottom: 1px solid rgb(9, 59, 144);
}

.avatar-controls a:active img {
    background-color: rgb(255, 125, 125);
}

.avatar-button {
    /*background	: rgb(92,131,208); /* Old browsers */
    /*background	: -moz-linear-gradient(top,  rgb(92,131,208) 0%, rgb(9,59,144) 100%); /* FF3.6+ */
    /*background	: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(92,131,208)), color-stop(100%,rgb(9,59,144))); /* Chrome,Safari4+ */
    /*background	: -webkit-linear-gradient(top,  rgb(92,131,208) 0%,rgb(9,59,144) 100%); /* Chrome10+,Safari5.1+ */
    /*background	: -o-linear-gradient(top,  rgb(92,131,208) 0%,rgb(9,59,144) 100%); /* Opera 11.10+ */
    /*background	: -ms-linear-gradient(top,  rgb(92,131,208) 0%,rgb(9,59,144) 100%); /* IE10+ */
    /*background	: linear-gradient(to bottom,  rgb(92,131,208) 0%,rgb(9,59,144) 100%); /* W3C */
    /*filter		: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5c83d0', endColorstr='#093b90',GradientType=0 ); /* IE6-9 */
    width: 16px;
    margin: 1px -1px 1px -1px;
    border-radius: 9px 9px 0px 0px;
    padding: 2px;
    border: 1px solid/*rgb(9,59,144)*/
    ;
    border-bottom-color: 1px solid rgb(9, 59, 144);
}

.avatar-button:hover {
    /*background	: none;*/
    /*border-bottom-color: rgb(0, 0, 0);*/
    cursor: pointer;
}

.disabled {
    zoom: 1;
    filter: alpha(opacity=20);
    opacity: 0.2;
}

.disabled:hover {
    border-bottom-color: rgb(0, 0, 0);
    cursor: not-allowed;
}

#avatar-upload {}

#avatar-camera {}

#avatar-config,
#avatar-snap-save,
#avatar-back {
    display: none;
}

#avatar-path {
    display: none;
}

#main-contents-bg {
    position: fixed;
    width: 81.3%;
    height: 83.4%;
    background: white;
    opacity: 0.6;
    z-index: -1;
    margin-left: -10px;
}

#login-img {
    text-align: center;
    height: 20px;
    margin-top: 5px;
}

#version {
    display: block;
    z-index: 2;
    font-size: 8pt;
    font-weight: bolder;
    text-align: right;
}

.page-title {
    /*background	: rgb(92,131,208); /* Old browsers */
    /*background	: -moz-linear-gradient(top,  rgb(92,131,208) 0%, rgb(9,59,144) 100%); /* FF3.6+ */
    /*background	: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(92,131,208)), color-stop(100%,rgb(9,59,144))); /* Chrome,Safari4+ */
    /*background	: -webkit-linear-gradient(top,  rgb(92,131,208) 0%,rgb(9,59,144) 100%); /* Chrome10+,Safari5.1+ */
    /*background	: -o-linear-gradient(top,  rgb(92,131,208) 0%,rgb(9,59,144) 100%); /* Opera 11.10+ */
    /*background	: -ms-linear-gradient(top,  rgb(92,131,208) 0%,rgb(9,59,144) 100%); /* IE10+ */
    /*background	: linear-gradient(to bottom,  rgb(92,131,208) 0%,rgb(9,59,144) 100%); /* W3C */
    /*filter		: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5c83d0', endColorstr='#093b90',GradientType=0 ); /* IE6-9 */
    background: rgb(34, 47, 54);
    border-radius: 5px 5px 0 0;
    text-align: center;
    min-width: 170px;
    margin-top: 10px;
    padding: 1px 0px 1px 0px;
    font-family: Arial;
}

.page-title+* {
    margin-top: 10px;
}

.page-title div {
    /*border		: 1px solid rgb(125, 128, 117);*/
    border-radius: 2px 2px 8px 8px;
    min-width: 110px;
    width: 290px;
    margin-left: auto;
    margin-right: auto;
    /*text-shadow 	: 0px 0px 5px rgba(215, 213, 215, 1);
	box-shadow		: 1px 1px 5px 1px rgb(80, 80, 80) inset;
	-webkit-box-shadow: 1px 1px 5px 1px rgb(80, 80, 80) inset;*/
    padding-top: 4px;
    padding-bottom: 4px;
    padding-left: 6px;
    padding-right: 6px;
    color: rgb(250, 250, 255);
    font-weight: bold;
    font-size: 10pt;
}

.collapsed-header {
    /*border-left-color: rgb(125, 158, 217);*/
    /*border		: 1px solid rgb(125, 125, 125);*/
    border-radius: 8px 8px 8px 8px;
    /*box-shadow	: 1px 1px 5px 1px rgb(80, 80, 80) inset;*/
    color: rgb(254, 254, 254);
    padding: 0px 6px 2px 6px;
    display: inline-block;
    vertical-align: middle;
}

.padded-container {
    *padding-top: 5px;
    background: rgb(166, 169, 171);
    border: 1px solid rgb(34, 47, 54);
    min-height: 96%;
    border-radius: 8px;
    margin: 10px;
}

.collapsable {
    margin-left: auto;
    margin-right: auto;
    width: 98%;
    padding-bottom: 2px;
}

.page-menu_title {
    font-family: Arial;
    font-size: 10pt;
    font-weight: bold;
    color: rgb(254, 254, 254);
    padding-top: 8px;
    margin: 0px 0 8px 0;
    text-shadow: -1px 0px rgba(0, 0, 0, 0.3), 0px 1px rgba(0, 0, 0, 0.3), 1px 0px rgba(0, 0, 0, 0.3), 0px -1px rgba(0, 0, 0, 0.3);
}

.menu_title {
    border-bottom-color: rgb(212, 13, 8);
    border-bottom-width: 3px;
    border-bottom-style: solid;
    border-radius: 4px;
    color: rgb(210, 210, 210);
    cursor: pointer;
    font-weight: bold;
    margin-top: 1px;
    min-width: 75px;
    padding-top: 6px;
    padding-bottom: 6px;
    text-shadow: -1px 0px rgba(0, 0, 0, 0.8), 0px 1px rgba(0, 0, 0, 0.8), 1px 0px rgba(0, 0, 0, 0.8), 0px -1px rgba(0, 0, 0, 0.8);
}

.menu_title img {
    /*border		: 1px solid rgb(55,95,210);
	float			: right;
	left			: 8px;
	border			: 1px solid gray;
	position		: absolute;*/
    background-color: rgb(34, 47, 54);
    position: absolute;
    right: 22px;
    margin-right: 2px;
    /*margin-top	: 1px;*/
    width: 20px;
    border-radius: 12px;
    visibility: hidden;
    -webkit-box-shadow: 0px 0px 2px 1px rgba(0, 0, 0, 0.8) inset;
    -moz-box-shadow: 0px 0px 2px 1px rgba(0, 0, 0, 0.8) inset;
    box-shadow: 0px 0px 2px 1px rgba(0, 0, 0, 0.8) inset;
}

.menu_items .menu_items .menu_title img {
    /*margin-right	: 14px;*/
    right: 28px;
}

.menu_title_active {
    -webkit-box-shadow: 0px 0px 2px 1px rgb(140, 140, 140) inset;
    -moz-box-shadow: 0px 0px 2px 1px rgb(140, 140, 140) inset;
    box-shadow: 0px 0px 2px 1px rgb(140, 140, 140) inset;
    font-weight: bold;
    text-shadow: none;
    color: rgb(255, 255, 255);
    text-shadow: -1px 0px rgb(34, 47, 54), 0px 1px rgb(34, 47, 54), 1px 0px rgb(34, 47, 54), 0px -1px rgb(34, 47, 54);
}

.menu_title_active img {
    background-color: rgb(230, 230, 230);
    -webkit-transform: rotate(90deg)/*scale(1.2)*/
    ;
    -moz-transform: rotate(90deg)/*scale(1.2)*/
    ;
    -o-transform: rotate(90deg)/*scale(1.2)*/
    ;
    -ms-transform: rotate(90deg)/*scale(1.2)*/
    ;
    transform: rotate(90deg)/*scale(1.2)*/
    ;
}

.menu_title .title,
.menu_title_active .title {
    /*text-align	: center;
	display			: block;*/
    vertical-align: middle;
    margin-top: 0px;
    margin-left: 4%;
    margin-right: auto;
    /*padding-right	: 26px;
	width			: 100%;
	position		: absolute;*/
}

.menu_title:hover {
    background: rgb(34, 47, 54);
    background: -moz-linear-gradient(top, rgba(34, 47, 54, 1) 0%, rgba(73, 73, 73, 1) 30%, rgba(89, 89, 89, 1) 50%, rgba(73, 73, 73, 1) 70%, rgba(34, 47, 54, 1) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(34, 47, 54, 1)), color-stop(30%, rgba(73, 73, 73, 1)), color-stop(50%, rgba(89, 89, 89, 1)), color-stop(70%, rgba(73, 73, 73, 1)), color-stop(100%, rgba(34, 47, 54, 1)));
    background: -webkit-linear-gradient(top, rgba(34, 47, 54, 1) 0%, rgba(73, 73, 73, 1) 30%, rgba(89, 89, 89, 1) 50%, rgba(73, 73, 73, 1) 70%, rgba(34, 47, 54, 1) 100%);
    background: -o-linear-gradient(top, rgba(34, 47, 54, 1) 0%, rgba(73, 73, 73, 1) 30%, rgba(89, 89, 89, 1) 50%, rgba(73, 73, 73, 1) 70%, rgba(34, 47, 54, 1) 100%);
    background: -ms-linear-gradient(top, rgba(34, 47, 54, 1) 0%, rgba(73, 73, 73, 1) 30%, rgba(89, 89, 89, 1) 50%, rgba(73, 73, 73, 1) 70%, rgba(34, 47, 54, 1) 100%);
    background: linear-gradient(to bottom, rgba(34, 47, 54, 1) 0%, rgba(73, 73, 73, 1) 30%, rgba(89, 89, 89, 1) 50%, rgba(73, 73, 73, 1) 70%, rgba(34, 47, 54, 1) 100%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#222f36', endColorstr='#222f36', GradientType=0);
}

.menu_title:hover img {
    /*-webkit-transform: rotate(90deg) scale(1.2);
	-moz-transform	: rotate(90deg) scale(1.2);
	-o-transform	: rotate(90deg) scale(1.2);
	-ms-transform	: rotate(90deg) scale(1.2);
	transform		: rotate(90deg) scale(1.2);*/
    visibility: visible;
}

.rotate-half {
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}

.quater-rotation-clockwise,
.qrc {
    -webkit-transform: rotate(90deg)/*scale(1.2)*/
    ;
    -moz-transform: rotate(90deg)/*scale(1.2)*/
    ;
    -o-transform: rotate(90deg)/*scale(1.2)*/
    ;
    -ms-transform: rotate(90deg)/*scale(1.2)*/
    ;
    transform: rotate(90deg)/*scale(1.2)*/
    ;
}

.qrac {
    -webkit-transform: rotate(-90deg)/*scale(1.2)*/
    ;
    -moz-transform: rotate(-90deg)/*scale(1.2)*/
    ;
    -o-transform: rotate(-90deg)/*scale(1.2)*/
    ;
    -ms-transform: rotate(-90deg)/*scale(1.2)*/
    ;
    transform: rotate(-90deg)/*scale(1.2)*/
    ;
}

.menu_items {
    /*background-color: rgb(235, 240, 249);*/
    /*background-color: rgba(235, 140, 149, 0.10);*/
    /*border-radius	: 4px;
	*border-style	: solid; 
	*border-top		: none;
	*border-width	: 1px;*/
    cursor: pointer;
    /*box-shadow	: 0px 1px 2px 1px rgb(40, 40, 40) inset;*/
    width: 97%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 4px;
    /*border-color	: rgb(34, 47, 54);*/
}

.menu_items img {
    z-index: 1;
}

.menu_items a {
    background-color: rgb(230, 230, 230);
    border: 1px solid rgb(34, 47, 54);
    border-top: none;
    *border-radius: 3px;
    display: block;
    text-decoration: none;
    width: inherit;
    padding-top: 2px;
    padding-bottom: 2px;
    padding-left: 8px;
    font-family: Trebuchet MS;
}

.menu_items a:not(.active-link) {
    color: rgb(34, 47, 54);
}

.menu_items a:hover {
    /*background-color: rgb(220, 234, 253);*/
    text-decoration: underline;
}

.menu_items a:active {
    color: rgb(255, 255, 255);
    font-weight: bold;
    text-decoration: none;
}

.menu_items .menu_items {
    font-size: 95%;
}

.active-link {
    font-weight: bold;
    background-color: rgb(212, 13, 8);
    color: rgb(230, 0, 0);
    /*background	: rgba(255, 255, 255, 0.3);
	-moz-box-shadow	: 0px 1px 2px 1px rgb(80, 80, 80) inset;
	-webkit-box-shadow: 0px 1px 2px 1px rgb(80, 80, 80) inset;
	        box-shadow: 0px 1px 2px 1px rgb(80, 80, 80) inset;*/
}

.menu-tabs {
    font-weight: bold;
    color: rgb(255, 255, 255);
    cursor: default;
    min-height: 25px;
    padding-left: 5px;
    padding-right: 5px;
    width: 98%;
    margin-left: auto;
    margin-right: auto;
}

.menu-tabs span {
    background: rgb(201, 215, 239);
    /* Old browsers */
    background: -moz-linear-gradient(top, rgb(201, 215, 239) 10%, rgb(154, 181, 228) 80%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(10%, rgb(201, 215, 239)), color-stop(80%, rgb(154, 181, 228)));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgb(201, 215, 239) 10%, rgb(154, 181, 228) 80%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgb(201, 215, 239) 10%, rgb(154, 181, 228) 80%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, rgb(201, 215, 239) 10%, rgb(154, 181, 228) 80%);
    /* IE10+ */
    background: linear-gradient(to bottom, rgb(201, 215, 239) 10%, rgb(154, 181, 228) 80%);
    /* W3C */
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#c9d7ef', endColorstr='#9ab5e4', GradientType=0);
    /* IE6-9 */
    display: inline-block;
    text-align: center;
    padding-left: 10px;
    padding-right: 10px;
    text-shadow: 0px 0px rgb(10, 10, 10), 1px 2px rgb(100, 100, 100);
    *border-bottom: 3px solid none;
    border-radius: 10px 10px 2px 2px;
    border-color: rgb(255, 150, 150);
    border-style: solid;
    border-right-width: 2px;
    border-bottom-width: 2px;
    border-left: none;
    border-top-width: 1px;
    height: 23px;
    min-width: 42px;
    text-decoration: none;
}

.menu-tabs span:hover {
    background: rgb(141, 172, 224);
    /* Old browsers */
    background: -moz-linear-gradient(top, rgb(141, 172, 224) 10%, rgb(154, 181, 228) 80%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(10%, rgb(141, 172, 224)), color-stop(80%, rgb(154, 181, 228)));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgb(141, 172, 224) 10%, rgb(154, 181, 228) 80%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgb(141, 172, 224) 10%, rgb(154, 181, 228) 80%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, rgb(141, 172, 224) 10%, rgb(154, 181, 228) 80%);
    /* IE10+ */
    background: linear-gradient(to bottom, rgb(141, 172, 224) 10%, rgb(154, 181, 228) 80%);
    /* W3C */
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#8dace0', endColorstr='#9ab5e4', GradientType=0);
    /* IE6-9 */
    cursor: pointer;
    border-bottom: 2px solid rgb(252, 252, 252);
    *border-right-width: 1px;
}


/*.tab-contents{
	border			: 1px solid rgb(255,220,220);
	border-radius	: 4px 4px 4px 4px;
	height			: inherit;
	margin-left		: auto;
	margin-right	: auto;
	margin-top		: -1px;
	width			: 99%;
}*/

.tab-submenu {
    *border: 1px solid rgb(255, 120, 120);
    background-color: rgb(245, 245, 245);
    border-radius: 4px 4px 4px 4px;
    min-width: 120px;
    max-width: 210px;
    height: 100%;
    float: left;
    overflow-y: auto;
    padding-left: 6px;
    padding-right: 6px;
    text-align: center;
    width: 15%;
}

.tab-submenu .navigation-button {
    *float: left;
}

.menu-title-bar {
    background: rgb(201, 215, 239);
    /* Old browsers */
    background: -moz-linear-gradient(top, rgb(201, 215, 239) 10%, rgb(154, 181, 228) 80%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(10%, rgb(201, 215, 239)), color-stop(80%, rgb(154, 181, 228)));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgb(201, 215, 239) 10%, rgb(154, 181, 228) 80%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgb(201, 215, 239) 10%, rgb(154, 181, 228) 80%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, rgb(201, 215, 239) 10%, rgb(154, 181, 228) 80%);
    /* IE10+ */
    background: linear-gradient(to bottom, rgb(201, 215, 239) 10%, rgb(154, 181, 228) 80%);
    /* W3C */
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#c9d7ef', endColorstr='#9ab5e4', GradientType=0);
    /* IE6-9 */
    border-radius: 18px 2px 2px 18px;
    margin-top: 4px;
    min-height: 23px;
    padding: 4px;
    text-align: left;
}
@media print {
    .non-printable {
        display: none !important;
    }
}

.menu-title-bar .title {
    text-align: center;
    *margin-left: -20px;
    text-decoration: underline;
    color: rgb(255, 255, 255);
    text-shadow: 0px 0px rgb(10, 10, 10), 1px 2px rgb(100, 100, 100);
}

.tab-contents-view {
    *border: 1px solid rgb(200, 120, 120);
    height: 100%;
    overflow: auto;
}

table {
    /*border		: 1px solid rgb(180, 180, 180);
	border-collapse	: collapse;
	/* width			: 100%;*/ */
    font-size: 10pt;
    border-radius: 4px;
    margin-left: auto;
    margin-right: auto;
}

.no-border-spacing {
    border-spacing: 0px;
}

.tr-even-alignment td {
    border: none;
}

td,
th {
    border: 1px solid rgb(0, 0, 0);
    /*border-radius	: 3px;*/
    padding: 3px;
    vertical-align: middle;
}

td[colspan="5"],
th[colspan="5"] {
    width: 27.77%;
}

td[colspan="6"],
th[colspan="6"] {
    width: 33.33%;
}

th input,
td input {
    display: inline-block;
    vertical-align: middle;
}


.table {
    display: table;
    min-width: 30%;
    font-size: 10pt;
    border-spacing: 0px;
    border-collapse: collapse;
    margin-left: auto;
    margin-right: auto;
}

.table input[type="file"] {
    font-size: inherit;
}

.table-body {
    *display: table-row-group;
    *overflow: scroll;
    *border: 1px solid green;
}

.table-row {
    max-width: 100%;
    border-radius: 4px;
    display: table-row;
    max-width: 1024px;
}

.table-row:hover {
    background-color: rgb(230, 230, 230);
    cursor: default;
}

.transdetailhistable {
    max-width: 90%;
    margin: 1rem auto;
    /* max-width: 90%;
    display: block;
    overflow: hidden;
    height: 125px; */
    /* border: 1px solid black; */
}

.table-caption {
    display: table-cell;
    border: 1px solid rgb(0, 0, 0);
    font-weight: bold;
    padding-left: 4px;
    padding-right: 4px;
    padding-top: 2px;
    padding-bottom: 2px;
    vertical-align: middle;
    cursor: pointer;
}

.grid-inside-wide {
    overflow-x: sticky;
    min-width: 2193px;
    max-width: 2193px;
}

.grid-heading{ 
    min-height: 470px;
    top: 0;
    
}

th.grid-heading {
    position: sticky;
    position: -webkit-sticky;
    z-index: 9;
    max-height: 37px;
    width: auto;
    
}
th.sticky-space{
    top:64px;
}
th.grid-left-heading {
    position: sticky;
    position: -webkit-sticky;
    z-index: 11;
    left: 0;
}

th.grid-left2-heading {
    position: sticky;
    position: -webkit-sticky;
    z-index: 11;
    left: 75px; /* Adjust this value according to your layout */
}


table.gridtable{
    border-collapse: initial;
    width: 100%;
}
table.gridtable td {
    background-color: lightgray;
}

td.grid-left {
    left: 0px;
    position: sticky;
    position: -webkit-sticky;
    z-index: 10;
}

td.grid-left2 {
    left: 75px;
    position: sticky;
    position: -webkit-sticky;
    z-index: 10;
}
.table-cell textarea {
    width: 129px;
    height: 18px;
}

.table-cell select {
    font-size: 10pt;
}

.table-cell {
    display: table-cell;
    border: 1px solid rgb(0, 0, 0);
    *border-radius: 3px;
    padding-top: 2px;
    padding-left: 3px;
    padding-right: 3px;
    padding-bottom: 2px;
    vertical-align: middle;
    *text-align: center;
    white-space: nowrap;
}

.table-cell.hidden,
.table-caption.hidden {
    display: none;
}

.table-cell input,
.table-cell select,
.table-cell img {
    /*display		: inline-block;
	width			: 90%;*/
    vertical-align: middle;
}

.integer-column {
    /*padding-right	: 4px;
	padding-left	: 2px;*/
    text-align: right;
    /*min-width		: 30px;
	width 			: 50px;*/
}

.integer-column input {
    text-align: right;
    margin-left: auto;
    margin-right: auto;
    width: 90%;
}

.no-padding {
    padding: 0px;
}

#multiplet-cpanel {
    text-align: center;
}

#multiplet-info {
    position: absolute;
    left: 46px;
    right: 46px;
}

#multiplet-pointer {
    padding: 5px 6px 5px 6px;
    display: inline-block;
}

#multiplet-cpanel .control-button {
    margin-top: 4px;
    margin-bottom: 4px;
}

.border-rad {
    border-radius: 6px;
}

.add-padding {
    padding: 3px 6px 3px 6px;
}

.collapsed-border {
    border-collapse: collapse;
}

.no-borders {
    *border: 3px;
    *background-color: rgba(0, 0, 0, 0);
    *border-color: rgba(0, 0, 0, 0);
    border: none;
}

.no-side-borders {
    border-left: none;
    border-right: none;
    border-spacing: 1px 0px;
}

.no-top-border {
    border-top: none;
    border-spacing: 0px 1px;
}

.no-bottom-border {
    border-bottom: none;
    border-spacing: 0px 1px;
}

.no-right-border {
    border-right: none;
    border-spacing: 1px 0px;
}

.no-left-border {
    border-left: none;
    border-spacing: 1px 0px;
}

.add-borders {
    border: 1px solid rgb(0, 0, 0);
    background-color: rgba(0, 0, 0, 0);
}

.add-side-borders {
    border-left: 1px solid rgb(0, 0, 0);
    border-right: 1px solid rgb(0, 0, 0);
    border-spacing: 1px 0px;
}

.add-top-border {
    border-top: 1px solid rgb(0, 0, 0);
    border-spacing: 0px 1px;
}

.add-bottom-border {
    border-bottom: 1px solid rgb(0, 0, 0);
    border-spacing: 0px 1px;
}

.add-right-border {
    border-right: 1px solid rgb(0, 0, 0);
    border-spacing: 1px 0px;
}

.add-left-border {
    border-left: 1px solid rgb(0, 0, 0);
    border-spacing: 1px 0px;
}

.td-width-15-perc {
    *width: 15%;
}

.bold {
    font-weight: bold;
}

.italic {
    font-style: italic;
}

.large {
    font-size: 10pt;
}

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

.valign-middle {
    vertical-align: middle;
}

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

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

.elongate-vertical {
    height: 480px;
}

.fixed-vertical {
    height: 18px;
}


.datagrid {
    border: 1px solid;
    border-collapse: fixed;
    overflow: auto;
    height: auto;
    max-height: 410px;
    width:100%;
    max-width: 1024px;
    margin-left: auto;
    margin-right: auto;
    overflow-y: auto;
} 

#print-contents .datagrid {
    overflow: hidden;
    height: auto;
    max-height: none;
}
.datagrid.master-detail {

    max-width: 100%;
    /* Ensure the table doesn't exceed the screen width */
    overflow-x: auto;
    /* Enable horizontal scrolling if necessary */
    overflow-y: auto;
}

.datagrid table,
.datagrid .table {
    width: 100%;
    margin: -1px;
}
/* 
.datagrid .table-cell {
    *padding: 2px;
} */

.datagrid input {
    border: none;
    border-radius: 0px;
}

.datagrid .table-row .table-cell:last-child,
.datagrid tr td:last-child {
    border-right: none;
}


.datagridtable {
    position: fixed;
    overflow: scroll;
}
.datagrid .table-cell,
.datagrid td {
    padding: 4px;
}
.table-5 {
    min-width: 25px;
    max-width: 25px;
}

.table-10 {
    min-width: 50px;
    max-width: 50px;
}

.table-15 {
    min-width: 75px;
    max-width: 75px;
}

.table-20 {
    min-width: 100px;
    max-width: 100px;
}

.table-30 {
    min-width: 150px;
    max-width: 150px;
}

.table-50 {
    min-width: 285px;
    max-width: 285px;
}

.sub-title {
    margin-top: 20px;
}

.input_label {
    display: inline-block;
    width: 82px;
    text-align: left;
    color: rgb(254, 254, 254);
    font-family: trebuchet ms;
    *border: 1px solid;
}

.input_text {
    border: 1px solid rgb(245, 245, 245);
    font-weight: bold;
    height: 25px;
    padding-left: 5px;
    width: 60%;
}

  

#login {
    cursor: default;
    /*padding		: 10px 10px 10px 10px;*/
    margin-left: auto;
    margin-right: auto;
    /*text-align	: center;*/
    width: 315px;
    margin-top: 6%;
}

#login span {
    cursor: default;
}

#login .div_row_large,
#login .div_row_normal {
    position: relative;
    /* z-index: 0; */
}

#login fieldset {
    /*must have shadow*/
    /*border-color	: rgb(134, 165, 222);*/
    border-radius: 18px;
    /*border-style	: solid; 
	*border-width	: 1px;
	*box-shadow		: 0px 5px 5px rgb(80, 80, 80);*/
    color: rgb(255, 255, 255);
    /*margin-top	: 10px;*/
    padding-top: 26px;
    border: none;
}

#login legend {
    /*must have shadow*/
    /*background	: -moz-linear-gradient(top,  rgb(100,140,210) 0%, rgb(50,90,175) 100%); /* FF3.6+ */
    /*background	: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(100,140,210)), color-stop(100%,rgb(50,90,175))); /* Chrome,Safari4+ */
    /*background	: -webkit-linear-gradient(top,  rgb(100,140,210) 0%,rgb(50,90,175) 100%); /* Chrome10+,Safari5.1+ */
    /*background	: -o-linear-gradient(top,  rgb(100,140,210) 0%,rgb(50,90,175) 100%); /* Opera 11.10+ */
    /*background	: -ms-linear-gradient(top,  rgb(100,140,210) 0%,rgb(50,90,175) 100%); /* IE10+ */
    /*background	: linear-gradient(to bottom,  rgb(100,140,210) 0%,rgb(50,90,175) 100%); /* W3C */
    /*filter		: progid:DXImageTransform.Microsoft.gradient( startColorstr='#648cd2', endColorstr='#325aaf',GradientType=0 ); /* IE6-9 */
    border-left-color: rgb(125, 158, 217);
    /*border-color	: rgb(134, 165, 222);
	border-style	: solid; 
	border-top		: 1px;
	border-width	: 1px;
	box-shadow		: 0px 5px 5px rgb(80, 80, 80);
	color			: rgb(255, 255, 255);
	font-weight		: bolder;
	padding-top		: 5px;
	padding-right	: 5px;
	position		: inherit;
	text-shadow		: 0px 0px rgb(10, 10, 10),1px 2px rgb(100, 100, 100);*/
    text-align: center;
    width: 94.5%;
    /*margin-top	: -20px;
	*margin-left	: 90px;*/
}

#login input:focus {
    background: rgb(54, 67, 74);
}

fieldset {
    /*border-top-color: rgb(212, 13, 8);*/
    position: relative;
    border: none;
    border-top: 2px solid rgb(212, 13, 8);
    border-radius: 4px;
    margin-top: 5px;
    position: relative;
    vertical-align: top;
    background: rgba(254, 254, 254, 0.7);
    width: 98%;
    overflow: auto;
}

legend {
    background: rgb(34, 47, 54);
    /*border		: 1px solid rgb(125, 158, 217);*/
    border-radius: 6px;
    color: rgb(254, 254, 254);
    cursor: default;
    /*display		: inline-block;*/
    font-size: 10pt;
    font-weight: bold;
    font-family: arial;
    padding: 4px 8px 4px 8px;
    /*text-shadow	: 0px 1px rgb(10, 10, 10),1px 2px rgb(50, 50, 50);*/
}

#page-contents legend:hover {
    color: rgb(250, 250, 255);
}

.div_row_large {
    font-weight: bold;
    /*height		: 39px;*/
    margin-top: 10px;
}

.left_compartment {
    float: left;
    position: relative;
    width: 90px;
}

.right_compartment {
    text-align: right;
}

.div_row_normal {
    clear: both;
    margin-left: auto;
    margin-right: auto;
    padding-bottom: 3px;
    padding-top: 3px;
    width: 98%;
    text-align: center!important;
}

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

.div_row_normal .field_label,
.div_row_normal .field_value {
    display: inline-block;
}
/* 
.field_label {
    cursor: default;
    display: inline-block;
    width: 200px;
    text-align: left;
} */

.field_label {
    cursor: default;
    width: 200px;
    text-align: left;
    border: none;
}

/* .field_value {
    display: inline-block;
    vertical-align: middle;
    min-width: 210px;
    z-index: 2;
    text-align: left;
} */

.field_value {
    vertical-align: middle;
    min-width: 210px;
    z-index: 2;
    text-align: left;
}

.field_value input[type=text],
.field_value input[type=password],
.field_value input[type=date],
.field_value select,
.field_value textarea,
.table input {
    font-size: 10pt;
    font-family: Trebuchet MS;
    margin-right: 0px;
    /*vertical-align: middle;*/
    border-radius: 4px;
    border-width: 1px;
    border-collapse: collapse;
    border-style: solid;
    border-color: rgba(34, 47, 54, 0.65);
    /*background-color: rgb(255, 255, 255);*/
    vertical-align: top;
}

.field_value input[type=text],
.field_value input[type=password],
.field_value input[type=date],
.field_value select,
.field_value textarea,
.field_value .payslip-logo {
    width: 190px;
}

.payslip,
.irp5 {
    page-break-after: auto;
    margin-top: 25px;
    background-image: url("images/paydaywm.png");
    background-repeat: no-repeat;
    background-position: center;
    background-color: rgb(255, 255, 255);
    width: 100%;
    height: 260mm;
    margin-left: 0;
    margin-right: 0;
    left: 0;
    right: 0;
}
.left-logo{
    position: absolute !important;
    right: 10px !important;
}

#payslip .payslip-logo {
    width: 75%;
    *max-height: 118px;
    max-width: 320px;
}

.upload_logo {
    width: 75%;
    *max-height: 118px;
    max-width: 120px;
}

.payslip-desc {
    width: 27.77%;
}

.payslip-val {
    width: 5.56%;
}

.watermark {
    position: absolute;
    z-index: -1;
    opacity: 0.4;
    top: 0px;
    bottom: 12px;
}

.edition {
    position: absolute;
    margin-left: -18px;
    margin-top: -53px;
    height: 109px;
}

.code {
    max-width: 65px;
}

input[readonly],
textarea[readonly] {
    background-color: rgba(120, 120, 120, 0.05);
    border: 1px solid rgba(120, 120, 120, 0.2);
}

select:disabled {
    background-color: rgba(120, 120, 120, 0.05);
    color: rgb(0, 0, 0);
}

.field_value textarea {
    /*border-color	: rgb(125, 158, 217);
	*border-left	: none;
	*border-right	: none;
	*border-top		: none;
	*border-width	: 3px;
	*width			: 50%;*/
    width: 250px;
    height: 78px;
    vertical-align: top;
}

.btn-browse-file {
    cursor: pointer;
}

textarea {
    /*border-color	: rgb(125, 158, 217);
	*border-left	: none;
	*border-right	: none;
	*border-top		: none;
	*border-width	: 3px;
	*width			: 50%;*/
    width: 1018px;
    height: 300px;
    vertical-align: top;
}

.field_value select {
    /*border-bottom-color: rgb(125, 158, 217);
	*border-style	: solid;
	*border-left-width: 1px;
	*border-right-width: 1px;
	*border-top-width: 1px;
	*border-bottom-width: 3px;
	*font-size		: 10pt;
	*font-family	: Arial;
	*height			: 22px;
	*min-width		: 125px;*/
}


/*.field_value*/

.btn-lookup {
    height: 22px;
    width: 21px;
}


/*.field_value .btn-lookup img{
	margin-top		: 2px;
}*/

.field_value * {
    vertical-align: middle;
}

.btn-lookup {
    display: inline-block;
    position: relative;
    /*border-bottom	: 3px solid rgb(125, 158, 217);
	*border-radius	: 0px 6px 6px 0px;*/
    margin-left: -8px;
    vertical-align: middle;
    /*padding-top	: 1px;*/
    padding-left: 6px;
    border: 1px solid rgba(34, 47, 54, 0.65);
    border-left: none;
    border-radius: 0px 4px 4px 0px;
    background: rgb(34, 47, 54);
}

.btn-lookup img {
    height: 18px;
    padding: 0px;
    position: absolute;
    /*border		: 1px solid;*/
    margin-top: 2px;
}

.btn-lookup:hover {
    /*background	: rgb(228,245,252); /* Old browsers */
    /*background	: -moz-linear-gradient(top,  rgb(228,245,252) 0%, rgb(177,192,216) 98%); /* FF3.6+ */
    /*background	: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(228,245,252)), color-stop(98%,rgb(177,192,216))); /* Chrome,Safari4+ */
    /*background	: -webkit-linear-gradient(top,  rgb(228,245,252) 0%,rgb(177,192,216) 98%); /* Chrome10+,Safari5.1+ */
    /*background	: -o-linear-gradient(top,  rgb(228,245,252) 0%,rgb(177,192,216) 98%); /* Opera 11.10+ */
    /*background	: -ms-linear-gradient(top,  rgb(228,245,252) 0%,rgb(177,192,216) 98%); /* IE10+ */
    /*background	: linear-gradient(to bottom,  rgb(228,245,252) 0%,rgb(177,192,216) 98%); /* W3C */
    /*filter		: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e4f5fc', endColorstr='#b1c0d8',GradientType=0 ); /* IE6-9 */
    cursor: pointer;
    background: rgba(34, 47, 54, 0.9);
}

.btn-lookup * {
    vertical-align: middle;
}

.time-input {
    max-width: 60px;
}

.time-column {
    /*width 		: 90px;*/
    min-width: 82px;
}

.date-input {
    max-width: 92px;
    vertical-align: middle;
}

.date-column {
    min-width: 128px;
    width: 128px;
    *max-width: 130px;
}

.full-width {
    width: 99.9%;
}

.half-width {
    width: 49%;
    display: inline-block;
    min-width: 250px;
    vertical-align: top;
    *padding-right: 2px;
    *border: 1px solid gray;
}

.unlimited-half {
    width: 47%;
    display: inline-block;
}

.fixed-position {
    *position: fixed;
}

.subject {
    min-width: 50%;
}

.font-12pt,
.f12 {
    font-size: 10pt;
}

.font-10pt,
.f10 {
    font-size: 10pt;
}

.font-8pt,
.f8 {
    font-size: 8pt;
}

.one-char,
.c1 {
    max-width: 13px;
    width: 13px;
}

.two-chars,
.c2,
input.two-chars,
input.c2 {
    max-width: 22px;
    width: 22px;
}

select.two-chars,
select.c2 {
    max-width: 40px;
    width: 40px;
}

.three-chars,
.c3,
input.three-chars,
input.c3 {
    max-width: 32px;
    width: 32px;
}

select.three-chars,
select.c3 {
    max-width: 50px;
    width: 50px;
}

.c4 {
    max-width: 40px;
    width: 40px;
}

.five-chars,
.c5 {
    max-width: 61px;
    width: 61px;
}

.six-chars,
.c6 {
    max-width: 74px;
    width: 74px;
}

.eight-chars,
.c8 {
    max-width: 87px;
    width: 87px;
}

.chelp{
    max-width: 270px;
    width: 270px;
}

.nine-chars,
.c9 {
    max-width: 100px;
    width: 100px;
}

.c10 {
    max-width: 113px;
    width: 113px;
}

.c11 {
    max-width: 126px;
    width: 126px;
}

.c12 {
    max-width: 137px;
    width: 137px;
}

.c13 {
    max-width: 152px;
    width: 152px;
}

.c14 {
    max-width: 165px;
    width: 165px;
}

.fifteen-chars,
.c15 {
    max-width: 178px;
    width: 178px;
}

.c20 {
    max-width: 243px;
    width: 243px;
}

.thirty-chars,
.c30 {
    width: 373px;
    max-width: 373px;
}

input[maxlength="11"] {
    width: 75px;
}

input[maxlength="2"] {
    width: 30px;
}

#login input[type="text"]:focus,
#login input[type="password"]:focus {
    *border-bottom-width: 2px;
    text-align: left;
}

.required_field {
    border-color: rgb(255, 0, 0);
    box-shadow: 0px 0px 2px 1px rgb(255, 10, 10);
}

button,
.div_row_normal input[type="button"],
.div_row_normal input[type="submit"],
.dialog-controls input[type="button"],
legend input[type="submit"],
legend input[type="button"],
a.dark-bg {
    padding: 2px 2px 2px 2px;
    border-radius: 6px;
    border: 1px solid rgb(212, 13, 8);
    font-family: trebuchet ms;
    font-weight: bold;
    /*min-width		: 82px;*/
    cursor: pointer;
    margin: 0px 2px;
}

button,
.dialog-title,
.btn-close,
.btn-add,
.btn-remove,
.btn-edit {
    background: rgb(34, 47, 54);
    color: rgb(254, 254, 254);
}

.btnEmailSave {
    padding: 2px 2px 2px 2px;
    border-radius: 6px;
    border: 1px solid rgb(212, 13, 8);
    font-family: trebuchet ms;
    font-weight: bold;
    min-width: 82px;
    cursor: pointer;
    background-color: rgba(200, 200, 200, 0.3);
    min-height: 25px;
}

button:hover,
a.dark-bg:hover {
    border: 1px solid rgb(212, 212, 212);
}

button *,
a.dark-bg * {
    vertical-align: middle;
    font-weight: bold;
    height: 18px;
}

.dark-bg {
    background: rgb(34, 47, 54);
    color: rgb(254, 254, 254);
}

.red-bg {
    background: #D40D08;
    color: #fff;
}

.light-bg {
    background: #E14C4A;
    color: #000;
}

.lighter-bg {
    background: #F2ADAC;
    color: #000;
}

a.dark-bg {
    display: inline-block;
    text-decoration: none;
    white-space: nowrap;
}

.dark-bg-grad {
    background: rgb(34, 47, 54);
    background: -moz-linear-gradient(top, rgba(34, 47, 54, 1) 0%, rgba(73, 73, 73, 1) 30%, rgba(89, 89, 89, 1) 50%, rgba(73, 73, 73, 1) 70%, rgba(34, 47, 54, 1) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(34, 47, 54, 1)), color-stop(30%, rgba(73, 73, 73, 1)), color-stop(50%, rgba(89, 89, 89, 1)), color-stop(70%, rgba(73, 73, 73, 1)), color-stop(100%, rgba(34, 47, 54, 1)));
    background: -webkit-linear-gradient(top, rgba(34, 47, 54, 1) 0%, rgba(73, 73, 73, 1) 30%, rgba(89, 89, 89, 1) 50%, rgba(73, 73, 73, 1) 70%, rgba(34, 47, 54, 1) 100%);
    background: -o-linear-gradient(top, rgba(34, 47, 54, 1) 0%, rgba(73, 73, 73, 1) 30%, rgba(89, 89, 89, 1) 50%, rgba(73, 73, 73, 1) 70%, rgba(34, 47, 54, 1) 100%);
    background: -ms-linear-gradient(top, rgba(34, 47, 54, 1) 0%, rgba(73, 73, 73, 1) 30%, rgba(89, 89, 89, 1) 50%, rgba(73, 73, 73, 1) 70%, rgba(34, 47, 54, 1) 100%);
    background: linear-gradient(to bottom, rgba(34, 47, 54, 1) 0%, rgba(73, 73, 73, 1) 30%, rgba(89, 89, 89, 1) 50%, rgba(73, 73, 73, 1) 70%, rgba(34, 47, 54, 1) 100%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#222f36', endColorstr='#222f36', GradientType=0);
}

.dark-bg-grad *,
.dark-bg *,
.red-bg-grad * {
    color: rgb(254, 254, 254);
}

.red-bg-grad {
    background: rgb(242, 128, 128);
    background: -moz-linear-gradient(top, rgba(242, 128, 128, 1) 0%, rgba(204, 0, 0, 1) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(242, 128, 128, 1)), color-stop(100%, rgba(204, 0, 0, 1)));
    background: -webkit-linear-gradient(top, rgba(242, 128, 128, 1) 0%, rgba(204, 0, 0, 1) 100%);
    background: -o-linear-gradient(top, rgba(242, 128, 128, 1) 0%, rgba(204, 0, 0, 1) 100%);
    background: -ms-linear-gradient(top, rgba(242, 128, 128, 1) 0%, rgba(204, 0, 0, 1) 100%);
    background: linear-gradient(to bottom, rgba(242, 128, 128, 1) 0%, rgba(204, 0, 0, 1) 100%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#f28080', endColorstr='#cc0000', GradientType=0);
}

.custom_button {
    /*must have shadow*/
    background: rgb(89, 141, 219);
    /* Old browsers */
    background: -moz-linear-gradient(top, rgba(89, 141, 219, 1) 5%, rgba(40, 85, 155, 1) 80%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(5%, rgba(89, 141, 219, 1)), color-stop(80%, rgba(40, 85, 155, 1)));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgba(89, 141, 219, 1) 5%, rgba(40, 85, 155, 1) 80%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgba(89, 141, 219, 1) 5%, rgba(40, 85, 155, 1) 80%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, rgba(89, 141, 219, 1) 5%, rgba(40, 85, 155, 1) 80%);
    /* IE10+ */
    background: linear-gradient(to bottom, rgba(89, 141, 219, 1) 5%, rgba(40, 85, 155, 1) 80%);
    /* W3C */
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#598ddb', endColorstr='#28559b', GradientType=0);
    /* IE6-9 */
    border-radius: 6px;
    border-style: solid;
    /*box-shadow	: 0px 0px 5px 2px rgb(100, 100, 100);*/
    color: rgb(240, 240, 240);
    cursor: pointer;
    font-weight: bolder;
    height: 26px;
    text-align: center;
    text-shadow: 0px 0px rgb(10, 10, 10), 1px 2px rgb(50, 50, 50);
    width: 100px;
    margin-top: 10px;
}

.custom_button:hover {
    background: rgb(89, 141, 219);
    /* Old browsers */
    background: -moz-linear-gradient(top, rgba(89, 141, 219, 1) 0%, rgba(159, 213, 242, 1) 100%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(89, 141, 219, 1)), color-stop(100%, rgba(159, 213, 242, 1)));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgba(89, 141, 219, 1) 0%, rgba(159, 213, 242, 1) 100%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgba(89, 141, 219, 1) 0%, rgba(159, 213, 242, 1) 100%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, rgba(89, 141, 219, 1) 0%, rgba(159, 213, 242, 1) 100%);
    /* IE10+ */
    background: linear-gradient(to bottom, rgba(89, 141, 219, 1) 0%, rgba(159, 213, 242, 1) 100%);
    /* W3C */
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#598ddb', endColorstr='#9fd5f2', GradientType=0);
    /* IE6-9 */
    /*box-shadow	: 0px 0px 5px 2px rgb(100, 100, 100) inset;*/
    color: rgb(255, 255, 255);
    text-shadow: none;
}

.link-button {
    /*background	: rgb(194,209,237); /* Old browsers */
    /*background	: -moz-linear-gradient(top,  rgb(194,209,237) 15%, rgb(154,181,228) 80%); /* FF3.6+ */
    /*background	: -webkit-gradient(linear, left top, left bottom, color-stop(15%,rgb(194,209,237)), color-stop(80%,rgb(154,181,228))); /* Chrome,Safari4+ */
    /*background	: -webkit-linear-gradient(top,  rgb(194,209,237) 15%,rgb(154,181,228) 80%); /* Chrome10+,Safari5.1+ */
    /*background	: -o-linear-gradient(top,  rgb(194,209,237) 15%,rgb(154,181,228) 80%); /* Opera 11.10+ */
    /*background	: -ms-linear-gradient(top,  rgb(194,209,237) 15%,rgb(154,181,228) 80%); /* IE10+ */
    /*background	: linear-gradient(to bottom,  rgb(194,209,237) 15%,rgb(154,181,228) 80%); /* W3C */
    /*filter		: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c2d1ed', endColorstr='#9ab5e4',GradientType=0 ); /* IE6-9 */
    font-weight: bold;
    text-decoration: none;
    display: block;
    text-align: center;
    border-radius: 3px;
    border: 1px solid rgb(212, 13, 8);
    color: rgb(245, 245, 255);
    padding-left: 4px;
    padding-right: 4px;
}

.link-button:hover {
    color: rgb(255, 155, 10);
    border-color: rgb(254, 254, 254);
}

.link-button:active {
    /*background-color: rgb(255, 215, 215);*/
    border-color: rgb(255, 120, 120);
    color: rgb(255, 235, 235);
}

.frequently-used {
    display: none;
}

#overlayed-panel {
    background-color: rgba(255, 255, 255, 0.5);
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    display: none;
    z-index: 11;
    text-align: center;
}

#overlay {
    position: fixed;
    top: 104px;
    left: 8px;
    right: 8px;
    bottom: 8px;
    display: none;
    z-index: 7;
    text-align: center;
    background-color: rgba(255, 255, 255, 0.5);
}

#loader {
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}


.busy_gif {
    height: 56px;
    border-radius: 50px;
    *border: 1px solid red;
    z-index: 4;
    background-color: rgba(34, 47, 54, 0.1);
    padding: 4px 15px 10px 15px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -28px;
    margin-left: -28px;
}

.remember_me {
    font-size: 10pt;
}

.response {
    position: absolute;
    display: block;
    *color: rgb(50, 100, 50);
    font-weight: bold;
}

.error_message {
    display: block;
    font-weight: normal;
    color: rgb(255, 0, 0);
    text-align: center;
}

.error {
    color: rgb(232, 13, 8);
}

.bad_request_message {
    display: block;
    text-align: center;
    font-size: 10pt;
    color: rgb(255, 80, 87);
    z-index: 3;
    border: 1px solid red;
    background-color: rgb(220, 220, 110);
    padding: 4px;
    border-radius: 4px;
    position: absolute;
    width: 280px;
}

.bad_request_message img,
.bad_request_message span {
    display: inline-block;
    vertical-align: middle;
}

.bad_request_message input {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

#main_footer {
    position: relative;
    text-align: center;
    top: 10px;
}

#main_footer span {
    text-align: center;
    font-size: 8pt;
}

.table-fixed {
    width: 100%; 
  }
  .searches-btnn {
    position: sticky !important;
    position: -webkit-sticky !important;
    width:96vw !important;
    top: -12px !important; 
    z-index: 99 !important; 
    background-color: white !important; 
  }
  .printable-fixed-header{
    overflow:visible !important;
  }
  /*This will work on every browser but Chrome Browser*/
  .table-fixed thead {
    position: sticky !important;
    position: -webkit-sticky !important;
    top: 0 !important; 
    z-index: 999 !important; 
    background-color: #4aaee7 !important; 
    color: #fff !important;
  }
  
  /*This will work on every browser*/
  .table-fixed thead th {
      position: sticky !important;
      position: -webkit-sticky !important;
      top: 0 !important;
      z-index: 999 !important;
      background-color: #4aaee7 !important;
      color: #fff !important;
  }

.sticky {
    position: fixed!important;
    width: 76.3%;
    margin-top: -75px;
    z-index: 10;
    box-shadow: 2px 5px 5px #888888;
    background: rgb(230, 230, 230);
    background: -moz-linear-gradient(top, rgba(230, 230, 230, 1) 0%, rgba(34, 47, 54, 1) 100%, rgba(84, 84, 84, 1) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(230, 230, 230, 1)), color-stop(100%, rgba(34, 47, 54, 1)), color-stop(100%, rgba(84, 84, 84, 1)));
    background: -webkit-linear-gradient(top, rgba(230, 230, 230, 1) 0%, rgba(34, 47, 54, 1) 100%, rgba(84, 84, 84, 1) 100%);
    background: -o-linear-gradient(top, rgba(230, 230, 230, 1) 0%, rgba(34, 47, 54, 1) 100%, rgba(84, 84, 84, 1) 100%);
    background: -ms-linear-gradient(top, rgba(230, 230, 230, 1) 0%, rgba(34, 47, 54, 1) 100%, rgba(84, 84, 84, 1) 100%);
    background: linear-gradient(to bottom, rgba(230, 230, 230, 1) 0%, rgba(34, 47, 54, 1) 100%, rgba(84, 84, 84, 1) 100%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#e6e6e6', endColorstr='#545454', GradientType=0);
}

.unlimited-half textarea {
    width: 90%;
    height: 90px;
}

.py-1 {
    padding: 0.5rem 0
}

.py-2 {
    padding: 1.5rem 0
}

.py-3 {
    padding: 3rem 0
}

textarea {
    font-size: 10.1pt;
    font-family: "Trebuchet MS";
}

#filterInput {
    padding: 0.5rem;
    width: 30%;
}

input#text_date {
    pointer-events: none;
    color: #AAA;
    background: #F5F5F5;
}

input#text_select {
    pointer-events: none;
    color: #AAA;
    background: #F5F5F5;
}

input#reference_text {
    pointer-events: none;
    color: #AAA;
    background: #F5F5F5;
}

.r-employeeCode {
    max-width: 80px;
}

.r-companyCode {
    max-width: 30px;
}

.r-types {
    max-width: 110px;
}


.check{
    pointer-events: all;
}

.no-check{
    pointer-events: none;
}
.disabled-row 
			 {
        		background-color: #f2f2f2; /* Grey background */
 			   }