body
{
margin:0px;
padding:0px;


}
div
{margin:0px;
padding:0px;
text-align:center;}
header
{top:0px;
width:100%;
	position:sticky;
	Background-color: black;
	color: white;
	z-index:9999;
	
}
header h1
{margin:0px;
padding:20px;}

header li{
	display: inline-block;
}
header button
{Background-color: black;
position:relative;
	color: white;
	border: None; 
	cursor:pointer;
	font-size: 15px;
	padding:10px;
	min-width: 125px;
	box-shadow: 0 0px 0px 0 rgba(0, 0, 0, 0);
}
.dropdown-content
{  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 125px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;}
 .dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}

header button:hover
{Background-color: grey;
	
}
header li:hover .dropdown-content {
  display: block;
}

body{
background-color: #CDF4FB;
text-align: center;
margin:0px;
padding:0px;



}
#searchbox li
{display:block;
}
#menuButton
  {display:none;
  font-size: 20px;
  min-width: fit-content;
margin:0px;
padding:10px;
 
  }
  img
  {
	  max-width:100%;
  }
section
{display:flex;
 flex-wrap: wrap;}

#owned
{Background-color:#F5FFFF;opacity:0.9;
	width:30%;
position:relative;
	
	margin:1%;
	margin-top:2px;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.5), 0 6px 20px 0 rgba(0, 0, 0, 0.4);
border-radius: 5px;



}
#owned p
{border-style:solid;
margin-left:3px;
margin-right:3px;
min-height:12px;
max-height:20vh;
max-height:20svh;
	overflow-y:scroll;}
	.reset
	{Background-color:red;}
#selection
{Background-color:#F5FFFF;opacity:0.9;
	width:30%;
	
	margin:1%;
	margin-top:2px;
	text-align:center;
	vertical-align:center;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.5), 0 6px 20px 0 rgba(0, 0, 0, 0.4);
border-radius: 5px;

}
#usedFor
{
	Background-color:#F5FFFF;opacity:0.9;
	width:30%;
	
	margin:1%;
	margin-top:2px;
	text-align:center;
	vertical-align:center;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.5), 0 6px 20px 0 rgba(0, 0, 0, 0.4);
border-radius: 5px;
}

	
#used li{
	display:block;
}
a{
	cursor:pointer;
	
}
}

p
{text-align: center;
}
button
{
	Background-color:lime;
	cursor:pointer;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.5), 0 6px 20px 0 rgba(0, 0, 0, 0.4);
}
div button:hover
{
	box-shadow: 3px 3px;
}

.makeMonster
{
	width:100%;
	border: 1px solid black;
	
	
}
.makeMonster tr
{border: 1px solid black;



	
}
.makeMonster td
{text-align: center;
vertical-align:center;


border: 1px solid black;}

.arrow
{
	border: 1px solid black;
	
}
.arrow h1
{ margin:0px;
	border: 1px solid black;
	
	
	
	
}
ul
{margin:0px;
padding:0px;
  list-style-type: none;

 

	
}
li
{ 
	margin:1px;
padding:1px;
	display: inline-block;
	


}

#all
{
	display:flex;
	
	 padding-left:5%;
	 padding-Right:5%;
}

#all li
{text-wrap: wrap;
		border:solid;
		width:30%;
		padding-bottom:10px;
		padding-top:10px;
		background-color:white;
		
}

a:hover{
	text-decoration: underline;
	
	
}
#scrollTop
{
	position:fixed;
	font-size:25px;
	Background-color:orange;	
	bottom:15px;
	Right:15px;
	border-radius:50px;
}

#mainDiv
{
	background-color:#F5FFFF;
	box-shadow: 2px 2px 8px 8px  #aaaaaa;

	 
	
	width:80%;
	margin:auto;}
@media only screen and (min-width: 600px) {
	 #topBoxes div:hover
 {opacity:1;
}
	body
{

background-image:url("../images/pumpkin.jpg");
background-size:auto;
background-repeat::repeat-x;
background-repeat:repeat;

}
 #topBoxes
 {background-image:url("../images/top.jpg");
 background-repeat: no-repeat;
 
  background-position-y: bottom;
  
	 
 }
 #mainDiv
 {
	 box-shadow: 2px 2px 8px 8px  #aaaaaa;
 }
}


@media only screen and (max-width: 600px) {
	header h1
	{font-size:20px;}
	#owned{
		width:95%;
		margin-left:2.5%;
	}
	#selection
	{width:95%;
	margin-left:2.5%;}
	
	#usedFor
{
	width:95%;
	margin-left:2.5%;
}
  
  #menu{display: none;
	  
	  
	  
  }
  #menuButton
  {display:inline;
 position: absolute;
 left:0px;
  top:0px:

  }
  #menu li
  {display:block;}
  #mainDiv
  {margin-left:0px;
margin-right:0px;

	width:100%;
	padding:0px;
	box-shadow: 0px 0px 0px 0px;
	
	}
  
  .makeMonster
{margin-left:0px;
margin-right:0px;
width:100%;
	border: 1px solid black;
	
	
}
.list_rank
{display:none;}
  
}