.mainimage {
  position: relative;
  }

.mainimage p {
  position: absolute;
  top: 50%;
  left: 50%;
  -ms-transform: translate(-50%,-50%);
  -webkit-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
  margin:0;
  padding:0;
  color: white;
  font-family: 'Quicksand', sans-serif;
  font-weight: 300;
  font-size: 7vw;

  }

.mainimage img {
  width: 100%;
  }

.logo-img {
  position: relative;
  margin-top: -5px;
  margin-left: 10px;
  width: 90px;
  vertical-align: middle;
  }  

.maintext {
  font-family: 'Quicksand', sans-serif;
  font-weight: 300;
  }

.maintext-b {
  font-family: 'Quicksand', sans-serif;
  font-weight: 500;
  } 

.flex {
  display: flex;
  flex-wrap: wrap;
}

.card {
  position: relative;
  margin: 0.5rem 0 1rem 0;
  background-color: #fff;
  -webkit-transition: -webkit-box-shadow .25s;
  transition: -webkit-box-shadow .25s;
  transition: box-shadow .25s;
  transition: box-shadow .25s, -webkit-box-shadow .25s;
  border-radius: 2px;
  width: 100%;
  height: 100%;
    
}

.divlink{
    position:relative;
}

.divlink .link{
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

body {
  display: flex;
  min-height: 100vh;
  flex-direction: column;
}

main {
  flex: 1 0 auto;
}

.grid { 
  margin : 0 auto;
}

/*small window*/
@media screen and (max-width: 768px) {
  .grid-sizer { width: 100%; }
  .grid-item { width: 100%; }
}

/*midium window*/
@media screen and (min-width:768px) and ( max-width:1200px) {
  .grid-sizer { width: 50%; }
  .grid-item { width: 48%; }
}

/*large window*/
@media screen and (min-width: 1200px) {
  .grid-item { width: 31%;}
  .grid-sizer {width: 33.333%;}
}