.toc_area {
  display: grid;
  grid-template-areas: 
    "ordrbox tocbox icnbox"
  /*"tocbox  .  nlmsg   .  "; */
    "ordrbox tocbox icnbox";
  grid-template-columns: 17% 59% 1fr;
  height: auto; 
  width: 99%;
  font-family: verdana;
  }

@media (max-width: 1068px) {
.toc_area {
  grid-template-areas: 
    "ordrbox icnbox"
    "tocbox tocbox ";
  grid-template-columns: 49% 1fr;
  }
}

.toc_area2 {
  display: grid;
  grid-template-areas: 
    "tocbox icnbox"
  /*"tocbox  .  nlmsg   .  "; */
    "tocbox icnbox";
  grid-template-columns: 65% 1fr;
  height: auto; 
  width: 99%;
  font-family: verdana;
  }
.toc_area a,
.toc_area2 a {
  text-decoration: none;
  color: #3A713f;
  }
.toc_area a:hover {
  text-decoration: none;
  color: #f9f1e8;
  background-color: #3A713f;
  box-shadow: 3px 3px 3px 0px #233c13;
  }
.toc_area2 a:hover {
  text-decoration: none;
  color: #f9f1e8;
  background-color: #3A713f;
  }

.box_titl {
  height:1.0vw;
  line-height:1.0vw;
  padding:10px;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  background-color: #3A713f;
  color: #f9f1e8;
  /* font-size: 1.2vw; */
  font-weight: bold;
  text-align: center;
  border-bottom: 2px solid #f9f1e8;
  }

.btl { border-top-right-radius: initial;}
.btm { border-top-left-radius: initial;
       border-top-right-radius: initial; }
.btr { border-top-left-radius: initial;}

.lj { text-align: left; }
.rj { text-align: right; }

.box_cols {
  height: 100px; 
  padding: 10px;
  background-color: #ebf1ec;
  border-top: 2px solid #3A713f;
  }
.box_cols2 {
  height: 100px; 
  padding: 10px;
  background-color: #ebf1ec;
  border-top: 2px solid #3A713f;
  }
.pad0 { padding: 0px; }
.sechdr { width: 20vw; }

.ord_box { grid-area: ordrbox; }
.toc_box { grid-area: tocbox;
           margin-left: 1.5vw;  }
@media (max-width: 1068px) {
.toc_box { grid-area: tocbox;
           margin-left: 0;
           margin-top: 2vh;  }
}
.toc_box .toc_cols {
  display: grid;
  grid-template-areas: 
    "tcol1  tcol2  tcol3  tcol4";
  grid-template-columns: 25% 25% 25% 1fr;
  }
@media (max-width: 640px) {
.toc_box .toc_cols {
  display: grid;
  grid-template-areas: 
    "tcol1  tcol3 "
    "tcol2  tcol4";
  grid-template-columns: 49% 1fr;
  }
.box_cols2 {
  height: 175px; 
  }
}

.toc_col1 { grid-area: tcol1;
            padding-left: 1.5vw; }
.toc_col2 { grid-area: tcol2;
            margin-left: .01vw; }
.toc_col3 { grid-area: tcol3;
            margin-left: .01vw; }
.toc_col4 { grid-area: tcol4;
            margin-left: .01vw; }

@media (max-width: 640px) {
.toc_col2 { grid-area: tcol2;
            padding-left: 1.5vw; }
}

.toc_item { display: inline-block;
            padding-top: .1vw;
            padding-bottom: .3vw;
            font-weight: 500;
            cursor: pointer; }

.icn_box { grid-area: icnbox;
           margin-left: 1.5vw; }
.icn_box .icn_cols {
  display: grid;
  grid-template-areas: 
    "icn1 . icn2 .";
  grid-template-columns: 40% 10% 30% 1fr;
  }

.icn_cols a:hover { box-shadow: none; }

.icn_col1 { grid-area: icn1;
            margin-left: .7vw;  }
.icn_col2 { grid-area: icn2;
            /* margin-left: 1vw; */  }

.icn_col { margin-top: .5vw;
           border: 2px solid #ebf1ec; }
.icn_col:hover {  border: 2px solid #3A713f;  }
/* .icn_col:hover {  box-shadow: 3px 3px 3px 0px #233c13;  } */
/* .icn_col img:hover {  box-shadow: 3px 3px 3px 0px #233c13;  } */

.nl_msg { grid-area: nlmsg;
          /* width: 400px; */
          text-align: center; }

/* .mt_box1 { grid-area: mpt; } */
/* .mt_box2 { grid-area: mpt2; } */

.hr_grn { border: 1px solid #3A713f;
  }
.txt_grn { color: #3A713f;
  padding-left: 1vw;
  font-weight: bold;
  }
.txt_grn a:hover {
  text-decoration: none;
  color: #f9f1e8;
  background-color: #3A713f;
  box-shadow: 3px 3px 3px 0px #233c13;
  }
#avtitl,
.grn { color: #3A713f; }
h4.grn { margin-bottom: 1vw; }
.rqrd { color: red !important;
        font-weight: bold; }

.bkg_logo {
  /* background-image: url("https://frantznursery.com/pdf/frantz_logo_bkg.png"); */
  background-image: url("https://fwn.allegrosupport.com/pdf/frantz_logo_bkg.png");
  /* background-image: url("../frantz_logo_bkg.png"); */
  background-size: 78%;
  background-repeat: repeat-y;
  }
.av_list {
  color: #927651;
  font-family: verdana;
  padding-left: 0.5vw;
  }
.av_list table thead td {
  color: #3A713f;
  font-family: verdana;
  font-weight: bold;
  }
.av_list table tbody td {
  color: #927651;
  font-family: verdana;
  }
.av_list a {
  color: #3A713f;
  font-weight: bold;
  text-decoration: none;
  }
.av_list a:hover {
  /* text-decoration: underline;
  color: #00bd00; */
  text-decoration: none;
  color: #f9f1e8;
  background-color: #3A713f;
  box-shadow: 3px 3px 3px 0px #233c13;
  }

.prod_cat {
  display: inline-block;
  color: #f9f1e8 !important;
  background-color: #3A713f;
  padding-left: 1vw;
  margin-left: -1vw;
  margin-bottom: .5vw;
  width: 17vw;
  padding-top: .25vw;
  padding-bottom: .3vw;
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  }
.prod_cat:hover {
  text-decoration: underline !important;
  color: #ffff30 !important;
  box-shadow: 3px 3px 3px 0px #233c13;
  }

@media (max-width: 1068px) {
.prod_cat {
  width: 25vw;
  }
}
@media (max-width: 640px) {
.prod_cat {
  width: 40vw;
  }
}

.avl_cols {
  display: grid;
  grid-template-areas: "lcol rcol";
  grid-template-columns: 48% 1fr;
  height: auto; 
  }

.avl_lcol { grid-area: lcol; }
.avl_rcol { grid-area: rcol;
         margin-left: 1vw; }

@media (max-width: 640px) {
.avl_cols {
  display: grid;
  grid-template-areas: "lcol"
                       "rcol";
  grid-template-columns: 1fr;
  height: auto; 
  }
.avl_rcol { margin-left: 0; }
}

.scroll_box {
  border: 1px solid #927651;
  height: 50vh;
  width: 63.5vw;
  padding-left: 1vw;
  overflow: auto;
  margin-bottom: .5vw;
  }
@media (max-width: 1068px) {
.scroll_box {
  width: 95%;
  }
}
.container { max-width: 1088px; }
.content { padding-top: 5px; }

.tbl_hdr { /* width: 62vw; */
           font-family: verdana;
           font-weight: bold;
           color: #927651;
           padding-top: 0.5vw;
           padding-bottom: 0.5vw;
           padding-left: 1.5vw;  }
.bothdr { padding-left: 1vw;
          width: 23vw;
          display: inline-block; }
.bothdr.dtc { display: table-cell; }
.prodhdr { padding-left: 1.5vw;
          width: 9vw;
          display: inline-block; }
.sizehdr { padding-left: 1vw;
          width: 3.5vw;
          display: inline-block; }
.pricehdr { padding-left: .8vw;
          width: 6.8vw;
          text-align: right;
          display: inline-block; }
.ordrhdr { padding-left: .8vw;
           width: 3.5vw;
           text-align: right;
           display: inline-block; }
.amthdr { padding-left: 1.6vw;
          width: 6vw;
          text-align: right;
          display: inline-block; }
.gthdr { padding-left: 19.3vw;
          width: 9vw;
          text-align: right;
          display: inline-block; }

.prodtbl { border-spacing: 0; }
.botname { padding-left: 1vw;
           width: 23vw;
           }
.prodcode { padding-left: 1vw;
            width: 10vw;
             }
.prcode { width: 4.5vw;
          padding-left: 1vw; }
.prodprice { padding-left: 1vw;
            width: 7vw;
            text-align: right;
             }
.prodprice.pr { padding-right: 0.5vw; }
.prodsize { padding-left: 1vw;
            width: 3.5vw;
           }
.ordrqty { padding-left: 1vw;
           padding-right: .5vw;
           width: 4vw;
           text-align: right; }
.ordrqty input { width: 3.5vw;
                 text-align: right; }
.prodamt { padding-left: 1vw;
           padding-right: .5vw;
           width: 6vw;
           text-align: right;
           }
.prodamt.npr { padding-right: 0px;  }
.prodamt.w7 { width: 7vw; }
.totline { text-align: right;
           padding-top: 5px; }
.pb { padding-bottom: 0.5vw; }
.pr { padding-right: 0.5vw; }
.pr4 { padding-right: 4vw; }
.ssv { font-size: .83em;
       vertical-align: super; }
.ssi { font-size: .83em;
       vertical-align: super;
       visibility: hidden; }
table.ordconf { margin-left: 1vw;
                border-collapse: collapse; }
table.ordconf tbody {
        border: 1px solid #3A713f;
        border-top: none;
        border-collapse: separate;
        border-spacing: 4px; }
input.ordconf { width: 23vw; }
input.ordconf,
textarea.ordconf { color: #927651; }
p.ordconf { font-size: initial; }

input.ordconf:focus,
textarea.ordconf:focus { outline: 2px solid #3A713f;
                      background-color: #f9f1e8;
                      color: black; }
.tr1 { background-color: #e7efe9 }
.tr2 { background-color: #f9f1e8 }
.trtop td { border-top: 1px solid #927651;  }
.tdbttm,
.trbttm td { border-bottom: 1px solid #927651;  }

#clear_form,
#submt      { border-radius: initial;
              -webkit-border-radius: initial;
              color: initial;
              border-style: outset;
              border-width: 2px;
              border-color: #767676;
              padding-top: initial;
              padding-bottom: initial;
              }
.subbutt,
#clear_form,
#submt { 
  margin-left: 1vw;
  font-size: 1.2vw;
  padding-left: 0.5vw;
  padding-right: 0.5vw;
  background-color: #e7efe9;
  cursor: pointer;
  }
.subbutt:hover,
#clear_form:hover,
#submt:hover,
#b_retail:hover, #b_wholesale:hover {
  text-decoration: none;
  color: #f9f1e8;
  background-color: #3A713f;
  box-shadow: 3px 3px 3px 0px #233c13;
  }
#b_retail, #b_wholesale {
    padding: 0;
    background-color: #faf1e7;
    cursor: pointer;
    border-radius: initial;
    -webkit-border-radius: initial;
    color: initial;
    border-style: outset;
    padding-top: initial;
    padding-bottom: initial;
    margin-bottom: 1vw;
    width: 110px;
    margin-left: 10%;
    }
.vhidn { visibility: hidden; }