* { box-sizing: border-box; }

.soapTimeCalculator
{
    font: 18px Arial;
    background-color: #fff7f4;
}

@media (max-width: 768px) {
    .soapTimeCalculator {
        font-size: 16px;
    }
    .card__img
    {
       height: 80px;
    }
}

.card__img
{
  height: 100px;
}

/*************************
cardOilReceipt
**************************/
.cardOilReceipt_oilParams{
  font-size: 13px;
  min-width: 30px;
}

.cardOilReceipt_oilParams_circle
{
  width: 20px; 
  height: 20px; 
  border-radius: 50%; 
  background: rgb(255 148 83);
  position: relative; 
  margin-right: 3px;
}

.cardOilReceipt_oilParams_circle span{
  position: absolute; 
  top: 50%; 
  left: 50%; 
  transform: translate(-50%, -50%); 
  font-weight: bolder;
  font-size: 13px;
  color: white;
}

.cardOilReceipt_oilAcid{
  font-size: 13px;
  font-weight: bold;
  min-width: 35px;
}

.cardOilReceipt_oilAcid_circle
{
  width: 28px; 
  height: 23px; 
  align-content: center;
  border-radius: 25%; 
  background: rgb(217 149 243);
  margin-right: 3px;
  text-align: center;
  font-weight: bolder;
  color: white;
}

.cardOilReceipt_btn_close{
  margin-left: 5px; 
  width: 6px; 
  height: 6px;
  
}


/*************************
Receipt
**************************/

.receipt_oilParams_circle
{
  width: 25px; 
  height: 25px; 
  border-radius: 50%; 
  background: rgb(255 148 83);
  position: relative; 
  margin-right: 5px;
}

.receipt_oilParams_circle span{
  position: absolute; 
  top: 50%; 
  left: 50%; 
  transform: translate(-50%, -50%); 
  font-weight: bolder;
  color: white;
}

.receipt_oilAcid_circle
{
  width: 30px; 
  height: 25px; 
  align-content: center;
  border-radius: 25%; 
  background: rgb(217 149 243);
  margin-right: 5px;
  text-align: center;
  font-weight: bolder;
  color: white;
}

.recipeCol2
{
  min-width: 90px;
  width:auto;
}

.recipeCol3
{
  width: 90px;
}



/*************************
searchOil
**************************/
.searchOil_oilParams{
  font-size: 12px;
}

.searchOil_oilParams_circle
{
  width: 19px; 
  height: 19px; 
  border-radius: 50%; 
  background: rgb(255 148 83); 
  position: relative; 
  margin-right: 3px;
}

.searchOil_oilParams_circle span{
  position: absolute; 
  top: 50%; 
  left: 50%; 
  transform: translate(-50%, -50%); 
  font-weight: bolder;
  font-size: 12px;
  color: white;
}

.searchOil_oilAcid{
  font-size: 12px;
}

.searchOil_oilAcid_circle
{
  width: 25px; 
  height: 20px; 
  align-content: center;
  border-radius: 25%; 
  background: rgb(217 149 243);
  margin-right: 3px;
  text-align: center;
  font-weight: bolder;
  color: white;
}


.autocomplete {
  /*the container must be positioned relative:*/
  position: relative;
  display: inline-block;
  min-width: 100%;
}

.filterOilList{
  height: auto; 
  max-height: 400px;
}

.filterAdditiveList{
  height: auto; 
  max-height: 400px;
}

.activeOil
{
  background-color: rgb(151, 198, 241); ;
}

.btnAcidRow
{
  font: 20px Arial;
}