body,h1,h2,h3,h4,h5 {font-family: "Raleway", Arial, sans-serif}
h1 {letter-spacing: 6px}

.w3-row-padding img {margin-bottom: 12px}
.w3-greyscale, .w3-grayscale {
    filter: grayscale(0%);
}
.w3-opacity {opacity: 1}
.w3-light-grey, .w3-hover-light-grey:hover, .w3-light-gray, .w3-hover-light-gray:hover {background-color: #FFFFFF!important}

img {margin-bottom: -7px}

.row {
  display: flex;
  flex-wrap: wrap;
  padding: 0 4px;
}

/* Create four equal columns that sits next to each other */
.column-4 {
  flex: 25%;
  max-width: 25%;
  padding: 0 4px 1em 4px;
}
.column-3 {
  flex: 33%;
  max-width: 33%;
  padding: 0 4px 1em 1em;
}
.column-4 img, .column-3 img {
  margin-top: 8px;
  vertical-align: middle;
  width: 100%;
}

/* Responsive layout - makes a two column-layout instead of four columns */
@media screen and (max-width: 800px) {
  .column-4, .column-3 {
    flex: 50%;
    max-width: 50%;
  }
}

/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {
  .column-4, .column-3 {
    flex: 100%;
    max-width: 100%;
  }
}

#myBtn {
  display: none; /* Hidden by default */
  position: fixed; /* Fixed/sticky position */
  bottom: 20px; /* Place the button at the bottom of the page */
  right: 30px; /* Place the button 30px from the right */
  z-index: 99; /* Make sure it does not overlap */
  border: none; /* Remove borders */
  outline: none; /* Remove outline */
  background-color: lightgrey; /* Set a background color */
  color: white; /* Text color */
  cursor: pointer; /* Add a mouse pointer on hover */
  padding: 15px; /* Some padding */
  border-radius: 10px; /* Rounded corners */
  font-size: 18px; /* Increase font size */
}

#myBtn:hover {
  background-color: #555; /* Add a dark-grey background on hover */
}
/*img {border-radius: 15px}*/
button {border-radius: 15px}