body {
  background-color: #77283b;
  color:  #e474de;
  overflow:auto;
  font-family: "pixelite", "Tiny5", Verdana;
  font-weight: 400;
  font-style: normal;
  text-align:center;
  margin:0; 
  

}

@font-face {
  font-family: pixelite;
  src: url("/alagard.ttf?#iefix") format("truetype");
}


.crewlist div{
  margin:20px;
  padding-bottom:10px;
  border: 3px solid #ad6caa;
  }
  
  .fa-brands{
    margin:0 20px;
    }

h2{
  font-size:3em;  
  margin-top:10px;
  margin-bottom:0px;
}

h3{
  margin:0px;
  }

p{
 margin:1em 0.25em 1em 0.25em; 
 color:black;
}

img{
  margin-top:10px;
 width:20%;
 height:20%;
 border-radius:5px;
 margin-bottom:0px;
 
  }
  
footer{
   padding: 5px 0;
  background-color:#3b0b17;
    font-style:italic;
  }
  
  footer p {
       color: #e474de;
    }
  
footer a{
  color: #e474de;
  text-decoration:none;
  }

.navbar ul{
  list-style-type: none;
  margin: 0;
  padding: 5px 0;
  background-color:#3b0b17;
  overflow:hidden;
  font-size:2em;
  top:0;
}

.links{
  float:right;
  border-radius:5px;
  margin:0 1em;
  padding:0 0.3em;
  }
  
li a{
  text-decoration:none;
  color:  #e474de;
  }

li a:hover{
  color:#77283b;  
  }
  
.links:hover {
  background-color:  #e474de;
}

.crewlist a:visited{
  color: #fff;
  text-shadow: 1px 1px 1px #ccc;
  }

.crewlist a:link{
  color: #3ba8d4;
    text-shadow: 1px 1px 1px #ccc; 
}

.crewlist a:hover{
    color:#fa5eff;
    text-shadow: 1px 1px 1px #000;
}

@media (max-width: 650px) {

    
   .navbar ul{
   
    list-style-type: none;
    padding-right: 30px;
    padding-top: 5px;
    padding-bottom:5px;
    background-color:#3b0b17;
    overflow:hidden;
    font-size:1.5em;
    top:0;
  }
}