/* Move down content because we have a fixed navbar that is 50px tall */
body {
    padding: 0px;
    padding-top: 52px;
    padding-bottom: 20px;
    margin:0px;
    margin-top:60px;
    overflow-x: hidden;
}

footer{
    padding-left:15px;
    padding-right:15px;
}
/* Wrapping element */
/* Set some basic padding to keep content from hitting the edges */
.body-content {
    padding-left: 0px;
    padding-right: 0px;
    max-width:1300px;
    margin: auto;
    width: 100%
}
.modal{position: absolute;
      top:0px;
      z-index:9999;
      }

/* Override the default bootstrap behavior where horizontal description lists
   will truncate terms that are too long to fit in the left column
*/
.dl-horizontal dt {
    white-space: normal;
}

h3,li{
    font-family:'Roboto',Courier New, Courier, monospace;
        font-weight:400;
        font-size:12px;
}
.navbar{
  background-image: url("../Images/grunge-wall.png");
  background-repeat: repeat;
  height: 100vh;
}
.top-bar{
  width:300px;
  height:100vh;
  float:none;position: relative;
  margin:auto;
  padding-top: 25vh;
}
.navbar-header{width:100%; display: inline;padding: 0px;}
.navbar-brand{padding: 0px;float:none;margin:0px;}

.black{
  display: none;
}
.menu-button{
  display: none;
}
.navbar-collapse{
  width:100%;
  display:inline;
  position:relative;
  float:left;
  border:none !important;
  margin-top: 5px;
}
.Logo1{
  width:100%;
}
.nav.navbar-nav{width:100%;margin:0px;padding-left:15px;padding-right:15px; }
.nav.navbar-nav li.left{float:left;text-align:left;width:50%;}
.nav.navbar-nav li.right{float:left;text-align:right;width:50%;}
.nav.navbar-nav li a:link{
    font-size:14px;
    font-weight:500;
    padding: 0px;
    margin-bottom: 12px;
    color:#222;
    transition: 1.5s;
}
.nav.navbar-nav li a:hover{
    color:#222;
    background-color:rgba(0,0,0,0.2);
    transition: 1.5s;
}
.nav.navbar-nav li a:active{
    color:#222;
    background-color:rgba(0,0,0,0.2);
    transition: 1.5s;
}
.nav.navbar-nav li a:visited{
    color:#222;
    transition: 1.5s;
}

@media screen and (min-width: 340px) {
  .top-bar{
    padding-top: 25vh;
  }
  .navbar-collapse{margin-top: 5px;}
  .nav.navbar-nav{width:100%;margin:0px;padding-left:20px;padding-right:20px; }
  .nav.navbar-nav li a:link{
      font-size: 18px;
  }

  .top-bar{width:380px;}
}
@media screen and (min-width: 768px) {
  .nav.navbar-nav li a:link{
      font-size: 18px;
      margin-bottom: 12px;
  }

}
@media screen and (min-width: 1068px) {
  .top-bar{
      width:400px;

  }
  .nav.navbar-nav li a:link{
      font-size: 20px;
      font-weight: 400;
      margin-bottom: 12px;
  }

}
@media screen and (min-width: 1300px) {
  .top-bar{
      padding-top: 30vh;
      width:600px;

  }
  .nav.navbar-nav li a:link{
      font-size: 20px;
      font-weight: 400;
      margin-bottom: 12px;
  }

}