
body {
  background-color: #000;
  font-family: 'Georgia', sans-serif;
  color: #f0e6c9;
  
}

ul {
  list-style-type:none;
  margin:0;
  padding:0;
  background-color:grey;
  
}

li {
  float:left;
}

a {
color: #c7101c;
}
a:hover{
text-shadow: 0px 0px 3px #c7101c;
}

p1 {
  background-color: #260713;
  color: #170d29;
  position: relative;
  max-width:900px;
  padding: 20px;
  border-top: 2px solid #701208;
  border-left: 2px solid #701208;
  border-right: 2px solid #701208;
}

p {
  background-image: linear-gradient(to right, #210502, #1a0502);
  color:#f0e6c9;
  position: relative;
  max-width:900px;
  padding: 20px;
  border: 2px solid #701208;
  float: left;
  }
  
#container{
display: flex;
justify-content: center;
align-items: center;
margin-left: 100px;
margin-right: 100px;
border: 3px solid #701208;
padding: 3px;
background-image: linear-gradient(#260713,#170d29,#0a224a);
}


#header{
border-top: 2px solid #701208;
border-bottom: 2px solid #701208;
letter-spacing: 2px;
margin-top:30px;
}



#header h1{
  text-align: center;
  background-image: linear-gradient(to right, #210502, #1a0502);
  padding:5px;
}

#nav{

display: flex;
justify-content: center;
margin-top: 40px;
margin-left: 100px;
text-align: left;
width:500px;

}



#main{
  text-align: left;
  margin:0px;
}


#imageContainer{
display: flex;
justify-content: center;
align-items: center;
margin-top: 40px;
padding: 3px;
text-align: center;
object-fit: contain;
}




/* width */
::-webkit-scrollbar {
  width: 10px;
}

/* Track */
::-webkit-scrollbar-track {
  background: #210502; 
}
 
/* Handle */
::-webkit-scrollbar-thumb {
  background: #c7101c; 
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #0a224a; 
}
