/* Your custom styles */

html,
body,
header,
#intro {
  height: 100%;
}

#intro {
  background: url("../img/BrendaJanneke.jpg") no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

@font-face {
  font-family: "Santana";
  src: local(Santana BlackCondensed), url("../font/santana/Santana-BlackCondensed-webfont.woff");
}

/* remove MDB box-shadow */
.navbar {
  box-shadow: 0 0;
}

.top-nav-collapse {
  background-color: #616161;
  color: #fff;
}

.smv-title {
  font-family: 'Santana', Arial, sans-serif;
  font-size: 1em;
  font-weight: 300;
  line-height: 1.2;
  letter-spacing: 5px;
}

.smv-slogan {
  font-size: 0.8em;
}

.mask {
  flex-direction: column;
}

.lidmaatschap {
  list-style: none;
  text-align: left;
}

.fa-arrow-circle-right {
  color : #4082ed;
}

/* Very small devices (portrait phones, 576px and below) */
@media (max-width: 576px) {
  .smv-title {
    font-size: 1.5em;
  }
  .smv-slogan {
    font-size: 1.2em;
  }
}

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {
  .smv-title {
    font-size: 1.5em;
  }
  .smv-slogan {
    font-size: 1.2em;
  }  
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
  .smv-title {
    font-size: 2.0em;
  }
  .smv-slogan {
    font-size: 1.6em;
  } 
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
  .smv-title {
    font-size: 2.5em;
  }
  .smv-slogan {
    font-size: 2.0em;
  }  
}

/* Extra large devices (large desktops, 1600px and up) */
@media (min-width: 1600px) {
  .smv-title {
    font-size: 3.0em;
  }
  .smv-slogan {
    font-size: 2.4em;
  }  
}

/* Extra large devices (large desktops, 1920px and up) */
@media (min-width: 1920px) {
  .smv-title {
    font-size: 5.5em;
  }
  .smv-slogan {
    font-size: 2.5em;
  }  
}