:root {
  font-size: 8pt;
}

body {
  font-family: Verdana, Arial, Helvetica;
  background-color: #EEEEEE;
}

/* Bootstrap heading overrides */
h1, .h1 {
  font-size: 2rem;
}

@media (min-width: 1200px) {
  h1, .h1 {
    font-size: 2rem;
  }
}

h2, .h2 {
  font-size: 1.5rem;
}

@media (min-width: 1200px) {
  h2, .h2 {
    font-size: 1.5rem;
  }
}

h3, .h3 {
  font-size: 1.25rem;
}

@media (min-width: 1200px) {
  h3, .h3 {
    font-size: 1.25rem;
  }
}

h4, .h4 {
  font-size: 1.125rem;
}

@media (min-width: 1200px) {
  h4, .h4 {
    font-size: 1.125rem;
  }
}

h5, .h5 {
  font-size: 1rem;
}

h6, .h6 {
  font-size: 1rem;
}


#main-frame {
  margin: 0 auto;
  width: 1003px;
}

#login-frame {
  margin: 0 auto;
  width: 355px;
}

a {
  color: #333;
}

.pagefont {
  font-family: Verdana, Arial, Helvetica;
  font-size: 8pt;
}

.fonttiny {
  font-family: Verdana, Arial, Helvetica;
  font-size: 7pt;
}

tr.titlebar td {
  padding: 5px;
}

#header {
  margin-top: 8px;
  border: 1px solid #666666;
  /*border-bottom: 0;*/
}

#header img {
  display: block;
  width: 100%;
}

#alert-message-container {
  background: url('/pics/infobg_1.jpg');
  width: 698px;
  height: 70px;
  padding: 10px;
}

#alert-message img {
  float: left;
}

#alert-message ul {
  margin: 0;
  margin-left: 60px;
  padding: 3px 0;
}

#main-navigation {
  background-color: #760000;
  /*height: 50px;*/
  text-align: left;
}

#main-navigation ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

#main-navigation ul li {
  display: block;
  color: white;
  text-align: center;
  width: 150px;
  float: left;
}

#main-navigation ul li a {
  display: block;
  text-decoration: none;
  color: white;
  text-align: center;
  padding: 5px 0;
}

#main-navigation ul li.selected a,
#main-navigation ul li a:hover {
  background-color: #D0A199;
}

#main-navigation ul li.disabled a {
  color: #AAAAAA;
}

#company-name {
  display: block;
  float: right;
  padding: 5px;
  color: white;
}

#sub-navigation ul.sub,
#sub-navigation ul.deep {
  list-style: none;
  margin: 0;
  padding: 0;
  background-color: #e3e3e3;
}

#sub-navigation ul.deep {
  background-color: #ffffdf;
  display: none;
}

#sub-navigation ul.sub > li.selected > ul.deep {
  display: block;
}

#sub-navigation ul.sub > li,
#sub-navigation ul.deep > li {
  display: block;
  list-style: none;
}

#sub-navigation ul.sub > li > a,
#sub-navigation ul.deep > li > a {
  display: block;
  text-decoration: none;
  padding: 5px;
}

#sub-navigation ul.deep > li > a {
  background-image: url('/pics/right_disabled.gif');
  background-repeat: no-repeat;
  background-position: left 5px bottom 8px;
  padding-left: 15px;
}

#sub-navigation ul.sub > li > a:hover {
  background-color: #cccccc;
  color: inherit;
}

#sub-navigation ul.sub > li.selected > a {
  background-color: #7d7c91;
  color: white;
}

#sub-navigation ul.deep > li.selected a,
#sub-navigation ul.deep > li > a:hover {
  background-color: #ffff88;
  color: inherit;
  background-image: url('/pics/right.gif');
  /*font-weight: bold;*/
}


/* search-bar part */
#search-bar {
  padding: 2px;
}

#search-bar input {
  float: left;
  width: 180px;
  height: 20px;
  border: 1px solid #555;
  margin-right: 12px;
}

#letters-bar {
  height: 20px;
  list-style: none;
  margin: 0;
  padding: 0 5px 0 0;
}

#letters-bar > li {
  list-style: none;
}

#letters-bar > li a {
  display: block;
}

#letters-bar > li:nth-child(2n) {
  background-color: #e8e8e8;
}

#letters-bar > li a:hover {
  color: inherit;
  background-color: #ffff88;
}

#touch-buttons {
  /*padding: 10px;*/
}

#touch-buttons ul {
  margin: 0;
  padding: 0;
}

#touch-buttons ul > li {
  display: block;
  list-style: none;
  margin: 16px 0 0 20px;
  padding: 0;
  float: left;
}

#touch-buttons ul > li a {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
  width: 200px;
  height: 50px;
  font-size: 10pt;
  font-weight: bold;
  background: URL(/pics/_indexbg_1.jpg) no-repeat;
  border: 1px solid #555555;
}

#touch-buttons ul > li a:hover {
  color: inherit;
  opacity: 0.5
}

table.main {
  width: 1003px;
  font-family: Verdana, Arial;
  font-size: 8pt;
  margin-top: 1px;
  border-collapse: collapse;
  border-bottom: 1px solid #666666;
  background-color: white;
  text-align: left;
}

table.login {
  width: 355px;
  font-family: Verdana, Arial;
  font-size: 8pt;
  /*margin-top: 2px;*/
  border-collapse: collapse;
  border: 1px solid #666666;
  border-bottom-width: 0px;
  border-top-width: 0px;
  background-color: white;
}

table.logo {
  width: 355px;
  margin-top: 5px;
  border: 1px solid #666666;
  background-color: white;
}

td {
  text-align: left;
}

td.headerbar {
  color: white;
  background: #760000;
  border: 0px;
  text-align: left;
}

input {
  height: 23px;
  border: 1px solid #222222;
}

input.norm {
  height: 23px;
  width: 150px
}

select {
  background-color: #ffffdf;
  height: 22px;
  width: 150px;
  border: 1px solid #222222;
}

table.work_header {
  font-family: Verdana, Arial;
  font-size: 8pt;
  border-spacing: 0px;
  border-width: 0px;
  vertical-align: top;
  text-align: left;
}

table.menutracker {
  width: 150px;
  font-family: Verdana, Arial;
  font-size: 7pt;
  border-spacing: 0px;
  border-width: 0px
}

.infobox {
  text-align: left;
  font-size: 14px;
}

.infobox .titlebar {
  color: white;
  background-color: #760000;
  font-size: 18px;
  padding: 5px;
  margin-bottom: 10px;
}

.infobox h3 {
  margin: 20px 0 5px 0;
}

.infobox p {
  margin: 0 0 10px 0;
}

.actionicon {
  display: inline-block;
  width: 20px;
  height: 20px;
  cursor: pointer;
}

.model_changepic {
  background-image: url('/pics/edit_off.gif');
}

.model_changepic:hover {
  background-image: url('/pics/edit_on.gif');
}

.fancybox.manufacturer {
  background-image: url('/pics/info_off.gif');
}

.fancybox.manufacturer:hover {
  background-image: url('/pics/info_on.gif');
}

.fancybox.template {
  background-image: url('/pics/template_off.gif');
}

.fancybox.template:hover {
  background-image: url('/pics/template_on.gif');
}

.actionicon.question {
  background-image: url('/pics/question_off.gif');
}

.actionicon.question:hover {
  background-image: url('/pics/question_on.gif');
}

#damage-takover {
  display: inline-block;
  padding: 4px;
  border: 1px solid #333;
  font-size: 14px;
}

#damage-takover.a {
  background-color: #88FF88;
  border-color: #44FF44;
}

#damage-takover.b {
  background-color: #FFFF88;
  border-color: #FFDD44;
}

#damage-takover.d {
  background-color: #FF8888;
  border-color: #FF4444;
}


table.infobox {
  width: 100%;
  font-family: Verdana, Arial;
  font-size: 7pt;
  border-spacing: 0px;
  border-width: 0px
}

/*table.navig {
    font-family: Verdana, Arial;
    font-size: 8pt;
    border-spacing: 0px;
    border-width: 0px;
    background-color: white
}*/

table.work {
  width: 100%;
  font-family: Verdana, Arial;
  font-size: 8pt;
  border-spacing: 0px;
  border-width: 0px;
  background-color: white
}

table.workTop {
  font-family: Verdana, Arial;
  font-size: 8pt;
  border-spacing: 0px;
  border-width: 0px;
  height: 14px
}

td {
  font-family: Verdana, Arial;
  font-size: 8pt;
  /*border:1px solid #666666*/
}

td.work_header {
  font-size: 8pt;
  border-spacing: 0px;
  border-width: 0px
}

td.noborder {
  font-family: Verdana, Arial;
  font-size: 8pt;
  border-style: solid;
  border-width: 0px;
}

td.navig {
  font-size: 8pt;
  height: 17px;
  border-spacing: 0px;
  border-width: 0px
}

td.work {
  font-size: 8pt;
  /*height: 19px;*/
  border-width: 0;
  padding: 3px;
}

td.workTop {
  font-size: 8pt;
  height: 14px;
  border-spacing: 0px;
  border-width: 0px
}

td.infobox {
  font-size: 8pt;
  border-spacing: 0px;
  border-width: 0px
}

td.navigInv {
  font-size: 8pt;
  height: 0px;
  border-spacing: 0px;
  border-width: 0px
}

td.menutracker {
  font-family: Verdana, Arial, Helvetica;
  height: 14px;
  font-size: 7pt;
  border-spacing: 0px;
  border-width: 0px
}

td.prima-tooltip {
  font-size: 7pt;
  border-spacing: 0px;
  border: 0px;
  vertical-align: top
}

table.detail {
  width: 100%;
  background-color: #FFFFFF;
  font-family: "Verdana", "Arial";
  margin-top: 5px;
  border-collapse: collapse;
  padding: 5px;
}

tr.even, tr.odd {
  cursor: pointer;
}

tr.even {
  background-color: #EEEEEE
}

tr.odd {
  background-color: white;
}

tr.even td, tr.odd td {
  vertical-align: top;
  border-width: 0;
  /*font-size: 8pt;*/
  padding: 3px;
}

tr.even:hover, tr.odd:hover {
  background-color: #FFFFCF;
  color: black;
}

.listtitle {
  border-bottom: 1px solid #BBBBBB;
  background-color: #e8e8e8;
  vertical-align: top;
  padding: 5px;
  font-weight: normal;
}

.listdata {
  text-align: left;
  border-bottom: 1px solid #BBBBBB;
  padding: 5px;

  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#pagination {
  width: 100%;
  background-color: #dddddd;
}

#pagination .previous,
#pagination .next {
  display: block;
  width: 20%;
  height: 22px;
  line-height: 22px;
  background-repeat: no-repeat;
}

#pagination .previous {
  background-image: url('/pics/left.gif');
  background-position: 5% center;
  float: left;
}

#pagination .previous.disabled {
  background-image: url('/pics/left_disabled.gif');
}

#pagination .next {
  background-image: url('/pics/right.gif');
  background-position: 95% center;
  float: right;
}

#pagination .next.disabled {
  background-image: url('/pics/right_disabled.gif');
}

#pagination .previous a,
#pagination .next a {
  display: block;
  width: 100%;
  height: 100%;
}

#pagination .center {
  text-align: center;
  width: 60%;
  height: 22px;
  line-height: 22px;
  float: left;
}

#damagebox #pagination {
  margin-top: 5px;
}

.inputfield {
  border: 1px solid #777777;
  width: 150px;
}

.inputfield_long {
  border: 1px solid #777777;
  width: 240px;
}

.inputfield_large {
  border: 1px solid #777777;
  width: 300px;
}

.inputfield_wide {
  border: 1px solid #777777;
  width: 400px;
}

.inputfield_short {
  border: 1px solid #777777;
  width: 120px;
}

textarea {
  border: 1px solid #777777;
  width: 300px;
  height: 100px;
}

textarea.short {
  border: 1px solid #777777;
  width: 150px;
  height: 100px;
}

textarea.msg {
  font-family: Verdana, Arial, Helvetica;
  font-size: 8pt;
  width: 140px;
  height: 110px;
  border-width: 1px;
  border-style: solid;
  border-color: #000000;
  margin: 2px;
}

input.msg {
  font-family: Verdana, Arial, Helvetica;
  font-size: 7pt;
  height: 18px;
  border: 0;
  padding: 0;
  margin: 0 0 0 1px;
  width: 138px;
}

input.msgButton {
  font-family: Verdana, Arial, Helvetica;
  font-size: 7pt;
  width: 150px;
  height: 18px;
  color: white;
  background-color: #9BAEBF;
  border-width: 1px;
  border-style: solid;
  border-color: #000000
}

input.ButtonPic {
  font-family: Verdana, Arial, Helvetica;
  font-size: 8pt;
  height: 22px;
  color: #1F3B62;
  background-image: url(../pics/button_background.jpg);
  border: 1px solid #1F3B62;
}

a.ButtonPic {
  display: inline-block;
  font-family: Verdana, Arial, Helvetica;
  width: 146px;
  margin: 2px;
  font-size: 8pt;
  height: 20px;
  line-height: 20px;
  /*color: #1F3B62;*/
  /*background-image: url(../pics/button_background.jpg);*/
  border: 1px solid #1F3B62;
  text-align: center;
}

a.ButtonPic:hover {
  color: black;
}

a.ButtonPic.block {
  background: repeating-linear-gradient(130deg, #ebdbdb, #ebdbdb 14px, #f1e5e5 14px, #f1e5e5 30px);
}

a.ButtonPic.release {
  /*background-image: none;*/
  background: rgb(204, 255, 189);
  background: linear-gradient(180deg, rgba(204, 255, 189, 1) 0%, rgba(130, 236, 201, 1) 100%);
}

a.ButtonPic.release:hover {
  color: black;
}

.okbutton {
  font-family: "Verdana", "Arial";
  font-size: 8pt;
  border: 1px solid #555555;
  width: 150px;
  background-color: #DDDDDD;
}

.waitnote {
  font-weight: bold;
  border: 0px;
  color: red;
  display: none;
}

#progress {
  margin: 5px;
  padding: 5px 10px;
  background-color: #E8F8E9;
  border: 1px solid #CCCCCC
}

.pointercursor {
  cursor: pointer
}

a:link {
  font-size: 8pt;
  color: #000000;
  text-decoration: none;
}

a:visited {
  font-size: 8pt;
  color: #000000;
  text-decoration: none;
}

a:hover {
  TEXT-DECORATION: none;
  color: #4466D6
}

a:hover .green {
  TEXT-DECORATION: none;
  color: #2AA731
}

a:active {
  COLOR: #000000;
  TEXT-DECORATION: none
}

form {
  display: inline;
}

#keyicon {
  display: inline-block;
  width: 20px;
  height: 20px;
  margin-right: 5px;
  background-image: url('/pics/key_off.gif')
}

#keyicon:hover {
  background-image: url('/pics/key_on.gif')
}

.colorred {
  color: red;
}

.bgcolorlight {
  background-color: #FFFFCF;
}

.bgcolorwrong {
  background-color: #FF8888;
}

#dhtmlgoodies_tooltip {
  background-color: #F8F8F8;
  border: 1px solid #000;
  position: absolute;
  display: none;
  z-index: 20000;
  padding: 2px;
  font-size: 1.0em;
  -moz-border-radius: 6px; /* Rounded edges in Firefox */
  font-family: "Trebuchet MS", "Lucida Sans Unicode", Arial, sans-serif;
}

#dhtmlgoodies_tooltipShadow {
  position: absolute;
  background-color: #555;
  display: none;
  z-index: 10000;
  opacity: 0.7;
  filter: alpha(opacity=70);
  -khtml-opacity: 0.7;
  -moz-opacity: 0.7;
  -moz-border-radius: 6px; /* Rounded edges in Firefox */
}

#export {
  display: inline-block;
  border-left: 1px solid #CCC;
  padding: 0 0 0 20px;
  vertical-align: top;
  margin: 0 0 0 10px;
}

#export input {
  height: 16px;
}

#export a {
  margin: 0 7px;
}

#export a img {
  margin-top: 3px;
}

#export span {
  display: inline-block;
}

#export #type-all {
  margin-left: 20px;
}

.mandatory-info {
  color: #666666;
  float: right;
  line-height: 25px;
}

.add-container input,
.add-container select {
  margin-bottom: 5px;
}

input[name="msgconfirm"] {
  margin: 0 2px 0 4px;
}

#orderlist-recent h2 {
  background-color: #e3e3e3;
  border-top: 1px solid #888;
  border-bottom: 1px solid #888;
  padding: 2px 5px;
  margin: 0px;
  margin-bottom: 10px;
}

table {
  font-size: 1rem;
}

#orderlist-recent table {
  margin-bottom: 20px;
}

#sys-state-info {
  font-size: 12px;
  font-weight: bold;
  padding: 8px 12px;
  color: black;
  background: repeating-linear-gradient(130deg, #ebdbdb, #ebdbdb 14px, #f1e5e5 14px, #f1e5e5 30px);
  border: 1px solid #666666;
}

.clearfix {
  clear: both;
  float: none;
}

.ellipsis {
  text-overflow: ellipsis;

  /* Required for text-overflow to do anything */
  white-space: nowrap;
  overflow: hidden;
}