/*
 * Globals
 */
/* Links */
a, a:focus, a:hover{color: #fff; text-decoration: none;}

/* Custom default button */
.btn-default{
  color: #fff;
  text-shadow: none;
  /* Prevent inheritence from `body` */
  background-color: transparent;
  border: 2px solid #fff;
  border-radius: 20px;
  padding: 0.5rem 2rem;}

.btn-default:hover, .btn-default:focus{background-color: rgba(255, 255, 255, 0.3);}

/* Base structure */
html, body{height: 100%;}
body{color: #fff; text-align: center; font-family: 'Nunito Sans', sans-serif;}

#myVideo {
  width: 100vw;
  height: 100vh;
  object-fit: cover;
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: -1;
}

/* Extra markup and styles for table-esque vertical and horizontal centering */
.site-wrapper{
  display: table;
  width: 100%;
  height: 100%;
  /* For at least Firefox */
  min-height: 100%;
  /*box-shadow: inset 0 0 100px rgba(0, 0, 0, 0.5); }*/
}
.site-wrapper-inner{display: table-cell; vertical-align: top;}
.cover-container{margin-right: auto; margin-left: auto;}

/* Padding for spacing */
.inner {padding: 0px;}
.inner img{margin: 20px 0; max-width: 50%;}

/* Header */
.masthead-brand{margin-top: 10px; margin-bottom: 10px;}
.nav-masthead{text-align: center; display: block;}
.nav-masthead .nav-link{display: inline-block;}

@media (min-width: 768px) {
  .masthead-brand{float: left;}
  .nav-masthead{float: right;} 
}

/* Cover */
.cover{padding: 20px;}

.cover .btn-notify{
  padding: 10px 60px;
  font-weight: 500;
  text-transform: uppercase;
  border-radius: 10px;}

.cover-heading{
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 5px;
  font-size: 1rem;
  margin: 1rem 0 2rem;}

@media (min-width: 768px) {
  .cover-heading{font-size: 2rem; margin-top: 0px;} 
}

.cover-copy{max-width: 500px; margin: 2rem auto 1rem;}

/* Footer */
.mastfoot{color: #fff; color: rgba(255, 255, 255, 1);}

/* Affix and center */
@media (min-width: 768px) {
  /* Pull out the header and footer */
  .masthead{}
  .mastfoot{position: fixed; bottom: 0;}
  /* Start the vertical centering */
  .site-wrapper-inner{vertical-align: middle;}
  /* Handle the widths */
  .masthead, .mastfoot, .cover-container{width: 60%;}
}
@media (min-width: 992px) {
  .masthead, .mastfoot, .cover-container{width: 1060px;}
}