style.css

@import url(https://fonts.googleapis.com/css?family=Open+Sans);

/* Colour variables */
:root{
  --bodybackground: #eeeeee;
  --cardbackground: #E3E6ED;
  --accentcolour1: #597E6F;
  --accentcolour2: #009688;
}

body{
  font-family: "Open Sans",sans-serif;
  background-color: var( --bodybackground);
}

.btn-default{
  padding:10px;
}

.jumbotron{
  background-image: linear-gradient(120deg, var(--accentcolour1), var(--accentcolour2));
  color: white;
  padding: 20px;
}

.jumbotron a{
  color: #FFF;
  text-decoration: none;
}

/* ---- isotope ---- */

.grid {
  border: 0px solid #333;
}

/* clear fix */
.grid:after {
  content: '';
  display: block;
  clear: both;
}

/* ---- .searchable-item ---- */

.searchable-item {
  position: relative;
  float: left;
  margin: 5px;
  padding: 20px;
  color: #262524;
  width: 250px;
}

.searchable-item a {
  text-decoration: none;
}

.searchable-item > * {
  margin: 0;
  padding: 0;
}

input[type=text]{
  padding: 12px 20px;
  border-radius: 4px;
  width: 100%;
  border: 1px solid grey;
}

/* This is a cheeky hack to search for creating alternative search words / keywords that you don't want displayed, but still want searchable. See readme for more. */
.hiddentext{
  display:none;
}

/* Spotlight cards */

.card{
  padding: 10px;
  background-color: var(--cardbackground);
  text-align: center;
  border: 3px solid #ecf0f1;
  border-radius: 11px;
}

img {
  width: 50%;
}