body,
html {
  width: 100%;
  height: 100%;
margin:0;
  }

body {
  font-family: 'Roboto', 'Helvetica Neue', Arial, sans-serif;
  padding:0;
  }
  
.splash-bg{
  padding:0;
  width:100%;
  background:url(../img/bg01.jpg);
  background-repeat: no-repeat;
  background-size:cover;
  background-position: top right;
  display:flex;
  flex-direction: column;
  justify-content: center;
  min-height:100vh
}
.splash-content{
  /* background:green; */
  padding:10px;
}
.message{
  padding-left:0px;
}
h1,h2,h3,p, span, a{
  font-family: 'Titillium Web', sans-serif;
  color:white;
  padding:0;
  margin:0;
  text-decoration: none;
}

h1{
  font-weight: 700;
  margin-bottom:1rem;
  margin-top:1rem;
  text-transform: uppercase;
  line-height: .8;
  color:black;
}

p{
  font-weight: 300;
  margin-bottom:3rem;
}
a.contact{
  font-weight: 300;
  color:black;
}
a.contact:hover{
  color:red;
}



@media screen and (max-width: 980px){


  .splash-content{
    /* background:green; */
    padding:30px;
    margin:0;
    }

    .logo{
      width: 20vh;
      height:auto;
      }


    h1{
      font-size: 3rem;
    }
    p{
      font-size: 1.25rem;
    }
    a.contact{
      font-size: 1.25rem;
    }


    .brands{
      max-width:100%;
      border-top:1px solid black; 
      border-bottom:1px solid black; 
      margin-bottom:30px;
      padding:20px 0;
      }
    .brands img{
      height:60px;
    }


}

@media screen and (min-width: 981px){

  .logo{
    width: 20vh;
    height:auto;
    }

  .splash-content{
    padding:50px;
    }
    h1{
      font-size: 10vh;
      margin-bottom:3rem;
    }
    p{
      font-size: 1.5rem;
  
    }
    a.contact{
      font-size: 1.5em;
    }
    a.contact{
      margin-left:20px;
    }

    .brands{
      max-width:900px;
      display:flex;
      flex-direction: row;
      border-top:1px solid black; 
      border-bottom:1px solid black; 
      margin-bottom:50px;
      padding:30px 0;
    }

}

@media screen and (min-width: 1600px){
  .splash-content{
    padding:200px;
    }
}