* {
  box-sizing: border-box;margin:0px;
}

body {
  font-family: 'Verdana';
  font-weight: 400;
  font-size: 12px;
  height:100%;
  width: 100%;
  background-color:#FFFFCC;
}

.head {
  background-color: #00FF66;
  height:50px;
  width: 100%;
}


.container {
  display:grid;
  grid-template-areas: 'leftpane rightpane';
  grid-template-columns: 120px calc(100%-120px);
  height: 100%;

}
.leftpane {
  font-family: 'Verdana';
  font-weight: 400;
  font-size: 12px;
  grid-area: leftpane;
  justify-self: start;
  background-color: #CCFFCC;
  height: 100%;
}


.rightpane {
  grid-area: rightpane;
  justify-self: start;
}

/* Tooltip container */
.tooltip {
  position: relative;
  display: inline-block;
  cursor: pointer;
}

/* Tooltip text */
.tooltiptext {
  visibility: hidden; /* Hidden by default */
  width: 150px;
  background-color: black;
  color: #ffffff;
  text-align: left;
  padding: 8px;
  border-radius: 6px;
  position: absolute;
  z-index: 1; /* Ensure tooltip is displayed above content */
}

/* Show the tooltip text on hover */
.tooltip:hover .tooltiptext {
  visibility: visible;
}
/*.jtable css overrides {
}     */
.jtable-radiobuttonlist-input {
 display:block;
}
.jtable-radio-input {
 display:inline-block;
 padding-right: 5px;
 }

div.jtable-main-container > table.jtable > tbody > tr.jtable-data-row > td > .jtable-show-command-button {
  background: url('themes/metro/view.gif') no-repeat;
  width: 16px;
  height: 16px;
}

.footer {
  background-color: #00FF66;
  font-size: smaller;
  color: grey;
  height:20px;
  width: 100%;
}

.invalid-feedback {
  color:red;
}

.alert-danger {
  color:red;
}

.ui-dialog-titlebar-close {
    visibility: hidden;
}


/* menu css */
.topnav {width: 120px;overflow: hidden;text-align: left;background-color: transparent;margin:0;z-index:999}
.topnav a {overflow:hidden;display: block;color: black;padding:5px;text-align: left;text-decoration: none;background-color:#CCFFCC;}
.topnav .icon {display: none;}
.dropbtn a {overflow:hidden;display: block;color: black;padding:5px;text-align: left;text-decoration: none;background-color:#CCFFCC;}
.dropdown {overflow: hidden;border:none;}
.dropdown .dropbtn {color:black;width:100%;padding:5px;text-align: left;border:none;background-color:#CCFFCC;}
.dropdown-content {margin:-25px 0 0 120px;display: none;position: absolute;background-color: #CCFFCC;z-index: 999;}
.dropdown-content a {float: none;position:relative;padding:5px;border-left: 1px solid black;border-right: 1px solid black;color: black;display: block;text-align: left;z-index:99}
.dropdown-content > a:last-child {border-bottom: 1px solid black;}
.dropdown-content > a:first-child {border-top: 1px solid black;}
.topnav a:hover, .dropdown:hover .dropbtn {}
.dropdown-content a:hover {}
.dropdown:hover .dropdown-content {display: block;}
@media screen and (min-width: 1300px) {
.topnav a {}
.dropdown .dropbtn {}
}
@media screen and (max-width: 1300px) {
.topnav a {}
.dropdown .dropbtn {}
}

@media screen and (max-width: 800px) {
  .topnav a, .dropdown .dropbtn {
    display: none;
  }
  .topnav a.icon {
    float: right;
    display: block;
  }
}

@media screen and (max-width: 800px) {
  .topnav {position: relative;}
  .topnav .icon {
    display: none;
    position: absolute;
    right: 0;
    top: 0;
  }
  .topnav a {
    float: none;
    display: block;
    text-align: left;
    border-radius:0px;
    margin:0px;
  }
  .topnav .dropdown {float: none;}
  .topnav .dropdown-content {position: relative;}
  .topnav .dropdown .dropbtn {
    display: block;
    width: 100%;
    text-align: left;
    border-radius:0px;
    margin:0px;
  }

.dropdown-content {margin:0px;display: none;position: absolute;background-color: #CCFFCC;z-index: 999;}

  .topnav .dropdown-content a {
  float: none;
  color: black;
  text-decoration: none;
  display: block;
  text-align: left;
  border:none;
  }
}