body {
  background-color: #faebd7;   
}

.sub {
  color:#eee;
  font-size:1rem!important; 
}

.bg-overlay {
  color:white;
  font-size:1rem!important;
  background-color: rgba(0,0,0,0.5); 
}

h2 {
  color:saddlebrown;
}

.side {
  background-color:rgba(220,220,220,0.4);
}

.side a {
  color:saddlebrown;
}

.side a:hover {
  color:saddlebrown;
}

.social {
  max-width:300px;
}


@media only screen and (max-width: 767px) {          
  header {
    background: transparent url("../images/bg.jpg") no-repeat top center;
    background-size:auto 100%;
    height:50vh;    
  }  
}

@media only screen and (min-width: 768px) and (max-width: 991px) {          
  header{
    background: transparent url("../images/bg.jpg") no-repeat top center;
    background-size:auto 100%; 
    height:60vh;
  }
}

@media only screen and (min-width: 992px) {          
  header{
    height:100vh;
    background: transparent url("../images/bg.jpg") no-repeat top center; 
  }
}

@media only screen and (min-width: 360px) and (max-width: 767px) {          
  .logo {
   max-width:300px;   
  }      
}