@charset "utf-8";


.OrangeBorder{border:solid 2px #F19806;}
.OrangeBack{background-color:#F19806!important;}

.PaymentFieldSize{ width: 8vmax; font-size: 90%;}

.StrongTablePadding tr td{padding:3px 8px;}



.PriceMatrix{
font-size: 90%;
  background: #fff;
  color: #000;
  padding-left: 5px;
  padding-right: 5px;
  padding-top: 1px;
  padding-bottom: 1px;
}

form {
  margin: 0;
  padding: 0;
}
.smallform {
  width: 2px;
  display: inline-block;
}
textarea {
  font-family: Poppins, sans-serif;
  font-weight: 400;
  background: #fff;
  background: rbga(255, 255, 255, .1);
  color: #000;
  padding-left: 5px;
  padding-right: 5px;
  padding-top: 5px;
  padding-bottom: 5px;
  border-bottom: solid 1px #c8c7b4;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  -webkit-appearance: none;
  overflow: auto;
}
textarea:focus {
  background-color: #CCCCFF;
  color: #000;
}
select {font-family: Poppins, sans-serif;
  font-weight: 600;
  background-color: #292929;
  color: #fff;
  padding-top: 5px;
  padding-bottom: 5px;
  padding-right: 25px;
  padding-left: 0;
  margin: 0;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  border: 0 3px 0 #ccc;
  background: url(../cssimg/sortarrows.png) no-repeat right #292929;
  background-size: 15px 15px;
  outline: none;
  display: inline-block;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
input[class=address] {
  width: 30vw !important;
  max-width: 400px;
}
input {
  font-family: Questrial, Poppins, sans-serif;
  font-weight: 400;
  background: #fff;
  background: rbga(255, 255, 255, .1);
  color: #000;
  padding-left: 5px;
  padding-right: 5px;
  padding-top: 5px;
  padding-bottom: 5px;
  border-bottom: solid 1px #c8c7b4;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
 outline-style: none;
}

input:-moz-focusring {outline-style: none;}

input[type=password], input[type=text] {
  font-size: 1vmax;
  font-family: Questrial, Poppins, sans-serif;
  font-weight: 400;
  background: rbga(255,255,255,.1);
  color: #000;
  padding-left: 5px;
  padding-right: 5px;
  padding-top: 5px;
  padding-bottom: 5px;
  border-bottom: solid 1px #c8c7b4;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  -webkit-appearance: none;
  width: 20vw;
  max-width: auto;
}
input[type=email] {
  font-size: 1vmax;
  width: 30vw;
  max-width: auto;
}
input[type=email]:focus {
  outline: none;
  background: #CCCCFF;
  color: #000;
  width: 30vw;
  max-width: auto;
}
input[type=password]:focus {
  outline: none;
  background: #CCCCFF;
  color: #000;
}
input[type=text]:focus {
  outline: none;
  background: #CCCCFF;
  color: #000;
}


input[type=hiddenpassword] {
  font-size: 1vmax;
  font-family: Questrial, Poppins, sans-serif;
  font-weight: 400;
  background: rgba(51,51,51,1.00);
  color: rgba(51,51,51,1.00);
  padding-left: 5px;
  padding-right: 5px;
  padding-top: 5px;
  padding-bottom: 5px;
  border:none;
  -webkit-appearance: none;
  width: 20vw;
  max-width: auto;
}
input[type=hiddenpassword]:focus {  
background: rgba(51,51,51,1.00);
color: rgba(51,51,51,1.00);
}




input[class=inputxsmall] {
  width: 2vw !important;
  font-size: 90%;
  text-align: center;
}
input[class=inputsmall] {
  width: 3vw !important;
  font-size: 90%;
  text-align: center;
}
input[class=inputmedium] {
  width: 4vw !important;
  font-size: 90%;
  text-align: center;
}
input[class=inputlarge] {
  width: 5vw !important;
  font-size: 90%;
  text-align: center;
}



input[id=poSET] {
  font-family: Questrial;
  font-weight: 400;
  font-size: 1vmax;
  background: none;
  color: #fff;
  padding-left: 5px;
  padding-right: 5px;
  padding-top: 5px;
  padding-bottom: 5px;
  border-bottom: solid 1px #c8c7b4;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  -webkit-appearance: none;
  width: 6vw;
  max-width: 30%;
}
input[id=poSET]:focus {
  outline: none;
  background: #CCCCFF;
  color: #000;
}
input[type=reset], input[id=next] {
  background: #575757;
  text-transform: uppercase;
  color: #fff;
  border: none;
  padding: 7px 20px;
  border-bottom: solid 1px #55473b;
  cursor: pointer;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  -webkit-appearance: none;
}
input[type=reset]:hover {
  background: #878787 !important;
  color: #fff;
}
input[id=next]:hover {
  background: #878787 !important;
  color: #fff;
}
input[id=PO], input[id=Quote], input[id=Invoice] {
  background: #838383;
  color: #fff;
  width: 7vw;
}
input[id=jobitem_width], input[id=jobitem_height], input[id=jobitem_qty] {
  background: #838383;
  color: #fff;
  width: 45px;
}
input[id=jobitem_price] {
  background: #fff;
  color: #000;
  width: 75px;
}
input[id=city] {
  width: 18vw;
}
input[id=state] {
  width: 4vw;
}
input[id=zip] {
  width: 7vw;
}
input[id=standardCardCvv] {
  width: 5vw;
}
input[id=standardCardExpiration] {
  width: 8vw;
}
input[id=qty] {
  width: 35px;
}
input[id=delete] {
  background-image: url('../cssimg/Delete-icon.png');
  background-size: 20px 20px;
  background-repeat: no-repeat;
  text-transform: none;
  cursor: pointer;
  padding: 5px;
  background-position: center;
  border: none;
  background-color: inherit;
}
input[id=delete]:hover {
  background-size: 25px 25px;
  padding: 10px;
}
input[id=sminput] {
  width: 75px;
  color: #fff;
  background: none;
}
input[id=medinput] {
  width: 95px;
  color: #fff;
  background: none;
}
input[id=largeinput],input[class=largeinput] {  width: 125px;  color: #fff;  background: none;}


.sminput {  width: 75px !important;  color: #fff!important;  background: none!important;}

.medinput {  width: 95px !important;  color: #fff!important;  background: none!important;}

.largeinput {  width: 125px !important;  color: #fff!important;  background: none!important;}

.invoiceqty {  width: 3.5vw !important;  color: #fff!important;  font-size: 90%;  background: none!important;}

.amount {  width: 5vw !important;  color: #fff!important;  font-size: 90%;  background: none!important;  text-align: right!important;}

.OptQtyEntry {  width: 3.5vw !important;  color: #fff!important;  font-size: 90%;  background-color: inherit;}

.lineamount {  width: 3.5vw !important;  color: #fff !important;  font-size: 90% !important;  background: none !important;  text-align: right!important;}


.lineoptqty {  width: 2vw !important;  color: #fff!important;  font-size: 90% !important;  background-color: inherit; text-align: center!important; padding:2px 1px!important;}

.clearinputstyle {  border: none;}

input[id=inputXLarge] {  width: 155px;}
input[id=inputLarge] {  width: 125px;}
input[id=inputMedium] {  width: 75px;}
input[id=inputSmall] {  width: 55px;}
input[id=inputxSmall] {  width: 35px;}
input[id=inputxxSmall] {  width: 25px;}
input[class=inputSmall] {  width: 55px !important;}
input[class=twodigit] {  width: 2vw !important;  color: #fff;  font-size: 90%;  background: none;  text-align: center;}

input[class=threedigit] {
  width: 3vw !important;
  color: #fff;
  font-size: 90%;
  background: none;
  text-align: center;
}
input[class=sixdigit] {
  width: 5vw !important;
  color: #fff;
  font-size: 90%;
  background: none;
  text-align: center;
}
input[class=eightdigit] {
  width: 7vw !important;
  color: #fff;
  font-size: 90%;
  background: none;
  text-align: center;
}
input[class=tendigit] {
  width: 10vw !important;
  color: #fff;
  font-size: 90%;
  background: none;
  text-align: center;
}
input[type=radio].css-checkbox {
  position: absolute;
  z-index: -1000;
  left: -1000px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  height: 1px;
  width: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
}
input[type=radio].css-checkbox + label.css-label {
  padding-left: 33px;
  height: 28px;
  display: inline-block;
  background-repeat: no-repeat;
  background-position: 0 0;
  font-size: 28px;
  vertical-align: middle;
  cursor: pointer;
  ;
}
input[type=radio].css-checkbox:checked + label.css-label {
  background-position: 0 -28px;
}


label.css-label {
  background-image: url(../cssimg/radio.png);
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
input[type=checkbox].css-checkbox {
  position: absolute;
  z-index: -1000;
  left: -1000px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  height: 1px;
  width: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
}
input[type=checkbox].css-checkbox + label.css-label {
  padding-left: 33px;
  height: 28px;
  display: inline-block;
  background-repeat: no-repeat;
  background-position: 0 0;
  font-size: 20px;
  vertical-align: middle;
}
input[type=checkbox].css-checkbox:checked + label.css-label {
  background-position: 0 -28px;
}
label.css-label {
  background-image: url(../cssimg/radiocheck3.png);
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
input[type=checkbox].css-checkbox + label.css-label2 {
  padding-left: 33px;
  height: 28px;
  display: inline-block;
  background-repeat: no-repeat;
  background-position: 0 0;
  font-size: 20px;
  vertical-align: middle;
}
input[type=checkbox].css-checkbox:checked + label.css-label2 {
  background-position: 0 -28px;
}
label.css-label2 {
  background-image: url(../cssimg/radio.png);
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}


.countleft {font-size:90%;height:20px;width:30px;padding:0px;}








.datesearch button {
  overflow: visible;
  position: relative !important;
  right: 0 !important;
  border: 0;
  padding: 0 !important;
  cursor: pointer;
  height: 40px !important;
  width: 110px !important;
  font-weight: bold;
  font-size: 1vmax;
  font-family: 'lucida sans', 'trebuchet MS', 'Tahoma';
  color: #fff;
  text-transform: uppercase;
  background: #d83c3c;
  border-radius: 3px 3px 3px 3px;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, .3);
}
.datesearch button:hover {
  background: #e54040;
}
.datesearch button:active, .datesearch button:focus {
  background: #c42f2f;
  outline: 0;
}
.datesearch button:before { /* left arrow */
  content: '';
  position: absolute;
  border-width: 8px 8px 8px 0;
  border-style: solid solid solid none;
  border-color: transparent #d83c3c transparent;
  top: 12px;
  left: -6px;
}
.datesearch button:hover:before {
  border-right-color: #e54040;
}
.datesearch button:focus:before, .datesearch button:active:before {
  border-right-color: #c42f2f;
}
.datesearch button::-moz-focus-inner {
  /* remove extra button spacing for Mozilla Firefox */
  border: 0;
  padding: 0;
}
.datesearch select {
  background: #fff !important;
  top: 0px;
  outline: 0px none !important;
  border: 0 !important;
  position: relative;
  left: 0px;
  padding: 0;
  height: 40px !important;
  color: #000 !important;
  border-radius: 4px 0 0 4px;
  box-shadow: 0 1px 1px rgba(0, 0, 0, .4) inset, 0 1px 0 rgba(255, 255, 255, .2);
}
.datesearch select option {
  padding-top: 12px;
  background: none !important;
}
.datesearch option {
  padding-top: 10px;
  background: none !important;
}









input[type=checkbox].select-checkbox {
  position: absolute;
  z-index: -1000;
  left: -1000px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  height: 1px;
  width: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
}
input[type=checkbox].select-checkbox + label.select-label {
  padding-left: 33px;
  height: 28px; width:28px; background-size: 28px;
  display: inline-block;
  background-repeat: no-repeat;
  background-position: 0 0;
  vertical-align: middle;
}
input[type=checkbox].select-checkbox:checked + label.select-label {
  background-image: url(../cssimg/GreenCheckSquare.png);
}
label.select-label {
  background-image: url(../cssimg/EmptyCheckSquare.png);
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}






.zf:before, .zf:after{content:"";display:table;}
.zf:after{clear:both;}
.zf{transform: scale(1); transform-origin: 0 0;}    
/* Form wrapper styling */

.form-holder {width: 600px!important;
    padding-top:5px; padding-bottom:5px; padding-left:15px!important; padding-right:15px!important;
    margin: 5px auto 5px auto!important; text-align:center!important; 
   /*  background: rgba(0,0,0,.2); */
    border-radius: 10px;
   /* box-shadow: 0 1px 1px rgba(0,0,0,.4) inset, 0 1px 0 rgba(255,255,255,.2);  */
    }


.form-holder input {
    width: 350px!important;
    height: 40px!important; margin-left:-5px!important;
    padding: 0px 0px 0px 4px; margin-right: -4px!important;
    font: bold 15px 'lucida sans', 'trebuchet MS', 'Tahoma';
    border: 0;
    background: #fff; color:#000;
    border-radius: 0 0 0 0;     
}

.form-holder input:focus {
    outline: 0; color:#000;
    background: #fff;
    box-shadow: 0 0 2px rgba(0,0,0,.8) inset;
}

  

.form-holder button {
    overflow: visible;
    position: relative!important;

    right:0!important;
    border: 0;
    padding: 0!important;
    cursor: pointer;
    height: 40px!important;
    width: 110px!important;
    font: bold 15px/40px 'lucida sans', 'trebuchet MS', 'Tahoma';
    color: #fff;
    text-transform: uppercase;
    background: #d83c3c;
    border-radius: 0 3px 3px 0;     
    text-shadow: 0 -1px 0 rgba(0, 0 ,0, .3);
}  

.form-holder button:hover{    
    background: #e54040;
}  

.form-holder button:active,
.form-holder button:focus{  
    background: #c42f2f;
    outline: 0;  
}

.form-holder button:before { /* left arrow */
    content: '';
    position: absolute;
    border-width: 8px 8px 8px 0;
    border-style: solid solid solid none;
    border-color: transparent #d83c3c transparent;
    top: 12px;
    left: -6px;
}

.form-holder button:hover:before{
    border-right-color: #e54040;
}

.form-holder button:focus:before,
.form-holder button:active:before{
        border-right-color: #c42f2f;
}     

.form-holder button::-moz-focus-inner { /* remove extra button spacing for Mozilla Firefox */
    border: 0;
    padding: 0;
}  
.form-holder select {background:#fff!important;
  top: 0px; outline:0px none!important; border:0!important;
  position: relative; left:0px; padding: 0;
  height: 40px !important; color:#000!important;
  border-radius: 4px 0 0 4px; box-shadow: 0 1px 1px rgba(0,0,0,.4) inset, 0 1px 0 rgba(255,255,255,.2);     
  }



.form-holder select option {padding-top:12px;background:none!important;}
.form-holder  option {padding-top:10px;background:none!important;}