@media only screen and (max-width: 853px);


body {
  max-width:80vw;
  height:auto;
  margin:auto;
  background: url('/images/backgrounds/bkg3.jpg');
  background-color: black;
  cursor: url('images/MageHand.gif'), auto;
}
a:hover {
    cursor: url('images/MageHandClick.gif'), pointer;
}
h2 {
  font-size:2.5em;
    font-family: "Jacquard 24", system-ui;
     font-weight: 200;
}

.jacquard-24-regular {
  font-family: "Jacquard 24", system-ui;
  font-weight: 400;
  font-style: normal;
}


.banner {
  margin:auto;
   width:600px;
   height:auto;

    }
    
.banner img {
  width: 100%;
  height: 100%;
  object-fit: cover; 
}
    
.content {
  background:transparent;
  width:80vw;
  margin:10px;
  position:relative;
  
}
.nomargin {
  margin: 0;
  margin-top: 10px;
}
.main img {
  padding:3px;
  border:1px solid black;
   box-shadow: inset 3px 3px grey;

}

.main {
display: inline-block;
  background-color: yellowgreen;

  width:76%;
  height:auto;
   box-shadow: -6px 6px 2px 2px rgba(0, 0, 0, 0.4);
border-style: inset;
  border: 4px double #666666;
}

.nav {
display: inline-block;
  width:150px;
}
audio {
  display: none;
}

.button:hover img{
  transform:scale(1.1);
}



footer {
margin-top:50px;
margin-left:auto;
margin-right:auto;
width:85%;
  background:#ccc;
  height:auto;
    border: 3px double #666666;
    box-shadow: 2px 2px #666666;
    
}
ul {

  display: inline-block;
  list-style-type: none; /* Removes default bullet points */
  padding: 0;            /* Removes default padding */
  margin: 0;             /* Removes default margin */
  position: relative;
  bottom: 1100px;
  
}
  
  li { padding:0;}