.btn-secondary,
.btn-secondary:hover,
.btn-secondary:focus {
  color: #333;
  text-shadow: none; 
}



body {
  text-shadow: 0 .05rem .1rem rgba(0, 0, 0, .5);
  box-shadow: inset 0 0 5rem rgba(0, 0, 0, .5);
  background-repeat: no-repeat;
  background-size: cover;
}

header{
    padding-left: 20%;
    padding-right: 20%;
}


.cover-container {
  max-width: 42em;
}

h1{
  font-family: 'Protest Revolution', sans-serif;
  font-size: 100px;
  font-weight: 900;
}

h3{
  font-family: 'Libre Baskerville', serif;
  font-weight: 900;
  color:rgba(255, 255, 255, .5);
}

.background-clip{
    position: absolute;
    right: 0;
    bottom: 0;
    z-index: -1;
}

.nav-masthead .nav-link {
  padding: .25rem 0;
  font-weight: 700;
  color: rgba(255, 255, 255, .5);
  background-color: transparent;
  border-bottom: .25rem solid transparent;
}

.nav-masthead .nav-link:hover,
.nav-masthead .nav-link:focus {
  border-bottom-color: rgb(243, 239, 239);
  color: #fff;
}

.nav-masthead .nav-link {
  margin-left: 25px;
}

.nav-masthead .active {
  color: #fff;
  border-bottom-color: #fff;
}

@media (min-aspect-ratio: 16/9) {
    .background-clip{
    width: 100%;
    height: auto;}
}

@media (max-aspect-ratio: 16/9) {
    .background-clip{
    width: auto;
    height: 100%;}
    }

@media(max-width: 992px) and (max-height: 821px) {
     #brand-item{
         text-align: center;
          margin-top: 5px;
        
}
}

@media only screen and (max-width: 1000px) and (max-height: 821px) {
    #brand {
        text-align: center;
    }
}