.inputfield {
  height: 20px
}

.inlin{
  flex-wrap: nowrap;
}

.cardcat:hover {
  border-color: rgb(13, 110, 253);
  box-shadow: 0px 0px 10px 2px rgb(13, 110, 253);
}

.css-grid-table p{
font-size: 13px;}

.css-grid-table,
.css-grid-table-header,
.css-grid-table-body {
  display: grid;

}

.css-grid-table-header,
.css-grid-table-body {
  grid-template-columns: auto auto;
  line-height: 18px;

}

.css-grid-table-body {
  grid-template-rows: auto auto auto;
}

.css-grid-table-header div {
  text-align: center;
  font-weight: bold;
  background-color: rgb(191, 191, 191);
}

.table-condensed{
  font-size: 10px;
}

.table-condensed td {                                          /*****************************/
    padding: 10px;                            /*****************************/
    text-align: center;                       /**** JUST THE CSS STYLES ****/
    border-left: 1px #dee2e6 solid;           /****    NOT IMPORTANT    ****/
    border-right: 1px #dee2e6 solid;          /*****************************/
}   

#spinner-div {
  position: absolute;
  top: 50%;
  display: none;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  text-align: center;
  background-color: rgba(255, 255, 255, 0.9);
  z-index: 2;
}

.order-tag {
  display: block;
    border-radius: 8px;
    color: #fff;
    padding: 6px;
	font-size: 12px;
    font-weight: 700;
    line-height: 38px;
	font-family: GTEestiPro,arial,sans-serif;
}

.price-tag {
  display: block;
    background: #10c44c;
    border-radius: 8px;
    color: #fff;
    padding: 6px;
	font-size: 30px;
    font-weight: 700;
    line-height: 38px;
	font-family: GTEestiPro,arial,sans-serif;
}

.price-tag-old {


    color: #000;
    padding: 2px 8px;
	font-size: 20px;
    line-height: 38px;
	font-family: GTEestiPro,arial,sans-serif;
	text-decoration:line-through; 
}



.price-tag-all {

    
  
    padding: 2px 8px;
	font-size: 30px;
    font-weight: 700;
    line-height: 38px;
	font-family: GTEestiPro,arial,sans-serif;
}

.b-b {
border-radius: 12px;
font-size: 16px;
color: #fff;
font-family: GTEestiPro,arial,sans-serif;
font-weight: 500;
padding: 0 24px;
    min-height: 43px;

}

.wid-b {
	
border: none;
box-shadow: 0 20px 12px -16px rgb(0 30 85 / 10%), 0 8px 24px 18px rgb(0 30 85 / 5%);
border-radius: 20px;
}


.wid-bs {
  transition: all 0.2s ease-in-out; /* Animation */
   margin: 0 auto;
border: none;
box-shadow: 0 20px 12px -16px rgb(0 30 85 / 10%), 0 8px 24px 18px rgb(0 30 85 / 5%);
border-radius: 20px;
}

.wid-bs:hover {
  transform: scale(1.05); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
}
 
.p-c { padding: 1em 2em 2em;
	}
.f-s { 	
	font-size: 2rem;
	}
	
.inline-2{
  display:inline-block;
}	

.price{
  font-size: 18px;
  font-weight: 700;
  color: #222;
  font: 0.8em YS Text,Arial,Helvetica,sans-serif;
  white-space: nowrap;
 line-height: 1;
-webkit-font-smoothing: antialiased;
}

.calculator {
  border: 1px solid #ccc;
  padding: 20px;
  border-radius: 5px;
}
.input-group {

  display: flex;
  align-items: center;
  gap: 10px;
}
select, button, input[type="radio"] {
  padding: 5px;
  margin: 5px;
}
#result {
  margin-top: 20px;
  padding: 10px;
  border: 1px solid #ddd;
  display: block;
}
#canvasContainer {
  margin-top: 20px;
  text-align: center;
  position: relative;
}
canvas {
  border: 0px solid #000;
}