*{
    font-weight: bold;
}

body{
    background-image: url(./bg.jpg);
}

.number{
    width: 80px;
    border-radius: 6px;
    border: blue solid 2px;
}

.equation{
    text-align: right;
}

.values{
    color: darkred;
}





.box{
    border: solid black 2px;
    padding: 10px;
}

h3{
    color: darkred;
}

input[type=button]{

appearance: button;
  background-color: #4D4AE8;
  background-image: linear-gradient(180deg, rgba(255, 255, 255, .15), rgba(255, 255, 255, 0));
  border: 1px solid #4D4AE8;
  border-radius: 1rem;
  box-shadow: rgba(255, 255, 255, 0.15) 0 1px 0 inset,rgba(46, 54, 80, 0.075) 0 1px 1px;
  box-sizing: border-box;
  color: #FFFFFF;
  cursor: pointer;
  display: inline-block;
  font-family: Inter,sans-serif;
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.5;
  margin: 0;
  padding: .5rem 1rem;
  text-align: center;
  text-transform: none;
  transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
  user-select: none;
  -webkit-user-select: none;
  touch-action: manipulation;
  vertical-align: middle;
    
}

        .box2{
            font-size: large;
            color: darkblue;
            /*border: solid black 2px;*/
        }
        
        
         .frac {
    display: inline-block;
    position: relative;
    vertical-align: middle;
    letter-spacing: 0.001em;
    text-align: center;
}
.frac > span {
    display: block;
    padding: 0.1em;
}
.frac span.bottom {
    border-top: thin solid darkblue;
}
.frac span.symbol {
    display: none;
} 

.equation_box{
    max-width: 100%;
    border: solid black 2px;
                margin: 5px;
            padding: 15px;

}