@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,700;1,400&family=Bebas+Neue&display=swap');
body {
 background-color: black;
  width:100vw;
  height: 100vh;
  margin: 0;
}

.bg-black{
  background-color: #000 !important;
}

.body-text{
  text-shadow: 1px 1px 2px #000;
}

.navbar-toggler{
  text-shadow: 1px 1px 3px #000;
}
#videoBG {
  position:fixed;
  z-index: -1;
}

.card{
  border: 2px solid white;
  background-color:transparent;
}

.card-body{
  background-color: rgba(0,0,0,0.5);
}
.card-text{
  color:white;
}
.card-img-top{
  border-bottom: 2px solid white;
}

/* phones */
@media (max-width: 767px) {
  #mainNavBar{
    background-color: #000 !important;
    background:url('headerback.png') no-repeat center 60px fixed;
   
    /* background-position-y: 4em; */
    background-size: contain;
  }

  #videoBG {
    position:fixed;
    bottom: 0;
    z-index: -1;
    width: 100%;
    margin-left: -10px !important;
  }

  body,html {
      background: url('firestill.png') center center no-repeat fixed;
      background-size: cover;
  }

  .card{
    margin: 4em auto;
  }

  .card-img{

  }

  .name-text{
    font-family: "Bebas Neue", sans-serif;
    color: white;
    text-transform: uppercase;
    letter-spacing: 0vw;
    line-height: 1.5;
    font-size: 2.5rem;
    text-align: center;
    text-shadow: 2px 2px 4px black;
  }

  .container > a.navbar-brand > img.img-fluid{
    height: 12em;
    max-height: 300px;
    margin: auto;
   
  }

  .jumbotron{
    padding-top: 300px;
  }

  footer {
    padding-top: 2rem;
    padding-bottom: 3rem;
  }

  footer p {
    margin-bottom: .25rem;
  }


  footer{
    background-color: rgba(0,0,0,0.5);
  }

}



/* tablets & higher */
@media (min-width: 768px) {

  #mainNavBar{
    background-color: #000 !important;
    background:url('headerback.png') no-repeat fixed;
    background-position-x: 65%;
    background-position-y: top;
    background-size:auto;
  }

  @media (min-aspect-ratio: 16/9) {
    #videoBG {
        width:100%;
        height: auto;
    }
  }
  @media (max-aspect-ratio: 16/9) {
    
    #videoBG { 
      top: 0%;
        width:auto;
        height: 100%;
    }
  }
  .container > a.navbar-brand > img.img-fluid{
    height: 10em;
    max-height: 300px;
  }

  #navbarHeader{
    padding-top: 200px;
  }

  

      .jumbotron {
        padding-top: 300px;
        padding-bottom: 3rem;
        margin-bottom: 0
      
    }

    .jumbotron p:last-child {
      margin-bottom: 0;
    }

    .jumbotron h1 {
      font-weight: 300;
    }

    .jumbotron .container {
      max-width: 40rem;
    }

    footer {
      padding-top: 3rem;
      padding-bottom: 3rem;
    }

    footer p {
      margin-bottom: .25rem;
    }

  
    footer{
      background-color: rgba(0,0,0,0.5);
    }

  .name-text{
    width:50%;
    min-width: 200px;
    height:3.5rem;
    min-height: 50px;
    background-color: white;
    
    font-family: "Roboto", sans-serif;
    /* color: white; */
    text-transform: uppercase;
    letter-spacing: 0vw;
    line-height: 1.5;
    font-size: 2.5rem;
    text-align: center;
    mix-blend-mode: screen;
    box-shadow: 0 0 10px white;
  }

  .logo-text{
    font-family: "Bebas Neue", sans-serif;
    color: white;
    text-transform: uppercase;
    letter-spacing: 0vw;
    line-height: 1.5;
    font-size: 2rem;
    text-align: center;
    text-shadow: 2px 2px 4px black;
    
  }



}