body {
    background-color: lightgrey;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    line-height: 1.6em;
    font-weight: lighter;
    margin: 20px;

  }

  .medium_button{    
    background: lightgrey;
    width: 100px;
    height: 40px;
    border-radius:10px;
  }
  
  #special_button{
      background: lightcoral;
      width: 100px;
      height: 40px;
      border-radius: 10px;
  }
  
  h1 {
    color: rgb(20, 30, 60);
    font-size: 30px;
    font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-weight: bolder;
    letter-spacing: 0.1em;

  }

  h2 {
    color: rgb(20, 30, 60);
    font-size: 20px;
    font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-weight: bolder;
    letter-spacing: 0.1em;

  }



/* Three columns side by side */
.column {
  float: left;
  width: 30%;
  margin-bottom: 16px;
  padding: 0 8px;
}

/* Display the columns below each other instead of side by side on small screens */
@media screen and (max-width: 650px) {
  .column {
    width: 100%;
    display: block;
  }
}

/* Add some shadows to create a card effect */
.card {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
}

/* Some left and right padding inside the container */
.container {
  padding: 0 16px;
}