@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600;700&display=swap');

/* This section is copied from Agilo stylesheet */
html * {
    margin:0;
    padding:0;
}

.clr, .noprint {
  width:95%;
  /*border-bottom:1px #878787 solid;*/
}


optgroup option {
    padding-left:1em;
}
a img {
    border:0 none;
}
body {
  -x-system-font:none;
  font-family:'Open Sans',Arial,sans-serif;
  font-size:1.2em;
  font-size-adjust:normal;
  font-stretch:normal;
  font-style:normal;
  font-variant:normal;
  font-weight:400;
  /*background-color: #ebf4fb;*/
  width: 98.5%;
  margin-left:2%;
  height:100%;
}

textarea, select {
  max-width:95vw;
  margin:.1em;
  font-family:'Open Sans';
  font-weight:600;
  color: #576974;
}

/* Mobile font stack override */
body,
body input,
body select,
body textarea,
body button,
body label,
body td,
body .push_button,
body .center-tab a {
  font-family: 'Open Sans', Arial, sans-serif !important;
}

#main-pane{
  width: 100vw;
  left:0;
  padding-left: 1vw;
  margin-bottom: 0;
  position:absolute;
  overflow-y:auto;
  top:5em;
  bottom: 3.1em;
  z-index: -1;
  background-color:#f8fafc;
  }

#content{
  margin-top:1em;
}


.control-in-focus {
    border: solid 3px #0099CC;
}
a:visited{
  text-decoration: none;
  color: blue;
}
a {
  color: blue;
  text-decoration: none;
}

/*General*/
.inline {
    display: inline
}
.float-left {
    float: left;
}
.float-right {
  float: right;
}
.clear{
  clear: both;
}
.height-0{
  height: 0em;
}
.center{
  text-align: center;
}
.width-100 {
  width: 100%;
}
.padding-10-5{
  padding: 5px 10px;
}
.padding-5{
  padding: 5px;
}
.display-none{
  display: none !important;
  padding: 0;
  width: 0;
}



#js-notice {
  font-weight: bold;
  font-size: 14;
  color: #027303;
}

.required {
  font-weight: bold;
  font-size: 14;
  color: #ff3333;
}

.confirmed {
  font-weight: bold;
  font-size: 14;
  color: #00ff66;
}

.active {
  border: 2px solid #3aadff;
  color: #5a6c79;
}

/*.visited {
  color: #2589d5;
}*/

.forward {
  color: black;
}

.footnote {
  font-size:.5em
}

/*Chaim's css*/
/*Login page*/
.login-fieldset{
  margin: 2px;
}
.login-fieldset span {
  display: block;
}
.login-fieldset h3{
  padding: 0 !important;
}
.login-fieldset imput{
  width: 90%;
}
.forgot {
  margin-left: 2vw !important;
  /* margin-right: 0 !important; */
}
.lock {
  display: none;
}
.login-button{
  float: none !important;
  display: block !important;
  clear: both;
}
/*Toolbar*/
.mobile-top-bar{
  height: 36px;
  width: 100%;
  background-color: #9bc6e4;
}
.mobile-top-bar td{
  padding: 2px 4px;
}
.list-button{
  display: block;
  line-height: 100%;
}
.list-button img{
  padding: 5px;
}

/*Buttons*/
.main-button{
  display: block;
  padding: 7px;
}
.arrow{
  float: right;
}
.arrow-back{
  float: left;
}
.text-button {
  -moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
  -webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
  box-shadow:inset 0px 1px 0px 0px #ffffff;
  background-color:#ededed;
  -moz-border-radius:6px;
  -webkit-border-radius:6px;
  border-radius:6px;
  border:1px solid #dcdcdc;
  color:#777777;
  font-family:arial;
  text-decoration:none;
  text-shadow:1px 1px 0px #ffffff;
  height: 36px;
  text-align: center;
}
.text-button:hover {
  background-color:#dfdfdf;
}
td {
  line-height: 93%;
}
td .main-button{
  font-size: 0.8em;
}
/*Lists*/
.even, .odd{
  margin: 5px 10px;
  padding: 3px;
  height: inherit;
  -moz-border-radius:6px;
  -webkit-border-radius:6px;
  border-radius:6px;
  border:1px solid #bdbdbd;
}
.odd{
  background-color: #ebebeb;
}

/*Search Page*/
.search-fieldset{
  text-align: center;
  /*width: 98%;*/
  padding: .8em;
  border: 5px #d58c1e solid;
  border-radius:30px;
}

.search-button{
  border: none;
  width: 100%;
  font: inherit;
  background: none;
  color: blue;
}
.search-input{
  width: 99.2%;
  font-size: 1em;
}
.pagination{
  text-align: center;
}
.disabled{
  display: none;
}
.prev_page{

}
.next_page{

}

/*schedule page*/
 /*Date*/
.news_date {
  color: rgb(110, 110, 110);
  display: block;
  float: left;
  padding: 5px;
  text-align: center;
  width: 45px;
  height: 100%;
 }
.news-date-td{
  width: 45px;
}
.month, .day, .year{
  display: block;
}
.month, .year{
  font-size: .75em;
}
.day{
  font-size: 1.5em;
}
.news-line{
  border-collapse: collapse;
  width: 100%;
}
.list-link{
  padding: 0px;
}
.news{
  border-left: solid 1px #bdbdbd;
  padding: 4px;
  font-size: 0.8em;
}
.news-txt-row{
  display: block;
}
/*Payroll*/
.ui-menu-item{
  font-size: .65em;
}
.label{
  width: 5em;
  display: inline-block;
}
.txt-fld{
  width: 5.5em;
  display: inline-block;
}
.txt-fld .timepicker {
  width: 5.5em !important;
}
.txt-fld input{
  width: 5.5em;
}
.txt-fld .expenses{
  width: 4.5em !important;
}
.time select{
  display: inline;
}
.time{
  width: inherit;
}
.selector-button{
  width: 2em !important;
}
.loading_image{
  display: none;
}
.overlay {
  position:absolute;
  background:#aaaaaa;
}
.loading_circle{ 
  position:absolute;
}

/*Footer*/
.ftr_wrapp{
  font-size: 0.6em;
}
/*RAB chiddushim*/

h1 {
  font-size:1.4em;
}
h2 {
  font-size:1.3em;
}
h3 {
  font-size:1.2em;
  font-color:blue;
}

h4 {
  font-size:.9em;
  line-height:1.2em;
  width:95vw;
}

/* vw width overflows when this layout is iframed (e.g. kvhkosher.org join-our-team). */
.mashgiach-requirements h4,
.mashgiach-public-form h4 {
  width: auto;
  max-width: 100%;
  text-align: center;
}



/* br margin/height styling no longer creates visible gaps in modern Chrome.
   Spacing is restored via line-height on mobile detail containers in mobile_menu.css. */

input[type="submit"]:disabled, .push_button:disabled, a .push_button:disabled{
  opacity:30% !important;
}

input.aux_button:disabled, button.aux_button:disabled, a.aux_button.disabled, a .aux_button.disabled {
  opacity:30% !important;
}

input[type="submit"], .push_button, a .push_button {
  /*background-color: #3C7D8A !important;
  border: 1px solid !important;
  border-color: #3C7D8A !important;
  color: white !important;*/
  padding: 7px 7px !important;

  text-align: center !important;
  text-decoration: none !important;
  display: inline-block !important;
  font-size: .8em !important;
  margin: 4px 1.5px !important;
  cursor: pointer !important;
 text-transform: uppercase !important;
  font-family:'Open Sans',Sans-serif !important;
  font-weight: 600 !important;
  border-radius: .25em !important;

}

input.aux_button, button.aux_button, a.aux_button, a .aux_button {
  padding: 7px 7px !important;
  text-align: center !important;
  text-decoration: none !important;
  display: inline-block !important;
  font-size: .8em !important;
  margin: 4px 1.5px !important;
  cursor: pointer !important;
  text-transform: uppercase !important;
  font-family:'Source Sans Pro',Sans-serif !important;
  font-weight: 600 !important;
  border-radius: .25em !important;
  background-color: #cae3e8 !important;
  border: 1px solid #3C7D8A !important;
  color: #3C7D8A !important;
}

input.aux_button:hover, button.aux_button:hover, a.aux_button:hover, a .aux_button:hover,
input.aux_button:focus, button.aux_button:focus, a.aux_button:focus, a .aux_button:focus {
  background-color: #ffffff !important;
  border-color: #3C7D8A !important;
  color: #3C7D8A !important;
  transition: .5s;
}

.center-tab {
    padding-left: 3vw !important;
}

.center-tab a {
  /*background-color: #fafdb0 !important;
  border: 1px solid !important;
  border-color: #3C7D8A !important;*/
  color: #006699 !important;
  padding: 3px 5px !important;
  text-align: center !important;
  text-decoration: none !important;
  display: inline-block !important;
  font-size: 1em !important;
  margin: 4px 1.5px !important;
  cursor: pointer !important;
  text-transform: uppercase !important;
  font-family:  'Open Sans',Sans-serif !important;
  font-weight: 600 !important;
  border-radius: .25em !important;
  line-height: 1;
}




.columnWrapper, .warning {
  position: relative;
  width: 100%;
  clear:both;}

 
.column-1-of-3, .column-2-of-3, .column-3-of-3, .middle-long,.column-1-of-2, .column-2-of-2, .tab-column  {
  width:94vw;
  margin: 1em 0;
  border: .05px solid #bde0f1;
  box-shadow: 1px 1px #bde0f1;
  background-color: #ffffff;
  border-radius:.35em;
  padding:.2em;
  overflow-wrap:normal;
  display: block;
  position:relative;
  clear:both
}


.big-div-list div  {
  width:94vw;
  margin: 1em 0;
  border-top: .1em solid #e2dede;
  /*border-radius:.35em;*/
  padding:.2em;
  overflow-wrap:normal;
  display: block;
  position:relative;
  clear:both
}

/*prevents div from indenting to end of prior element, e.g. h4 - don't need as long as prior element's padding doesn't extend down into div.
.middle-long:before, .main:before {
  content:"...";
  opacity:0%;
}*/

input[type="text"], input[type="password"] {
  width:50% !important;
  margin:.2em .2em !important;
  border-radius:2px !important;
  font-family:'Open Sans';
  font-weight:600;
  color: #576974;
}

.column-1-of-3 input[type="text"], .column-2-of-3 input[type="text"],
.column-1-of-2 input[type="text"], .column-2-of-2 input[type="text"], .column-3-of-3 input[type="text"],
.column-1-of-3 input[type="password"], .column-2-of-3 input[type="password"],
.column-1-of-2 input[type="password"], .column-2-of-2 input[type="password"], .column-3-of-3 input[type="password"],
.column-1-of-3 select, .column-2-of-3 select, 
.column-1-of-2 select, .column-2-of-2 select, .column-3-of-3 select,
.column-1-of-2 textarea, .column-2-of-2 textarea, .column-3-of-3 textarea,
.column-1-of-3 textarea, .column-2-of-3 textarea, .middle-long textarea, .middle-long select
 {
  border: 0.5px solid #9bc2ef;
  width:100%;
}


.td {
  width:min-content;
}


form td input[type="text"] {
  width:95% !important;
  margin:.2em !important;
  font-family:'Open Sans';
  font-weight:600;
  color: #576974;
}

td .ac_input, td input[type="password"]{
  width:73% !important;
}

.login-fieldset {
  margin-top:20%;
  margin-left:2vw;
  border-radius:2px;
  padding-bottom:15px;
  padding-left:5px;
  width:93vw;
}

.ui-datepicker { width: 13em !important;}

#top-pane {
  background: #27407a;
  top:0px;
  position: relative;
  width: 100%;
  max-width: none;
  margin-left: 0;
  z-index:999;
  min-height:3.5em;
  box-sizing: border-box;
}

/* table.list styling lives in public/stylesheets/universal.css (banded-in-context pattern) */

.added {
  background-color: #e1ffe1;
}

.removed {
  background-color: #fedacd;
}

.div-list tr table tr:nth-child(even), .div-list tr table tr:nth-child(odd)  {
  background-color:inherit;
}


.new-footer {
  bottom:0px;
  height: 3.1em;
  display: flex;
  justify-content: center;
  align-items: center;
  position: fixed;
  width: 100%;
  background: #27407a;
  z-index:999;
  margin: 0;
}

.new-footer-content{
  color:white;
  padding-top: 6px;
  font-size: 13.2px;
  font-weight: 600;
  padding-right: 5px;
  padding-left: 5px;
  text-align: center;
}

.new-footer-content img,.new-footer a img {
  margin-left:3em;
  margin-right:3em;
}

.new-footer a,
.new-footer a:visited,
.new-footer a:hover {
  color: yellow;
}

#contactUs, #topBtn, #bottomBtn, #helpButton {
  display: block; /* Hidden by default */
   position: fixed; /* Fixed/sticky position */
   z-index: 99; /* Make sure it does not overlap */
   right: 1.5em; /* Place the button 30px from the right */
   border: none !important; /* Remove borders */
   outline: none; /* Remove outline */
   background-color: #4f5fb130 !important; /* Set a background color */
   height: 2.5EM;
   width: 2.5em;
   
   background-position: center;
   background-size: 2.5em 2.5em;
   background-repeat:no-repeat;
   color: white; /* Text color */
   cursor: pointer; /* Add a mouse pointer on hover */
   padding: .05em .2em .05em .2em; /* Some padding */
   border-radius: 1em; /* Rounded corners */
   font-size: 15px; /* Increase font size */
   font-family: "Open Sans", sans-serif;
}

#contactUs:hover, #topBtn:hover, #bottomBtn:hover, #helpBtn:hover, #contactUs:visited, #topBtn:visited, #bottomBtn:visited, #helpBtn:visited {
  background-color: #4f5fb1db !important; /* Add a dark-grey background on hover */
  }   

#topBtn {
  display: none;
  top: 17em; 
   background-image: url('/images/up arrow grey.png') !important;
} 

#contactUs {
  top: 90%;
  background-image: url("/images/contact-transparent.png") !important;
}

#helpButton {
  top: 85%;
  background-image: url("/images/help-bw-transparent.png") !important;
}
#bottomBtn {
  display: none;
  top: 20em; 
   background-image: url('/images/down arrow grey.png') !important;
} 

#logout-button {
  font-size:.6em;
  text-transform:uppercase;
  color:red;
  background:white;
  padding:.1em;
  font-weight:bold;
}

@media only screen and (min-width: 300px){
  body, label {
    width:fit-content;
    line-height:normal;
  }
  body, td {
    font-size:1em;
  }
  td {
    width:50%
    text-align:left;
    line-height:normal;
  }

 
  td label {
    font-size: 12px }

  .middle-long, th {
    line-height:normal
  }

  .noprint {
    width:85vw;
    margin-bottom:1em;
  }
}

@media only screen and (min-width: 600px){
  .middle-long {
    width:94.5vw;
  }
 .home_menu {
    width: 92.8vw;
  }
}

@media only screen and (min-width:400px){
  .home_menu {
    width: 91.5vw;
  }
}

@media only screen and (min-width:500px){
  .home_menu {
    width: 92.5vw;
  }
}



/*copied and adapted from application.css */

#single {
    padding-top: 1em;
    padding-left: 1em;
    background: white;
}

.plant_record td {
    padding-left: 2em;
}

/* Table styles */
body
{
    line-height: 1.6em;
}

.edit_table tr td table tr td {
  border-bottom:none;
}

.hor-minimalist-b, .edit_table
{
    font-family: "Lucida Sans Unicode", "Lucida Grande", Sans-Serif;
    font-size: 12px;
    /* margin: 45px; */
    /* width: 480px; */
    border-collapse: collapse;
    text-align: left;
}
.hor-minimalist-b th, .edit_table th
{
    font-size: 14px;
    font-weight: normal;
    color: #039;
    padding: 0px 2px;
    border-bottom: 2px solid #6678b1;
}
.hor-minimalist-b td, .edit_table td
{
    /*border-bottom: 1px solid #ccc;*/
    /*color: #669;*/
    padding: 0px 2px;
}
.hor-minimalist-b tbody tr:hover td, .edit_table tbody tr:hover td
{
    color: #009999;
}

.hor-minimalist-b tr #highlight, .edit_table tr #highlight
{
    background: #009999
}

.grid_alt_class {
    background: #f0fafa
}

.warning {
    color: #990033 !important;
    border: 1px solid #ff9999 !important;
    background-color: beige;
    border-radius: 3px;
    padding-top: 3px;
    line-height: normal;
    margin-top: .5em;
    position:relative;
  }

.warning ul li ul{
  margin-left:2rem;
}

.de-emphasize {
    color:#999999;
    font-style:italic;
}

.grid_row_created_today {
    background: #ccffcc
}

.ui-datepicker { z-index:5; }

/*Scrolling tables with fixed header styles */
.wrap {
  margin-top:5px;
  margin-left: 0;
  padding: 0;
  position:relative;
  height:200px;
  overflow:hidden;
  width:auto;
  border: 1px #006699 solid;
}

.inner {
  width:100%;
  overflow-y:auto;
  overflow-x:hidden;
  position: static;
}

.thp  {
  background-color: #BDD9F9;
  color: #000000;
  border-bottom:   #006699 1px solid;
  text-align: left;
}

.list1 th, .thp1 {
  background-color: #BDD9F9;
  color: #000000;
  font-weight: bold;
  border-bottom: 1px solid #7DAAEA;
  border-left:  1px solid #7DAAEA;
  padding-right: 8px;
  padding-left: 2px;
  padding-top: 3px;
  padding-bottom: 4px;
}

/* For kvhkosher.org */
.list2 th, .thp2 {
background-color: black;
        color: #000000;
        font-weight: bold;
        border-bottom: 1px solid #7DAAEA;
        border-left:  1px solid #7DAAEA;
        padding-right: 8px;
        padding-left: 2px;
        padding-top: 3px;
  padding-bottom: 4px;
}

.frame {
  
  border: 2px #006699 solid;
  padding:5px;
  font-size:.8em
}

.home_buttons_left{
  text-align: center;
}

.home_menu_left{
  margin: 0px 10px 0px 0px;
}

.home_menu {
  /*background: url("../images/right_block_bg_btm.gif") no-repeat scroll left bottom transparent;*/
  background: #fce6cb;
  border: 2px solid #bbbbbb;
  display: block;
  height: auto !important;
  position: relative;
  width: 87.5vw;
  border-radius:3px;
  margin-bottom: 8px;
  padding:1em;
}

.home_menu ul, ol {
  list-style: none outside none;
}
.home_menu ul li{
  background: url("../images/right_block_separate.png") no-repeat scroll center bottom transparent;
  color: #505050;
  display: block;
  font-size: 18px;
  line-height: 22px;
  margin: -3px 0;
  padding: 7px 3px 7px 0;
  position: relative;
}

.home_menu ul li a, .home_menu ul li div {
  color: #505050;
  display: block;
  margin-top: -2px;
  padding: 7px 5px 10px 15px;
  text-decoration: none;
  font-size: 17px;
  line-height: 22px;
  text-shadow: 0.01em 0.1em 0 #BDD9F9;
}


.home_menu ul li ul li {
  padding-left: 25px;
} 


/* button styles - to add the class to rails buttons - e.g. :class => 'home_button'; otherwise, use format such as input[type="submit"]:hover */
.home_button {
  /*background: url("../images/tab_bg.gif") no-repeat scroll left top transparent;*/
  background: #fce6cb;
  border: 2px solid #bbbbbb;
  color: #505050;
  display: block;
  float: center;
  height: auto;
  padding-top: .9em;
  padding-bottom: .9em;
  padding-left: 0px;
  margin-bottom: 8px;
  text-decoration: none;
  text-shadow: 0.01em 0.1em 0 #BDD9F9;
  font-size: 17px;
  text-align: center;
  line-height: 22px;
  width: 95.5vw;
  border-radius:3px;
}

.middle-long .home_button {
  width: 90vw;
}

.home_buttons ul, ol {
  list-style: none outside none;
  margin-bottom:0;
  margin-top: 0px;
  padding-left: 0px;
}

.home_buttons{
  margin-top: 0px;
  margin-right: 0px;
}

.current-value {
  color: #027303;
  font-size:.8em
}

.previous-value {
  color: #be311f;
  font-size:.8em
}

.float-right {
  float: right;
}

#js-notice {
  font-weight: bold;
  font-size: 14;
  color: #027303;
}

.required {
  font-weight: bold;
  font-size: 14;
  color: #ff3333;
}

.pointer {
  background: url("/images/point.gif") repeat-y scroll 50.5% 0% transparent;
  height: 4px
}

.active {
  border: 2px solid #3aadff;
  color: #5a6c79;
}

.visited {
  color: #2589d5;
}

.forward {
  color: black;
}

/*copied and modified from style NB_KVH.css */

/* search */
.search {
  float:none;
  padding:0;
  margin-top: 16px;
  margin-right: 0;
  margin-bottom: 0;
  margin-left: 0;
}

/*body_bottom*/
.body_bottom {
  width:960px;
  height:65px;
  padding:0;
  margin-top: 0;
  margin-right: auto;
  margin-bottom: 0;
  margin-left: auto;
  background-color: #1E2968;
  background-image: none;
  background-repeat: repeat-x;
  background-position: top;
}

.title {text-decoration: none;  font-family: inherit;
  font-size: 110%;
  font-weight: bolder;
  color: #005FA5;
  border: 1px #005FA5 solid;
  border-radius:3px;
  padding:10px 10px 0 10px;
  line-height:normal;
  background: #f8f1a3;
  clear:both;
  margin-bottom:10px;
    width:91vw !important;
}

/* menu */  
.menu {
  width:800px;


  padding-left:5px;
  margin-top: 0px;
  background-position: center;
  margin-top: 0;
  margin-right: auto;
  margin-bottom: 0;
  margin-left: auto;
  padding-left: 10px;
}
.menu ul { padding:0; margin:0; list-style:none; border:0;}
.menu ul li {
  float:left;
  margin:0;
  border:0;
  padding-top: 0;
  padding-right: 13px;
  padding-bottom: 0;
  padding-left: 13px;
}
.menu ul li a {
  float:left;
  margin:0 1px 0 0;
  padding:13px 0;
  color:#fff;
  text-decoration:none;
  font-family: Tahoma, Geneva, sans-serif;
  font-size: 14px;
  font-weight: bolder;
  line-height: 30px;

}
.menu ul li a span {
  background:none;
  padding-top: 13px;
  padding-right: 6px;
  padding-bottom: 13px;
  padding-left: 6px;
}

/********** body **********/
.body {
  /*width:800px;*/
  margin:0 auto;
  padding:0px;
  background-position: center;
  /*background-image: url("/public/images/body.png");*/
  background-repeat: repeat-y;
}
.body h2 {
  color:#2c2c2c;
  font:normal 18px 'Open Sans', Arial, Helvetica, sans-serif;
  margin:5px 0px;
  padding:15px 5px;
}
.body h3 {
  font: bold 14px 'Open Sans', Arial, Helvetica, sans-serif;
  color:#2c2c2c;
  margin:5px 0;
  padding:15px 5px;
  /*border-bottom:1px solid #e1e1e1;*/
}
.body p {
  color:#5f5f5f;
  padding:5px 5px;
  margin:0;
  line-height:18px;
  text-align: justify;
  font-family: 'Open Sans', Arial, Helvetica, sans-serif;
  font-size: 13px;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  padding-right: 5px;
}

.paragraph-ul {color:#5f5f5f;}

.body p.grey { font: normal 11px 'Open Sans', Arial, Helvetica, sans-serif; color:#a4a4a4; padding:10px 5px 0 5px; margin:0; line-height:1.8em;}
a {
  color:#006699;
  text-decoration:none;
}
.body img:not(.field-title-hint) {
  float:left;
  margin:0px;
  padding:0;
  text-align: center;
}
.body img.port { margin:10px 10px; padding:0; text-align:center;}
.body img.but { margin:0; padding:15px 0 0 0; float:right;}

.save{
  width:100%;
  float:none;
  text-align: center;
  margin:1em 0 1em 0;
  border: 0px solid #469aac;
  padding-bottom: 2em;
  clear:both;
}

.full {
  /*width:762px;
  float:left;*/
  font-size: 1em;
  font-style: normal;
  font-family: 'Open Sans', Arial, Helvetica, sans-serif;
  /*text-align: left;*/
  padding: .3em 0;
  border-left: 0px;
  margin-left: 0px;
  background-color:#f8fafc;
  box-shadow:none !important;
  /*border-bottom-style:inset;
  border-bottom-color:#d4d0d0;*/
}

.loginerror {
  text-decoration:none;
  font-family: Tahoma, Geneva, sans-serif;
  font-size: 16px;
  font-weight: bolder;
  color: #990000;
}

.style1 {font-size: 30px}
/*.h3 {
  color: #FFF;
  padding-left: 36px;
}*/

.mini-droplist {
  width: 45px !important;
  font-size: 9.5px !important;
  font-weight: bold;
  background-color: #fffae6;
}

.small-droplist {
  width: 100px !important;
  height: 30px;
  font-size: 9.5px !important;
  font-weight: bold;
  background-color: #fffae6;
  white-space: normal;
  word-wrap: break-word;
}
/*
.accounting tbody tr.total td, .accounting th,.accounting tbody tr td {
  border-left-style:none;
  border-right-style:none;
  line-height:2;
        vertical-align:top;
        
}

.accounting td {display:block;}

.accounting th {display:none}*/

.billing-code:before{
  content:"Billing Code: "
}

.inspection-date:before {
  content:"Date: ";
}
.venue:before {
  content:"Venue: "
}
.start-time:before {
  content:"Start: "
}

.end-time:before {
  content:"End: "
}

.duration:before {
  content:"Duration: "
}
.formula:before {
  content:"Formula: "
}

.input-large
{
  font-family: 'Open Sans', Arial, Sans-Serif;
  font-size: 12px;
  padding: 2px;
  border: solid 1px #85b1de;
  width: 75%;
  background-color: #ffffff;
  float:right;
  font-weight:600;
  color: #576974;
}

.input-long
{
  font-family: 'Open Sans', Arial, Sans-Serif;
  font-size: 12px;
  padding: 2px;
  border: solid 1px #85b1de;
  width: 50%;
  background-color: #ffffff;
  float:right;
  font-weight:600;
  color: #576974;
}

.tablehead
{
color:#000066;
}

.announcement table tr td {
  font-size:14px;
  line-height:normal;
}

.disruption_alert {
  background: #efe67f;
    border: solid 2px #a1da96;
    border-radius: .35em;
    padding: 10px 15px;
    font-size: 14px;
    text-align: left;
    clear: both;
    margin-right:2vw;
}

@media only screen and (min-width:600px){
 .announcement, .disruption_alert {
   margin-right:2.5vw
 } 
 .warning {
   width:95.2vw;
 }
}

.warning-top, .errorExplanation {
  border:1px solid #990000;
  width:93.5%;
  background-color: #CCCCCC;
  padding: .1em .5em;
  margin: 1.5em 0 0 0;
  color: #990000;
  clear: both;
  border-radius: .35em;
}

.warning-top h2, .errorExplanation h2{
  width:100%;
  padding: 10px 0px 10px 0px;
  float: left;
  margin-bottom: 5px;
  color: #990000;
}

.warning-top p, .errorExplanation p{
  color:#000000;
  padding:5px 5px;
  margin:0;
  line-height:18px;
  text-align: justify;
  font-family: 'Open Sans', Arial, Helvetica, sans-serif;
  font-size: 13px;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  padding-right: 5px;
}

.left-tab {
  float:left;
  padding: .1em;
  overflow: scroll;
}

.right-tab {
  float: right;
  text-align:right;
  margin-right:2%;
  padding: .1em;
  clear:both;
  width:100%;
}

.column-1-of-2 select, .column-2-of-2 select {width: 50%;}

.column-1-of-2 textarea, .column-2-of-2 textarea,
.column-1-of-3 textarea, .column-2-of-3 textarea,
.column-3-of-3 textarea, .middle-long textarea,
.big-div-list textarea

{
  font-family: 'Open Sans', Arial, Sans-Serif;
  /*font-size: 1em;*/
  height:5em;
  width: 90vw;
  margin:.1em;
  padding:.3em 0 0 .3em
  font-weight:600;
  color: #576974;
}

.breadcrumbs {
  font-family: 'Open Sans', Arial, Helvetica, sans-serif;
  font-size: 10pt;
  color: #0066CC;
  padding-bottom: 8px;
}

.fieldWithErrors
{
  font-family: 'Open Sans', Arial, Sans-Serif;
  font-size: 12px;
  border: solid 3px #990000;
  background-color: #99000036;
  float:right;
  padding-left: 5px;
}

.textcenter {
  text-align: center;
}

.sub_table {
  border: solid 1px black;
  background-color: white;
  width: 100%;
}
.odd {
  background-color: #eff7fc;
}
.even {
  background-color: #fff;
}

.error-div, .error-h1 {
  background-color: #fff;
  color: #666;
  text-align: center;
  font-family: 'Open Sans', Arial, sans-serif;
}
.error-div {
    width: 70vw;
    padding: 0 1em;
    margin: 4em auto 0 auto;
    border: 1px solid #ccc;
    border-right-color: #999;
    border-bottom-color: #999;
}
.error-h1 {
  font-size: 100%;
  color: #f00;
  line-height: 1.5em;
}


/*modify ui.jqgrid.css for product grid */
.ui-jqgrid .ui-jqgrid-htable th div{overflow: hidden;position:relative;height: fit-content !important;}
.ui-pg-table tr{
    display:inline-block !important;
}
.ui-jqgrid .ui-jqgrid-pager {
  height: fit-content !important;
  white-space: normal !important;
}

/*make product and comapny search results appear vertically */
#search-results, #py_products  {
  border-spacing:.9em;
  border-collapse:separate !important;
  display:table;
  margin: auto;
}

@media only screen and (max-width:700px) {

#search-results tr, #py_products tr {
  padding:5px;
}

#search-results td, #py_products td {
  display: block;
  padding-left:.5em
}

#search-results th, #py_products th {
  display: none;
}

.UPC, .Company {
  /*height:1.5em;*/
  padding-top:.5em;
  padding-bottom:-.5em
}
.UPC:before {
  content: "UPC: ";
}

.Code:before {
  content: "Code: ";
}

.Brand:before {
  content: "Brand: ";
}

.Brand-Owner:before {
  content: "Brand Owner: ";
}
.Status:before {
  content: "Status: ";
}
.Certifier:before {
  content: "Certifier: ";
}

.KVH:before {
  content: "KVH: ";
}

.Expiry:before {
  content: "Expiry: ";
}

.UKD-ID:before {
  content:"UKD ID: "
}

.UKD-ID, .Website {
  padding-bottom:.5em
}

.Company:before {
  content: "Company: ";
}

.Product-count:before {
  content: "Product count: ";
}

.Address:before {
  content: "Address: ";
}

.Phone:before {
  content: "Phone: ";
}

.Email:before {
  content: "Email: ";
}

.Website:before {
  content: "Website: ";
}

.Product, .Product:before {
  font-size:16px;
}

.UPC:before ,.Code:before ,.Brand:before ,
.Brand-Owner:before ,.Status:before ,.Certifier:before ,
.KVH:before ,.Expiry:before ,.Company:before ,
.Product-count:before ,.Address:before ,
.Phone:before ,.Email:before ,.Website:before ,
.Product:before, .UKD-ID:before {
  font-weight:bold;
}

.UPC,.Code,.Brand,
.Brand-Owner,.Status,.Certifier,
.KVH,.Expiry,.Company,
.Product-count,.Address,
.Phone,.Email,.Website,
.UKD-ID{
  font-size:12px;
}

}

/*for inspections list*/
#inspections  {
  border-spacing:.9em;
  border-collapse:separate !important;
  display:table;
  width:94vw !important;
  border:none;
  margin-left:-.5em;
  font-size:.8rem !important;
}

#inspections td ul{
  padding-left:1.2rem;
}

#inspections tr {
  padding:5px;
}

#inspections tr.odd,
#inspections tr.even,
#inspections tr.unsubmitted {
  border: 1px solid #888;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  overflow: hidden;
}

#inspections tr.odd td,
#inspections tr.even td,
#inspections tr.unsubmitted td {
  border: none;
}

#inspections td {
  display: block;
  padding-left:.5em
}

#inspections th {
  display: none;
}

.check-all {
  display: block !important;
}

.check-all:after {
  content:" Check All";
  font-weight:normal;
}

#inspections:first-child {
  /*height:1.5em;*/
  padding-top:.5em;
  padding-bottom:-.5em
}

#inspections:last-child {
  /*height:1.5em;*/
  padding-bottom: :.5em;
  padding-top:-.5em
}


.Plant:before {
  content: "Plant: ";
}

.Inspector:before {
  content: "Inspector: ";
}

.Inspection-Date:before {
  content: "Inspection Date: ";
}

.Pay-Type:before {
  content: "Pay Type: ";
}
#inspections .Status:before {
  content: "Status: ";
}
.hr-min:before {
  content: "hr:min ";
}

.Travel-hr-min:before {
  content: "Travel hr:min ";
}

.Mi:before {
  content: "Mi: ";
}

.Flat-pay:before {
  content:"Flat pay: "
}

.UKD-ID, .Website {
  padding-bottom:.5em
}

.Pay-amount:before {
  content: "Pay amount: ";
}

.Bill-amount:before {
  content: "Bill amount: ";
}

.Comments:before {
  
}

.Details:before {
  content: "Details: ";
}

.Private-comments:before {
  content: "Private comments: ";
}

.Issues:before {
  content: "Issues: ";
}

.Plant:before, .Inspector:before, .Inspection-Date:before, 
.Pay-Type:before, .Status:before, .hr-min:before, .Travel-hr-min:before, 
.Mi:before, .Flat-pay:before, .Pay-amount:before, 
.Bill-amount:before, .Comments:before, .Details:before, .Private-comments:before, .Issues:before
 {
  font-weight:bold;
}

.Plant, .Inspector, .Inspection-Date, 
.Pay-Type, .Status, .hr-min, .Travel-hr-min, 
.Mi, .Flat-pay, .Pay-amount, 
.Bill-amount, .Comments, .Details, .Private-comments, .Issues{
  
}

/*for trucking-logs list*/
#trucking-logs  {
  border-spacing:.9em;
  border-collapse:separate !important;
  display:table;
  width:94vw !important;
  border:none;
  margin-left:-.5em;
  font-size:.8rem !important;
}

#trucking-logs td ul{
  padding-left:1.2rem;
}

#trucking-logs tr {
  padding:5px;
}

#trucking-logs tr.odd,
#trucking-logs tr.even {
  border: 1px solid #888;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  overflow: hidden;
}

#trucking-logs tr.odd td,
#trucking-logs tr.even td {
  border: none;
}

#trucking-logs td {
  display: block;
  padding-left:.5em
}

#trucking-logs th {
  display: none;
}

.check-all {
  display: block !important;
}

.check-all:after {
  content:" Check All";
  font-weight:normal;
}

#trucking-logs:first-child {
  /*height:1.5em;*/
  padding-top:.5em;
  padding-bottom:-.5em
}

#trucking-logs:last-child {
  /*height:1.5em;*/
  padding-bottom: :.5em;
  padding-top:-.5em
}


.trucking-log-dates:before {
  content: "Dates: ";
  font-weight: bold;
}

.trucking-log-attachments:before {
  content: "Attachments: ";
  font-weight: bold;
}

.trucking-log-comments:before {
  content: "Comments: ";
  font-weight: bold;
}



/*for event finder*/
#date_range {
  position: absolute; 
  top: 3.5em;
  border: .01em solid #a95818;
  background-color: #ebf4fb;
  border-radius:.35em;
  width:98%;
  padding:.1em
}

#event_inspections{position:relative;}

/*for inspection display page*/
@media only screen and (max-width: 550px) {
.sigPad, .sigNav, .current a, canvas.pad {
  width:95.5% !important;
}/* for tablet screens it should be the standard width*/
}

/*for use in product_utils/pending_index*/
#expand_all_btn, #collapse_all_btn {
  font-weight:bold;
  border:1px solid #2e6e9e;
  border-radius:3px;
  padding:0 .1rem;
  font-size:.8rem;
}
#collapse_all_btn {
  display:none;
}

/*for google directions icon*/
.directions-container {
float:right;
margin-right:3vw;
text-align:center;
font-size:.9em;
}
.directions-container img {
width:50px;
height:50px;
margin-left:1.5vw;
}

.icon-container {
/*width:50vw;
margin:0 25vw 30px 25vw;*/
text-align:center;
clear:both;display: inline-block; vertical-align: middle;}

.icon-container img {
width:20vw;
height:20vw;
  object-fit: cover;
    overflow: hidden;
}

.icon-container a {
  font-size:large;
  vertical-align: middle;
}

.bottom-button-container {
  width:50vw;margin:0 5vw 30px 0;
}

.tab {
  width:95.5vw;
  clear:both;
}

.tab-column select {
  width:75%;
}
/* Style the tab */
.tab {
  overflow-y: auto;
  border-bottom: 1px solid #dee2e6;
  padding: 0;
}

/* Style the buttons inside the tab */
.tab button {
  display: inline-block;
  vertical-align: bottom;
  box-sizing: border-box;
  border: none;
  border-bottom: 3px solid transparent;
  margin: 6px 8px 0 0;
  border-radius: 6px 6px 0 0;
  font-family: inherit;
  font-size: 14px;
  padding: 10px 14px 7px 14px;
  background: transparent;
  color: #4a5568;
  cursor: pointer;
  transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.tab button:focus {
  outline: none;
}

.tab button:focus-visible {
  outline: 2px solid #3C7D8A;
  outline-offset: 2px;
}

.tab button:hover {
  background-color: #f1f5f9;
  color: #1a202c;
}

.tab2 button {
  display: inline-block;
  vertical-align: top;
  box-sizing: border-box;
  border: none;
  border-top: 3px solid transparent;
  margin: 0 8px 0 0;
  border-radius: 0 0 6px 6px;
  font-family: inherit;
  font-size: 14px;
  padding: 7px 14px 10px 14px;
  background: transparent;
  color: #4a5568;
  cursor: pointer;
  transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

/* Create an active/current tablink class */
.tab button.active {
  background-color: #fff;
  color: #2c5282;
  font-weight: 600;
  border-bottom-color: #3C7D8A;
  padding-bottom: 7px;
}

.tab2 button.active {
  background-color: #fff;
  color: #2c5282;
  font-weight: 600;
  border-top-color: #3C7D8A;
  padding-top: 7px;
}

/* Style the tab content */
.tabcontent {
  display: none;
  border-top: none;
  width:100%
}

.new::before{
  content:'New';
  border:1px solid !important;
  border-radius:2px;
  font-size:.7rem;
  margin-right:2px;
  background-color:#ecec02;
  color: #006699;
}

.new-feature::before{
  content:'New Feature';
  border:1px solid !important;
  border-radius:2px;
  font-size:.7rem;
  margin-right:2px;
  background-color:#ecec02;
  color: #006699;
}

.new:visited::before{
  content:none;
}

.new-field {
  border: 2px yellowgreen solid !important;
}

.new-p:before {
  content: 'New!'
  font-weight: bold;
  color:green;
  display:block;
}


#loader-wrapper .loader-section {
    position: fixed;
    top: 0;
    width: 100vw;
    height: 100%;
    background: #cacaca85;
    z-index: 1000;
}
 
#loader-wrapper .loader-section.section-left {
    left: 0;
}
 
#loader-wrapper .loader-section.section-right {
    right: 0;
}

#loader {
    z-index: 1001; /* anything higher than z-index: 1000 of .loader-section */
    top:40vh;
    position:fixed;
    left:15vw;
}

.logo-loader{
  width:70vw;
}

span.logo-loader{
  font-size: 150%;
  color:#3c3a3a;
  padding:30%;
  font-weight:bold;
  opacity:75%;
}

/* Disabled button hover states - prevent hover effects */
input[type="submit"]:disabled:hover,
.push_button:disabled:hover,
a.push_button.disabled:hover {
  background-color: #920025 !important; /* default bg */
  color: white !important; /* default color */
  border-color: #920025 !important;
  cursor: not-allowed !important;
  opacity: 30% !important;
  box-shadow: none !important;
}

input.aux_button:disabled:hover, button.aux_button:disabled:hover, a.aux_button.disabled:hover, a .aux_button.disabled:hover {
  background-color: #cae3e8 !important;
  color: #3C7D8A !important;
  border-color: #3C7D8A !important;
  cursor: not-allowed !important;
  opacity: 30% !important;
  box-shadow: none !important;
}

/* Mobile-friendly dropdown styling */
@media only screen and (max-width: 768px) {
  /* Autocomplete dropdown styling */
  .ac_results {
    font-size: 18px !important;
  }
  
  .ac_results li {
    padding: 8px !important;
    line-height: 1.4 !important;
  }
  
  /* Plant selector table styling */
  .plant-selector-table {
    width: 100% !important;
    border-collapse: collapse !important;
  }
  
  .plant-selector-table td {
    padding: 12px 8px !important;
    vertical-align: middle !important;
  }
  
  .plant-selector-table input[type="checkbox"] {
    width: 20px !important;
    height: 20px !important;
    margin: 0 !important;
    transform: scale(1.2) !important;
  }
  
  .plant-selector-table label {
    font-size: 18px !important;
    padding: 8px 0 !important;
    cursor: pointer !important;
    display: block !important;
    line-height: 1.4 !important;
  }
  
  .plant-selector-table tr {
    border-bottom: 1px solid #eee !important;
  }
  
  .plant-selector-table tr:hover {
    background-color: #f5f5f5 !important;
  }
}