@charset "utf-8";
@font-face {
    font-family: 'reHooge';
    src: url('fonts/hoog0553-webfont.eot');
    src: url('fonts/hoog0553-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/hoog0553-webfont.woff2') format('woff2'),
         url('fonts/hoog0553-webfont.woff') format('woff'),
         url('fonts/hoog0553-webfont.ttf') format('truetype'),
         url('fonts/hoog0553-webfont.svg#hooge_05_53regular') format('svg');
    font-weight: normal;
    font-style: normal;

}


footer a{
    color:#7a51ff;
}

body {
    font-family: 'Francois One', sans-serif;
    padding-top:40px;
}

@media screen and (max-width: 1330px) {
    body { padding-top: 90px; }
}

@media screen and (max-width: 1100px) {
    body { padding-top: 130px; }
}

@media screen and (max-width: 768px) {
    body { padding-top: 30px; }
}

#gameContainer {
    padding-top:25px;
}

.frontPage {
    line-height: 2em;
    width:100%;
    font-size:5em;
}

.small a {
    color: #7a51ff;
}

#combatLog {
    background-color:black;
    color:white;
    margin-top:15px;
    border-style:solid; 
    border-width:4px;
    border-color: #7a51ff;
    font-family: "arial", sans-serif;
    font-size: 0.9em;
    text-align:left;
    width:90%
}

#loggedInAs {
    color:white;
    font-size:0.8em;
    padding:1em 0em 0em 1em;
}
.dropdown, .pills {
    text-transform: uppercase;
}

.dropdown .glyphicon, .dropdown .fa, .pills .fa, .pills .glyphicon{
    color: #7a51ff;
}

.pills.purplepills a{
    color:#555;
}

.pills.purplepills .active a{
    background-color:#000;
    color:#fff;
}

.pills.purplepills .active a:hover{
    background-color:#222;
}

.pills.purplepills .active a:focus{
    background-color:#000;
}





h1 {
    text-transform: uppercase;
    font-family:  "arial black", "arial", sans-serif;
    font-weight:900;
    letter-spacing: -0.07em;
}

h1 i {
    color:#7a51ff;
}

h2 {
    text-transform: uppercase;
    font-family: "rehooge", "arial black", "arial", sans-serif;
    letter-spacing: -0.01em;
    font-size: 3em;
    background-color:#000;
    color: #fff;
    padding-left: 0.2em;
    width:70%;
}

h3 {
    text-transform: uppercase;
}
.navbar-inverse .navbar-nav .open .dropdown-menu>li>a, 
.navbar-default .navbar-nav .open .dropdown-menu {
    color:#555;
  }

.label {
        font-family: "rehooge", "arial black", "arial", sans-serif;
}
.navbar-inverse .navbar-nav .open .dropdown-menu .locked a {
    color:#999;
}

.navbar-inverse .navbar-nav .open .dropdown-menu .unlocked a {
    color:#555;
}

.navbar-inverse {
    -webkit-box-shadow: 0 8px 6px -6px #000;
    -moz-box-shadow: 0 8px 6px -6px #000;
    box-shadow: 0 10px 40px -6px #000;
}

.label-power {
    background-color:#ff9000;
}

.label-speed {
    background-color:#002aff;
}

.label-endurance {
    background-color:#ff0000;
}

.label-luck {
    background-color:#00ff00;
}
.navbar-brand {
    padding:1.03em;
}

p {
    font-family: arial;
}

.lead {
    font-weight: bold;
    letter-spacing:-0.05em;
}

dt {
    text-transform: uppercase;
    font-size:1.6em;
    color:#555;
    line-height:1.3em;
}

dd {
    font-family: arial;
    font-size: 0.9em;
}

footer {
    text-align: center;
    vertical-align: center;
    background-color:#000;
    color:#fff;
}

footer .small {
    padding:1em 0em 0em 0em;
    font-family: "rehooge", "arial black", "arial", sans-serif;
    font-size:1.5em;
    display:inline;
}

footer .social{

}

.monster-left {
    padding-right:2em;
}
.monster-right {
    padding-left:2em;
}

footer .social i {
    font-size:1.5em;
}

#sidebar.affix-top {
    position: static;
    margin-top:30px;
    width:228px;
  }

#affix {
    position: fixed;
    top:170px;
  }

blockquote {
    font-family: arial;
    color:#555;
    font-style:italic;
    font-size:1.2em;
}
table {
    color:#444;
}

blockquote img {
    padding-top:1em;
}

#firecult {
    background-image: url(/img/encounters/orangeBG.jpg);
    height:6em;
}

#intothevoid {
    background-image: url(/img/encounters/eyesBG.jpg);
    height:6em;  
}

#deepestbluest {
    background-image: url(/img/encounters/blueBG.jpg);
    height:6em;  
}

#technophobia {
    background-image: url(/img/encounters/technoBG.jpg);
    height:6em;  
}

#greenmire {
    background-image: url(/img/encounters/greenBG.jpg);
    height:6em;  
}

#ghostlands {
    background-image: url(/img/encounters/ghostBG.jpg);
    height:6em;  
}

#necropolis {
    background-image: url(/img/encounters/necroBG.jpg);
    height:6em;  
}

#panopticon {
    background-image: url(/img/encounters/panBG.jpg);
    height:6em;  
}

#skyline {
    background-image: url(/img/encounters/skylineBG.jpg);
    height:6em;  
}

#theFamily {
    background-image: url(/img/encounters/theFamily.jpg);
    height:6em;  
}

#underworld {
    background-image: url(/img/encounters/undergroundBG.jpg);
    height:6em;  
}

#coronus {
    background-image: url(/img/encounters/coronusBG.jpg);
    height:6em;  
}

.list-group-item {
    font-family: arial, sans-serif;
}
.time {
    font-size:2em;
    background-color:#000;
    color:#fff;
    font-family: "rehooge";
    padding-left:0.3em;
    line-height:1.5em;
    text-align: center;
}

td .social{
    font-size:2em;
    background-color:#000;
    color:#fff;
    font-family: "rehooge";
    padding-left:0.3em;
    line-height:1.5em;
    letter-spacing:0.2em;
    text-align: center;
    text-shadow: 0px 0px #000;
}


.fa-twitter {
    color:#55ACEE;
}

.fa-facebook {
    color:ghostwhite;
}

#profile-img {
    width:100%
}

.btn-signin {
    background-color:#3f137b;
    text-transform: uppercase;
}
.btn-signin:hover {
     background-color:#000;
}
.btn-signin:active {
     background-color:#000;
}

.btn-signinfb {
    background-color:#3b5998;
    text-transform: uppercase;
}

.btn-signinfb:hover {
    background-color:#000;
}
.btn-signinfb:active {
    background-color:#3b5998;
}


td h3 {
    font-size:2em;
    text-shadow: 2px 2px #333;
    color:#fff;
    font-family: "rehooge", "arial black", "arial", sans-serif;
    width:99%;
    background-color: #000;
}

.fblogin {
    text-align: right;
}

#hs1 {
    padding-left:0.3em;
    line-height:1.5em;
    background-image: url(/img/encounters/orangeBG.jpg);
}

#hs2 {
    padding-left:0.3em;
    line-height:1.5em;
    background-image: url(/img/encounters/eyesBG.jpg);
}

#hs3 {
    padding-left:0.3em;
    line-height:1.5em;
    background-image: url(/img/encounters/blueBG.jpg);
}

#hs4 {
    padding-left:0.3em;
    line-height:1.5em;
    background-image: url(/img/encounters/technoBG.jpg);
}

#hs5 {
    padding-left:0.3em;
    line-height:1.5em;
    background-image: url(/img/encounters/greenBG.jpg);
}

#hs6 {
    padding-left:0.3em;
    line-height:1.5em;
    background-image: url(/img/encounters/ghostBG.jpg);
}

#hs7 {
    padding-left:0.3em;
    line-height:1.5em;
    background-image: url(/img/encounters/necroBG.jpg);
}

#hs8 {
    padding-left:0.3em;
    line-height:1.5em;
    background-image: url(/img/encounters/panBG.jpg);
}

#hs9 {
    padding-left:0.3em;
    line-height:1.5em;
    background-image: url(/img/encounters/skylineBG.jpg);
}

#hs10 {
    padding-left:0.3em;
    line-height:1.5em;
    background-image: url(/img/encounters/theFamily.jpg);
}

#hs11 {
    padding-left:0.3em;
    line-height:1.5em;
    background-image: url(/img/encounters/undergroundBG.jpg);
}

#hs12 {
    padding-left:0.3em;
    line-height:1.5em;
    background-image: url(/img/encounters/coronusBG.jpg);
}


.glyphicon-thumbs-up{
    color:green;
}

.glyphicon-thumbs-down{
    color:red;
}

.encounter {
    background-color:transparent;
    text-shadow: 2px 2px #333;
}

.acid {
      background-color:green; 
    font-size:2.3em;
}

.fire {
      background-color:darkorange; 
    font-size:2.3em;
}

.ice{
      background-color:deepskyblue; 
    font-size:2.3em;
}

.life {
      background-color:deeppink; 
    font-size:2.3em;
}

.lightning {
      background-color:rebeccapurple; 
    font-size:2.3em;
}

.plague {
    background-color:dimgrey; 
    color:darkseagreen;
    font-size:2.3em;
}


@media screen and ( max-width: 500px ) {
  h2 {
     font-size: 2em;
      width: 100%
  }
    
footer .small {
    padding:1em 0em 0em 0em;
    font-family: "rehooge", "arial black", "arial", sans-serif;
    font-size:1em;
    display:inline;
}
}