:root {
     --main-color:#4D4138; /*Grey*/
     --dk-color:#39291F; /*Black*/
     --md-color:#768138; /*Green*/
     --lt-color:#EFE0DB; /*White*/
     --accent:#768138; /*Green*/
}

@font-face {
  font-family: boldFont;
  src: url('/img/San Marino Beach.otf');
}

body {
  background-color: var(--main-color);
  background-image: url('/img/grain_bg.png');
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: 100% 100%;
  font-family: Verdana, sans-serif;
}

.title{
  font-family: boldFont;
}

.title-img {
 height:150px; 
}

.body-img-left {
 max-height:400px;
 max-width:400px;
 float:left;
 margin-right:15px;
 margin-bottom:15px;
}

.body-img-right {
 max-height:300px;
 max-width:300px;
 float:right;
}

.floaters{
  position:fixed;
  width:35%;
  height:auto;
  right:0%;
  bottom:0%;
}

marquee {
  border-radius: 5px;
  margin: 5px 0px 5px 0px;
}

.main-container {
 color:var(--dk-color);
 width:75%;
 margin-top:2%;
}

.body-container{
  background-color:var(--md-color);
}

.component-container {
 background-color:var(--lt-color);
 color:var(--dk-color);
 border: 5px solid var(--dk-color);
 border-radius: 5px;
 padding:5px;
}

.footer-container{
 background-color:var(--lt-color);
 color:var(--dk-color);
 border: 5px solid var(--dk-color);
 border-radius: 5px;
}

p{
  white-space: pre-wrap;
}

.nav-pills .nav-link,
.nav-item
{
  color:var(--accent);
  font-family: boldFont;
  font-size: 17px;
  margin-bottom: 5px;
}

.nav-pills .nav-link.active,
.nav-pills .nav-item.show .nav-link
{
  background-color: var(--accent);
}

.nav-link.disabled {
  color: var(--main-color);
}

.dropdown-menu {
  background-color: var(--lt-color);
  color: var(--dk-color);
}

.dropdown-item:hover {
  background-color: var(--md-color);
  color: var(--lt-color);
}

.btn-primary, .page-link {
  background-color: var(--md-color);
  border-color: var(--md-color);
  color: var(--lt-color);
  font-family: boldFont;
}

.btn-primary:hover, .page-link:hover {
  background-color: var(--main-color);
  border-color: var(--main-color);
  color: var(--lt-color);
}

.page-item.disabled .page-link {
  background-color: var(--lt-color);
  border-color: var(--lt-color);
  color: var(--main-color);
}

.eye-banner 
{
  background-image: url('/img/shattered-tomorrow/eyes.gif');
  background-repeat:repeat-x;
  height:50px;
  overflow: hidden;
  margin-bottom:15px;
}