/*
 * Style tweaks
 * --------------------------------------------------
 */
html,
body {
  overflow-x: hidden; /* Prevent scroll on narrow devices */
  background: #000;
  padding-top: 10px;
}
footer {
  padding: 30px 0;
}
p {
  color: #ababab;
}
h1 {
  color: #e9e9e9;
  text-shadow: 1px 3px 3px rgb(47, 47, 47);
  background: repeating-linear-gradient(-45deg, #e4b600, #e3b500 7px, #af8b01 0px, #ad8e11 15px);
  padding: 10px;
}
h2, h3{
  color: #e9e9e9;
  background: repeating-linear-gradient(-45deg, #3c3c3c, #3c3c3c 7px, #363636 0px, #363636 15px);
  padding: 10px;
}
a{
  color: #e4b600;
}
a:focus, a:hover {
  text-decoration: none;
  color: #fff;
}
hr {
    border-top: 1px solid #333333;
}
.main ul{
    list-style-type: none;
}
.main li{
  color: #ababab;
}
.main li:before {
    float: left;
    width: 1.4em;
    content: "\e080";
    font-family: 'Glyphicons Halflings';
    color: #e4b600;
}
.navbar-brand{
  padding: 5px 15px;
}
.navbar-inverse {
    background-color: #3c3c3c;
    border-color: #313131;
    background: repeating-linear-gradient(-45deg, #3c3c3c, #3c3c3c 7px, #363636 0px, #363636 15px);
}
.navbar-toggle {
    position: relative;
    float: left;
    padding: 4px 10px;
    margin: 10px 0px 10px 10px;
    background-color: transparent;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px;
}
.navbar-toggle .icon-bar {
    background-color: #fff;
    width: 22px;
    height: 4px;
    border-radius: 1px;
}
.nav>li>a {
  font-weight: bold;
}
.nav>li>a:focus, .nav>li>a:hover, .nav>li.active>a {
  text-decoration: none;
  color: #ffffff;
  text-shadow: 1px 3px 3px rgb(47, 47, 47);
  background: repeating-linear-gradient(-45deg, #e4b600, #e3b500 7px, #af8b01 0px, #ad8e11 15px);

}
.sidebar {
    position: fixed;
    top: 50px;
    bottom: 0;
    left: 0;
    z-index: 1000;
    display: block;
    padding: 0px;
    overflow-x: hidden;
    overflow-y: auto;
    background-color: #222222;
    border-right: 1px solid #313131;
    background-image: url('https://www.rpgdot.com/img/ff7-bg.jpg');
    background-position: center;
    background-position-y: -350px;
    background-position-x: 80%;
    background-repeat: no-repeat;
}
.main {
  z-index: 0;
  margin-top: 30px;
}
/*
 * Off Canvas
 * --------------------------------------------------
 */
@media screen and (max-width: 767px) {
  .row-offcanvas {
    position: relative;
    -webkit-transition: all .25s ease-out;
         -o-transition: all .25s ease-out;
            transition: all .25s ease-out;
  }

  .row-offcanvas-right {
    right: 0;
  }

  .row-offcanvas-left {
    left: 0;
  }

  .row-offcanvas-right
  .sidebar-offcanvas {
    right: -50%; /* 6 columns */
  }

  .row-offcanvas-left
  .sidebar-offcanvas {
    left: -50%; /* 6 columns */
  }

  .row-offcanvas-right.active {
    right: 50%; /* 6 columns */
  }

  .row-offcanvas-left.active {
    left: 54%; /* 6 columns */
  }

  .sidebar-offcanvas {
    position: absolute;
    top: 30px;
    width: 50%; /* 6 columns */
  }
}
