body {
  font-family: 'Orbitron', sans-serif;
  font-family: 'Raleway', sans-serif;
  text-align: center;
  background: hsl(0, 0%, 96%);
}

h1 {
  color: #333;
}

div.calculator, .result-container, #sineLawForm {
  background: #fff;
  padding: 10px;
  margin: 20px auto;
  border: 20px ;
  width: 300px;
  text-align: left;
  border-radius: 5px;
  box-shadow: 0px 0px 2px 1px #131212;
  
}

.triangle {
  width: 100%;
  max-width: 300px; /* Set a max width for the triangle */
  margin: 20px auto;
}

.triangle svg {
  width: 100%;
  height: auto;
}

.side {
  stroke: #017340;
  fill: transparent;
}

.side.highlighted {
  stroke: #000000; /* Change the color for highlighted sides */
}

label, input, #recallResultButton {
  display: inline-block;
  margin: 10px 10px;
}

button, #sinus {
  margin: 0 80px 20px 75px;
  background-color: #007BFF;
  color: #fff;
  border: none;
  padding: 10px 20px;
  cursor: pointer;
  border-radius: 5px
}

button:hover{
  background-color: #bdcbda;
  ;
}
#sinus:hover{
  background-color: #bdcbda;
  ;
}
#result, #resultacute {
  margin-top: 20px;
  right: 200px;
  font-weight: bold;
  color: #333;
  box-shadow: #333;
}

.triangle {
  
  border-radius: 10px;
}

.cibs{
  mix-blend-mode: darken;
 
}

.gamma {
  margin: 20px;
  margin-left: 5% ;
  box-shadow: 0px 0px 2px 1px #131212;
}

#mould {
  display: inline-block;
  width: 120px;
  text-align: right;
  margin-right: 10px;
}

#ppvc {
  width: 200px; 
  padding: 5px; 
  margin-bottom: 10px; 
}