@media screen {
html {
position: absolute;
top: 0;
bottom: 0;
right: 0;
left: 0;
}
body {
position: absolute;
bottom: 4px;
top: 0px;
bottom: 0px;
left: 0px;
right: 0px;
min-width: 320px;
border-radius: 6px 6px 6px 6px;
}
.shadow {
-moz-box-shadow: 0px 3px 4px 0px rgb(80, 80, 80);
-webkit-box-shadow: 0px 3px 4px 0px rgb(80, 80, 80);
box-shadow: 0px 3px 4px 0px rgb(80, 80, 80);
}
.inset-shadow {
-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 {}
.round-btn {
padding: 0px;
width: 22px;
border-radius: 18px;
color: rgb(255, 255, 255);
border: 1px solid rgb(34, 47, 54);
}
.round-btn:hover {
background-color: rgba(34, 47, 54, 0.9);
cursor: pointer;
}
.btn-add, .btn-remove, .btn-edit {
color: rgb(255, 255, 255);
display: inline-block;
vertical-align: middle;
border-radius: 18px;
border: 1px solid rgb(120, 145, 200);
font-weight: bold;
font-size: 10pt;
text-align: center;
width: 22px;
padding: 0px 0px 0px 0px;
cursor: pointer;
}
.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(210, 250, 210);
}
.btn-edit img {
margin-top: -4px;
margin-left: -2px;
}
.clonable .btn-add~.clonable .btn-remove {
display: none;
}
.btn-add~.btn-edit {
display: none;
}
.row-controls {
width: 55px;
white-space: nowrap;
/*visibility: hidden;*/
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, .time-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);*/
}
#printable {
position: fixed;
left: 0px;
top: 0px;
right: 0px;
bottom: 0px;
}
#print-contents {
position: fixed;
margin-top: 31px;
top: 0;
bottom: 0;
left: 0;
right: 0;
overflow: auto;
}
.payslip, .irp5 {
margin-bottom: 30px;
}
}
@PAGE {
margin: 4mm;
size: 210mm 297mm;
}
@media print {
#print {
display: none;
visibility: hidden;
}
#printable {
/*position : relative;*/
overflow: visible;
margin-top: 0;
top: 0;
position: static;
}
#print-control {
display: none;
visibility: hidden;
width: 0px;
}
#print-control>* {
display: none;
visibility: hidden;
}
#print-contents {
margin-top: 0;
top: 0;
margin-bottom: 0;
bottom: 0;
display: block;
}
#page-header {
display: none;
visibility: hidden;
}
#session_info {
display: none;
}
#page-body/*> * */
{
display: none;
visibility: hidden;
}
table {
border-collapse: collapse;
border: none;
}
th {
text-align: center;
vertical-align: middle;
cursor: pointer;
}
.non-printable, .btn-add, .btn-remove, .btn-edit {
display: none;
border: none;
}
.calendar-button, .time-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;
}
.table-container {
max-width: 300px;
}
}
@media (min-width: 720px) and (max-width: 6000px) {
#available_leave {
/*float : left; */
margin-top: 3px;
*width: 150px;
*height: auto;
}
.path-input {
min-width: 443px;
}
#page-menu+.after-menu {
left: 20%;
}
.table-container {
max-width: 900px;
}
}
@media (min-width: 1080px) {
#website-name {
left: 328px;
}
.table-container {
max-width: 1080px;
}
}
@media (min-width: 0px) and (max-width: 1080px) {
#website-name {
left: 30.9%;
}
.table-container {
max-width: 900px;
}
}
@media (min-width:
/*32*/
0px) and (max-width: 721px) {
#page-menu+.after-menu {
left: 140px;
}
.table-container {
max-width: 600px;
}
}
@media (min-width: 0px) and (max-width: 420px) {
.table-container {
max-width: 300px;
}}
body {
font-family: Trebuchet MS;
font-size: 10pt;
}
#javascript_error {
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;
top: -12px;
right: 15px;
padding: 0px;
font-size: 60%;
font-weight: bold;
text-align: center;
}
#page-header {
color: rgb(212, 13, 8);
border-radius: 6px 6px 0px 0px;
height: 106px;
position: absolute;
right: 0;
left: 0;
border: none;
border-collapse: collapse;
}
#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: 106px;
right: 0;
left: 0;
}
#page-menu {
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;
}
#btn-show-hide-menu * {}
#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 {
height: 86px;
border: none;
}
#company-logo a {
width: 30%;
max-width: 320px;
border: none;
text-decoration: none;
}
#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;
}
#company-name {
/*float : right;
margin-top : 36px;
margin-right : 10px;
text-align : right;
right : 8px;
position : absolute;
border : 1px solid;*/
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;
}
.inline {
display: inline-block;
}
.inline.float-left {
padding-right: 8px;
}
.tab-menu {
margin: 14px 10px 0px 10px;
font-weight: bold;
cursor: default;
}
.tab-menu-item {
border: 1pt solid rgb(0, 0, 0);
border-bottom: none;
/*padding-left : 3px;
padding-right : 3px;*/
margin-right: -5px;
cursor: pointer;
padding: 4px 8px 4px 8px;
}
.tab-menu-selected {
border-color: rgba(180, 180, 180, 0.9);
border-bottom: 1px solid rgb(250, 250, 250);
/*rgb(212,13,8);*/
text-shadow: -1px 0px rgba(212, 13, 8, 0.3), 0px 1px rgba(212, 13, 8, 0.3), 1px 0px rgba(212, 13, 8, 0.3), 0px -1px rgba(212, 13, 8, 0.3);
}
.tab-menu-item:first-child {
border-radius: 6px 0px 0px 0px;
}
.tab-menu-item:last-child {
border-radius: 0px 6px 0px 0px;
}
.tab-nav-hr-sep {
margin: 4px -6px 0px -5px;
border-color: rgb(212, 13, 8);
}
.datagrid {
border: 1px solid;
border-collapse: collapse;
overflow: auto;
height: 410px;
max-height: 410px;
width: 100%;
max-width: 1024px;
margin-left: auto;
margin-right: auto;
}
.datagrid table, .datagrid .table {
width: 100%;
margin: -1px;
}
.datagrid .table-cell, .datagrid td {
padding: 0;
}
.datagrid input, .datagrid textarea, .datagrid select {
border: none;
border-radius: 0px;
margin: 0;
/*padding : 0;
margin : -1px -2px;*/
}
.w300 {
min-width: 300px;
}
.h300 {
min-height: 300px;
}
.tree-view {
border: 2px inset;
background: rgba(255, 255, 255, 0.9);
min-height: 290px;
max-height: 420px;
padding: 6px 4px;
overflow: auto;
}
.tree-view>.tree-node>.node>.node-icon {
margin-left: -11px;
}
.tree-view>.tree-node>.child .node-icon {
margin-left: -6px;
*margin-right: 4px;
}
.node {
max-height: 22px;
white-space: nowrap;
cursor: pointer;
outline: none;
}
.node-title {
padding-left: 5px;
padding-right: 5px;
}
.node:hover>.node-title {
background-color: rgb(240, 240, 240);
color: rgb(0, 0, 0);
}
.node>* {
vertical-align: middle;
}
.node>div {
display: inline-block;
border-bottom: 1px solid;
border-left: 1px solid;
width: 16px;
height: 21px;
*margin: -18px -2px 0px -1px;
margin-top: -20px;
z-index: 1;
}
.node-icon {
border: 1px solid;
border-radius: 18px;
width: 10px;
margin: 0px 0px 0px 0px;
z-index: 2;
cursor: pointer;
background: rgba(255, 255, 255, 1);
}
.child {
padding-left: 16px;
*margin-top: -9px;
*padding-top: 10px;
}
.tree-node>.child, .tree-node>.parent {
border-left: 1px solid;
}
.tree-node>.parent>div {
margin-left: -1px;
}
.tree-node.last>.child, .tree-node.last>.parent {
border-left: none;
}
.tree-node.last>.parent>div {
margin-left: 0px;
}
#com-notselected {
height: 403px;
}
#com-selected .list-item {
cursor: pointer;
font-size: 10pt;
font-family: Trebuchet MS;
border-collapse: collapse;
border-spacing: 0px;
height: 11.5pt;
}
#com-selected .selected {
font-weight: normal;
background-color: rgb(0, 120, 215);
color: rgb(255, 255, 255);
}
.list-box {
height: 401px;
border: 1px inset;
background-color: rgba(254, 254, 254, 1);
margin-bottom: 5px;
overflow: auto;
}
.list-item {}
.list-item:hover {
background-color: rgb(230, 230, 230);
}
#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;
border: none;
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;
}
#printable {
background-color: rgba(255, 255, 255, 0.95);
z-index: 5;
display: none;
}
#print-control {
position: fixed;
margin-left: auto;
margin-right: auto;
left: 0px;
right: 0px;
top: 0px;
color: rgb(255, 255, 255);
font-weight: bold;
padding: 4px 0px 3px 0px;
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);
}
.amount {
width: 90px;
}
.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;
}
/*__________________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: 4;
}
#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;
}
.navigation-bar a {
clear: both;
text-decoration: none;
color: rgb(230, 230, 255);
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;
border: 1px solid rgb(125, 158, 217);
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;
color: rgb(250, 250, 255);
*min-height: 29px;
font-weight: bold;
*padding: 1px 2px 1px 2px;
border-radius: 16px;
}
#navigation-prev {
margin-right: 2px;
}
#navigation-next {
margin-left: 2px;
}
.calendar-button:hover, .time-button:hover {
border: 1px solid rgb(250, 120, 120);
}
.navigation-button {
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;
color: black;
}
.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-heading:hover .calendar-title div {
display: none;
}
.calendar-heading:hover select, .calendar-heading: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 */
}
.approved {
background: rgba(146, 208, 80, 0.7);
/* Old browsers */
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 : rgb(220,220,220);
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 : rgba(255, 165, 5, 0.9);
*color :red; */
}
.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, 0.9);
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: 4;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
filter: alpha(opacity=80);
-moz-opacity: 0.8;
-khtml-opacity: 0.8;
opacity: 0.8;
}
.dialog.confirm .dlg-ok, .dialog.message .dlg-yes, .dialog.message .dlg-no, .dialog.message .dlg-cancel {
display: none;
}
#formula-list {
right: 40px;
width: 220px;
position: fixed;
}
#insurance-form {
right: 33px;
min-width: 564px;
position: fixed;
z-index: 10;
}
#overtime-form {
right: 33px;
position: fixed;
z-index: 10;
}
#budget-codes {
width: 80%;
max-height: 600px;
max-width: 800px
}
#budget-codes .dialog-contents {
min-height: 250px;
}
#scoa-segments {
width: 500px;
max-height: 600px;
}
#scoa-segments .tree-view {
margin: 0;
max-height: 320px;
/*max-width : 420px;*/
}
#scoa-segments .dialog-controls .table {
margin-left: 0;
margin-right: 0;
}
.inherit-width {
width: 100%;
max-width: 100%;
}
.fill-container {
height: 100%;
width: 100%;
position: absolute;
margin: 0px 0px;
padding: 0px;
left: 0px;
right: 0px;
bottom: 0px;
top: 0px;
}
.aboutdialog {
font-size: 10pt;
}
.opendialog {
width: 320px;
}
.aboutdialog, .claimtypesdialog, .companydialog, .leavetypesdialog, .paytypesdialog, .remarkstypesdialog, .resigntypesdialog {
width: 360px;
}
.messagesdialog, .employeesdialog {
width: 540px;
}
.focused-dialog {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
filter: alpha(opacity=100);
-moz-opacity: 1;
-khtml-opacity: 1;
opacity: 1;
z-index: 8;
}
.focused-dialog .dialog-title {
font-weight: bold;
}
.dialog-title {
font-size: 10pt;
padding: 4px;
border-radius: 6px 6px 0px 0px;
margin-bottom: 4px;
padding: 6px;
}
.btn-close {
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-top : -2px; */
/*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;
max-height: 350px;
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);*/
}
.selectable:hover, .selectable:hover .table-cell * {
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: 45px;
height: 45px;
vertical-align: top;
}
.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: block;
}
textarea:focus~.input-status {
visibility: visible;
}
.selected {
font-weight: bold;
background-color: rgb(0, 64, 128);
color: rgb(255, 255, 255);
}
.selected .table-cell * {
background-color: rgb(0, 64, 128);
color: rgb(255, 255, 255);
}
.control-panel {
margin-left: auto;
margin-right: auto;
text-align: center;
border-radius: 8px;
padding: 6px 6px 5px 6px;
z-Index: 2;
border: 1px inset;
}
.control-panel span {
display: inline-block;
}
.control-field {
min-width: 240px;
height: 24px;
font-weight: bold;
margin-bottom: 4px;
border: 1px inset rgb(245, 245, 245);
}
.control-button {
width: 28px;
cursor: pointer;
border-radius: 6px;
border: 1px solid rgb(34, 47, 54);
background: rgb(166, 169, 171);
margin-top: 2px;
margin-bottom: 2px;
}
.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);
}
#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;
}
.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 {
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 {
cursor: pointer;
}
.disable {
display: none;
position: absolute;
padding: 0px;
background-color: rgba(250, 250, 250, 0.5);
}
.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;
}
a img {
text-decoration: none;
border: none;
}
.page-title {
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-radius: 2px 2px 8px 8px;
min-width: 110px;
width: 290px;
margin-left: auto;
margin-right: auto;
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, 158, 217);
border-radius: 4px 4px 8px 8px;
box-shadow: 1px 1px 5px 1px rgb(80, 80, 80) inset;
color: rgb(230, 245, 250);
padding: 4px 8px 4px 8px;
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 {
background-color: rgb(34, 47, 54);
float: right;
left: 8px;
margin-right: 4px;
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_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, .expanded {
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-left: 4%;
margin-right: auto;
*padding-right: 26px;
*width: 100%;
*position: relative;
}
.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 {
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 {
cursor: pointer;
width: 97%;
margin-left: auto;
margin-right: auto;
margin-bottom: 4px;
}
.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 {
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);
}
.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-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;
}
.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 {
height: 100%;
overflow: auto;
}
table {
border-radius: 4px;
font-size: 9pt;
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);
padding-left: 3px;
padding-right: 3px;
padding-top: 3px;
padding-bottom: 3px;
vertical-align: middle;
}
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-body {
*display: table-row-group;
*overflow: scroll;
*border: 1px solid green;
}
.table-row {
border-radius: 4px;
display: table-row;
}
.table-row .selectable:hover {
background-color: rgb(230, 230, 230);
cursor: pointer;
}
.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;
}
.table-cell textarea {
width: 140px;
height: 22px;
min-height: 22px;
}
.table-cell {
display: table-cell;
border: 1px solid rgb(0, 0, 0);
padding-top: 2px;
padding-left: 3px;
padding-right: 3px;
padding-bottom: 2px;
vertical-align: middle;
}
.table-cell input, .table-cell select, .table-cell img {
vertical-align: middle;
}
.integer-column {
text-align: right;
}
.integer-column input {
text-align: right;
margin-left: auto;
margin-right: auto;
width: 90%;
}
.no-padding {
padding: 0px;
}
.border-rad {
border-radius: 6px;
}
.add-padding {
padding: 3px 6px 3px 6px;
}
.collapsed-border {
border-collapse: collapse;
}
.bw-2 {
border-width: 2px;
}
.bw-top-2 {
border-top-width: 2px;
}
.bw-right-2 {
border-right-width: 2px;
}
.bw-bottom-2 {
border-bottom-width: 2px;
}
.bw-left-2 {
border-left-width: 2px;
}
.no-borders {
border: 3px;
background-color: rgba(0, 0, 0, 0);
}
.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: 11pt;
}
.valign-top {
vertical-align: top;
}
.valign-middle {
vertical-align: middle;
}
.valign-clear {
vertical-align: clear;
}
.center {
margin-left: auto;
margin-right: auto;
}
.align-center {
text-align: center;
}
.align-left {
text-align: left;
}
.align-right {
text-align: right;
}
.fixed-vertical {
height: 18px;
}
.sub-title {
margin-top: 20px;
}
.input_label {
display: inline-block;
width: 75px;
text-align: left;
color: rgb(254, 254, 254);
font-family: trebuchet ms;
border: none;
}
.input_text {
border: 1px solid rgb(245, 245, 245);
font-weight: bold;
height: 25px;
padding-left: 2px;
}
#login {
cursor: default;
margin-left: auto;
margin-right: auto;
margin-top: 6%;
display: inline-block;
}
#login span {
cursor: default;
}
#login .div_row_large, #login .div_row_normal {
position: relative;
}
#login fieldset {
border: 1px solid rgb(212, 13, 8);
border-radius: 18px;
color: rgb(255, 255, 255);
padding-top: 26px;
border: none;
}
#login legend {
text-align: center;
width: 94.5%;
}
#login input:focus {
background: rgb(54, 67, 74);
}
#salaries fieldset {
border: none;
border-top: 1px solid rgb(212, 13, 8);
border-radius: 4px;
display: block;
margin: 0 auto;
margin-top: 5px;
vertical-align: top;
background: rgba(254, 254, 254, 0.7);
}
.half-width2 {
width: 49%;
display: inline-block;
min-width: 200px;
vertical-align: top;
position: relative;
margin-right: 2px;
padding-right: 2px;
margin-left: 2px;
padding-left: 2px;
}
fieldset {
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);
}
legend {
background: rgb(34, 47, 54);
border-radius: 6px;
color: rgb(254, 254, 254);
cursor: default;
font-size: 10pt;
font-weight: bold;
font-family: arial;
padding: 4px 8px 4px 8px;
}
#page-contents legend:hover {
color: rgb(250, 250, 255);
}
.div_row_large {
font-weight: bold;
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;
}
.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;
width: 150px;
text-align: left;
border: none;
}
.field_value {
vertical-align: middle;
min-width: 260px;
z-index: 2;
text-align: left;
}
input, select, textarea
/*.field_value input[type=text], .field_value input[type=password], .field_value select, .field_value textarea /*, .table input*/
{
font-size: 10pt;
font-family: Trebuchet MS;
margin-right: 0px;
border-radius: 4px;
border-width: 1px;
border-collapse: collapse;
border-style: solid;
border-color: rgba(34, 47, 54, 0.65);
}
.field_value input[type=text], .field_value input[type=password], .field_value textarea, .field_value .payslip-logo {
width: 190px;
}
.field_value select {
width: 195px;
}
.btn-browse-file {
cursor: pointer;
}
.payslip, .irp5 {
page-break-inside: avoid;
page-break-after: auto;
}
.payslip table, .payslip {
width: 100%;
height: 260mm;
margin-left: 0;
margin-right: 0;
left: 0;
right: 0;
}
.payslip .elongate-vertical {
height: 500px;
}
.payslip .elongate-vertical-pdf {
height: 220mm;
}
.edition {
position: absolute;
margin-left: -18px;
margin-top: -53px;
height: 109px;
}
.code {
max-width: 65px;
}
input[readonly] {
background-color: rgba(200, 200, 200, 0.5);
border: 1px solid rgba(80, 80, 80, 0.3);
}
textarea {
width: 250px;
height: 120px;
vertical-align: top;
}
.field_value select {}
.field_value .btn-lookup {
height: 24px;
}
.field_value .btn-lookup img {
margin-top: 2px;
}
.btn-lookup {
display: inline-block;
position: relative;
margin-left: -5px;
vertical-align: middle;
padding-left: 2px;
border: 1px solid rgba(0, 0, 0, 0.1);
border-left: none;
}
.btn-lookup img {
height: 18px;
}
.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;
}
.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: 130px;
width: 130px;
}
.full-width {
width: 99.9%;
}
.half-width {
width: 49%;
display: inline-block;
min-width: 250px;
vertical-align: top;
position: relative;
margin-right: 2px;
padding-right: 2px;
margin-left: 2px;
padding-left: 2px;
}
.unlimited-half {
width: 47%;
display: inline-block;
margin-right: 2px;
}
.fixed-position {}
.subject {
min-width: 50%;
}
.font-12pt, .f12 {
font-size: 10pt;
}
.font-10pt, .f10 {
font-size: 10pt;
}
.font-8pt, .f8 {
font-size: 8pt;
}
.c1, .one-char {
max-width: 20px;
width: 20px;
text-align: center;
}
input.c2, input.two-chars {
max-width: 30px;
width: 30px;
}
select.c2, select.two-chars {
max-width: 40px;
width: 40px;
}
input.c3, input.three-chars, .c3 {
max-width: 35px;
width: 35px;
}
select.c3, select.three-chars {
max-width: 50px;
width: 50px;
}
.c4 {
max-width: 55px;
width: 55px;
}
.c5, .five-chars {
max-width: 60px;
width: 60px;
}
.c6, .six-chars {
max-width: 65px;
width: 65px;
}
.c7 {
max-width: 70px;
width: 70px;
}
.c8, .eight-chars {
max-width: 80px;
width: 80px;
}
.c9, .nine-chars {
max-width: 90px;
width: 90px;
}
.c10, .ten-chars {
max-width: 100px;
width: 100px;
}
.c11 {
max-width: 110px;
width: 110px;
}
.c12 {
max-width: 120px;
width: 120px;
}
.c13 {
max-width: 130px;
width: 130px;
}
.c14 {
max-width: 140px;
width: 140px;
}
.c15, .fifteen-chars {
max-width: 150px;
width: 150px;
}
.c16 {
max-width: 160px;
width: 160px;
}
.c17 {
max-width: 170px;
width: 170px;
}
.c18 {
max-width: 180px;
width: 180px;
}
.twenty-chars, .c20 {
max-width: 200px;
width: 200px;
}
.c22 {
max-width: 220px;
width: 220px;
}
.c25 {
max-width: 250px;
width: 250px;
}
.c26 {
max-width: 260px;
width: 260px;
}
.thirty-chars, .c30 {
width: 300px;
max-width: 300px;
}
.forty-chars, .c40 {
width: 400px;
max-width: 400px;
}
input[maxlength="11"] {
width: 75px;
}
input[maxlength="2"] {
width: 30px;
}
#login input[type="text"]:focus, #login input[type="password"]:focus {
text-align: left;
}
.required_field {
border-color: rgb(255, 0, 0);
box-shadow: 0px 0px 2px 1px rgb(255, 10, 10);
}
a.button {
display: inline-block;
padding: 2px 4px 2px 4px;
white-space: nowrap;
text-decoration: none;
}
a.button * {
vertical-align: middle;
height: 22px;
}
button {
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);
}
.field_value button, .table button {
min-width: 22px;
}
button:hover {
border: 1px solid rgb(212, 212, 212);
}
button * {
vertical-align: middle;
font-weight: bold;
height: 18px;
}
.dark-bg {
background: rgb(34, 47, 54);
color: rgb(254, 254, 254);
}
.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 {
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;
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 */
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(190, 206, 236);
color: rgb(245, 245, 255);
padding-left: 4px;
padding-right: 4px;
}
.link-button:hover {
color: rgb(255, 255, 255);
border-color: rgb(155, 180, 225);
}
.link-button:active {
border-color: rgb(255, 120, 120);
color: rgb(255, 235, 235);
}
.frequently-used {
display: none;
}
.overlayed-panel, #overlayed-panel {
background-color: rgba(255, 255, 255, 0.5);
position: fixed;
top: 104px;
left: 8px;
right: 8px;
bottom: 8px;
display: none;
z-index: 7;
text-align: center;
}
.busy_gif {
height: 56px;
border-radius: 50px;
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;
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: 12pt;
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;
}
#searchable-options {
position: absolute;
padding: 0px;
}
#searchable-options input {
width: 98%;
border-color: rgb(100, 100, 100);
}
#searchable-options #options {
background-color: rgb(250, 250, 250);
border: 1px solid rgb(100, 100, 100);
}
/*******
NEW
*******/
.border-left-radius {
border-radius: 5px 0px 0px 5px;
}
.hide {
display: none;
}
.padding-15 {
padding: 15px;
}
/**
* PROGRESS BAR
**/
.progress-bar {
position: absolute;
/*text-align: center;*/
margin-left: -50px;
margin-top: -15px;
left: 50%;
top: 50%;
border-radius: 18px;
width: 100px;
}
.progress-bar div {
display: inline-block;
height: 30px;
width: 30px;
vertical-align: middle;
}
.progress-bar>div>div {
display: none;
transition: background-color 0.1s ease;
border-radius: 16px;
}
/**
* BADGE BAR
**/
#badge-bar {
position: fixed;
left: 0;
bottom: 0;
padding-left: 12px;
padding-bottom: 8px;
}
#badge-bar img {
height: 42px;
}
#bottom-bar {
position: fixed;
right: 0;
bottom: 0;
padding: 4px 8px 4px 16px;
border-radius: 36px 0px 6px 0px;
border: 1px solid rgba(212, 13, 8, 0.3);
border-bottom: none;
color: rgba(212, 13, 8, 0.3);
font-size: small;
margin-right: 10px;
margin-bottom: 10px;
}
/**
* BACKGROUNDS
**/
.bgd {
background: rgb(42, 44, 47);
color: rgb(248, 248, 248);
}
.bbr {
border-bottom: 2px solid rgb(212, 13, 8);
}
/**
* FONTS
**/
.fcg, .fcg a {
color: rgb(130, 130, 130);
}
.dashitem {
display: inline-block;
width: 45%;
vertical-align: top;
margin-left: auto;
margin-right: auto;
min-width: 300px;
min-height: 230px;
}
.rdius {
border-width: 1px;
border-radius: 4px;
padding: 4px;
margin-top: 8px;
margin-bottom: 8px;
}
.margin-top-10 {
margin-top: 10px;
}
.width-240px {
width: 240px;
}
.width-480px {
width: 480px;
}
table {
display: block;
width: 100%;
margin: 4px auto;
border: 1px solid rgb(220, 220, 220);
resize: both;
position: relative;
}
table.collapsed {
border-collapse: collapse;
}
.table-container {
max-height: 320px;
overflow: auto;
margin: 0 auto;
}
/**
* DIALOGS
*/
.newUser-dialog {
left: 25%;
width: 520px;
}
.confirm-dialog {
left: 40%;
top: 20%;
}
.pwChange-dialog {
left: 18%;
width: 520px;
}
.newCompany-dialog {
left: 18%;
width: 520px;
}
.newSite-dialog {
left: 18%;
width: 520px;
}
.siteUsers-dialog {
left: 25%;
}
.transPhoto-dialog {
left: 25%;
}
.transmap-dialog {
left: 18%;
width: 520px;
height: 520px;
}
tr:nth-child(even):not(.in):not(.out):not(.photo):not(.call_in):not(.call_out):not(.selected) *:not(.bgd){
background-color: rgb(245, 245, 245);
}
.in, .success{
border-bottom: 2px solid rgba(23, 109, 33, 1);
background-color: rgba(23, 109, 33, 0.1);
}
.call_in{
border-bottom: 2px solid rgba(7, 183, 24, 1);
background-color: rgba(7, 183, 24, 0.1);
}
.out, .fail{
border-bottom: 2px solid rgba(212, 13, 8, 1);
background-color: rgba(212, 13, 8, 0.1);
}
.call_out{
border-bottom: 2px solid rgba(225, 84, 32, 1);
background-color: rgba(225, 84, 32, 0.1);
}
.photo, .warning{
border-bottom: 2px solid rgba(225, 171, 33, 1);
background-color: rgba(225, 171, 33, 0.1);
}
.selected, .selected *, .leave .bullet{
background-color: rgba(66, 131, 244, 0.9);
}
.leave{
background-color: rgba(66, 131, 244, 0.2);
}
.shift{
background-color: rgba(225, 171, 33, 0.2);
}
.shift .bullet{
background-color: rgba(225, 171, 33, 0.9);
}
.ph{
background-color: rgba(23, 109, 33, 0.2);
}
.ph .bullet{
background-color: rgba(23, 109, 33, 0.9);
}
.add-ded{
background-color: rgba(130, 130, 130, 0.2);
border-bottom: 2px solid rgba(130, 130, 130, 0.9);
}
/* ___________________________________ Hex Formater __________________________ */
/* Layout */
div#hexlayout {
position: absolute;
height: 100%;
width: 100%;
z-index: 1;
overflow: hidden;
font-size: 16px;
}
a {
text-decoration: none;
}
.clr:after {
content: "";
display: block;
clear: both;
}
#title {
position: fixed;
top: 0;
right: 0;
height: 100px;
width: 70%;
z-index: 995;
-o-box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
padding: 10px 0 0 6%;
background: #FFFFFF;
text-align: center;
}
#item1, #item2, #item3, #item4, #item5, #item6, #item7, #item8, #item9, #item10, #item11, #item12, #item13, #item14, #item15 {
overflow: hidden;
z-index: 999;
display: block;
position: fixed;
top: 0;
right: -100%;
height: 0;
width: 100%;
background: white;
-o-transition: transform 0.6s linear 0s, height 0s linear 0.6s;
-moz-transition: transform 0.6s linear 0s, height 0s linear 0.6s;
-ms-transition: transform 0.6s linear 0s, height 0s linear 0.6s;
-webkit-transition: transform 0.6s linear 0s, height 0s linear 0.6s;
transition: transform 0.6s linear 0s, height 0s linear 0.6s;
}
#item1:target, #item2:target, #item3:target, #item4:target, #item5:target, #item6:target, #item7:target, #item8:target, #item9:target, #item10:target, #item11:target, #item12:target, #item13:target, #item14:target, #item15:target {
height: 100%;
overflow: auto;
-o-transition: transform 0.6s linear 0s, height 0s linear 0s;
-moz-transition: transform 0.6s linear 0s, height 0s linear 0s;
-ms-transition: transform 0.6s linear 0s, height 0s linear 0s;
-webkit-transition: transform 0.6s linear 0s, height 0s linear 0s;
transition: transform 0.6s linear 0s, height 0s linear 0s;
-o-transform: translateZ(0) translateX(-100%);
-moz-transform: translateZ(0) translateX(-100%);
-webkit-transform: translateZ(0) translateX(-100%);
-ms-transform: translateZ(0) translateX(-100%);
transform: translateZ(0) translateX(-100%);
}
.left, .right {
position: absolute;
left: 0;
height: 100%;
width: 50%;
overflow: auto;
background: none;
}
.right {
left: 50%;
overflow: hidden;
}
.right img {
height: auto;
width: 120%;
}
/* Hexagonal Grid */
#grid {
width: 70%;
margin: 0 auto 30%;
padding: 20px 2%;
-o-box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
overflow: hidden;
}
#grid li {
position: relative;
float: left;
width: 27.85714285714286%;
padding: 0 0 32.16760145166612% 0;
list-style-type: none;
-o-transform: rotate(-60deg) skewY(30deg);
-moz-transform: rotate(-60deg) skewY(30deg);
-webkit-transform: rotate(-60deg) skewY(30deg);
-ms-transform: rotate(-60deg) skewY(30deg);
transform: rotate(-60deg) skewY(30deg);
overflow: hidden;
visibility: hidden;
cursor: pointer;
}
#grid li * {
visibility: visible;
}
#grid li .hexagon {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
-o-transform: skewY(-30deg) rotate(60deg);
-moz-transform: skewY(-30deg) rotate(60deg);
-webkit-transform: skewY(-30deg) rotate(60deg);
-ms-transform: skewY(-30deg) rotate(60deg);
transform: skewY(-30deg) rotate(60deg);
overflow: hidden;
background: white;
}
#grid li:nth-child(3n+2) {
margin: 0 1%;
}
#grid li:nth-child(6n+4), #grid li:nth-child(6n+5), #grid li:nth-child(6n+6) {
margin-top: -6.9285714285%;
margin-bottom: -6.9285714285%;
}
#grid li:nth-child(6n+1), #grid li:nth-child(6n+2), #grid li:nth-child(6n+3) {
-o-transform: translateX(50%) rotate(-60deg) skewY(30deg);
-moz-transform: translateX(50%) rotate(-60deg) skewY(30deg);
-webkit-transform: translateX(50%) rotate(-60deg) skewY(30deg);
-ms-transform: translateX(50%) rotate(-60deg) skewY(30deg);
transform: translateX(50%) rotate(-60deg) skewY(30deg);
}
#grid li:nth-child(6n+1) {
margin-left: 0.5%;
}
#grid li .hexagon img {
left: -100%;
right: -100%;
height: 100%;
width: auto;
margin: 0 auto;
-o-transition: all 0.6s linear 0s;
-moz-transition: all 0.6s linear 0s;
-ms-transition: all 0.6s linear 0s;
-webkit-transition: all 0.6s linear 0s;
transition: all 0.6s linear 0s;
}
.disableHex {
pointer-events: none;
}
#grid li:hover img {
height: 150%;
-o-transform: translateZ(0) translateX(-25%);
-moz-transform: translateZ(0) translateX(-25%);
-webkit-transform: translateZ(0) translateX(-25%);
-ms-transform: translateZ(0) translateX(-25%);
transform: translateZ(0) translateX(-25%);
}
#grid li .hexagon .overlay {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
background: rgba(70, 69, 69, 0.6);
}
#grid li:hover .overlay {
-o-transition: all 0.6s linear 0s;
-moz-transition: all 0.6s linear 0s;
-ms-transition: all 0.6s linear 0s;
-webkit-transition: all 0.6s linear 0s;
transition: all 0.6s linear 0s;
background: rgba(255, 255, 255, 0);
}
/* Text */
#title h1 {
font-family: poppinssemibold;
font-size: 36px;
font-weight: 200;
color: #575757;
}
/* Media Queries */
@media only screen and (max-width: 1100px) {
/* Layout */
}
@media only screen and (max-width: 870px) {
/* Layout */
}
@media only screen and (max-width: 767px) {
/* layout */
#title {
position: relative;
height: auto;
width: 100%;
padding: 0;
}
#title h1 {
margin: 10px 0;
}
.left, .right {
position: relative;
left: 0;
height: auto;
width: 100%;
}
.right img {
height: auto;
width: 100%;
}
/* Grid */
#grid {
margin: 0 auto;
width: 95%;
}
}
@media only screen and (max-width: 550px) {
/* Layout */
body {
font-size: 14px;
}
}