.body p{
	font-family:Arial, Helvetica, sans-serif;
	font-weight:normal;
	font-size:12pt;
}

#home p{
	font-size:14pt;
	font-family:Arial, Helvetica, sans-serif;
}
body h1{
	font-family:Arial, Helvetica, sans-serif;
	font-weight:normal;
	font-size:12pt;
}
body h2{
	font-family:Arial, Helvetica, sans-serif;
	font-weight:normal;
	font-size:14pt;
	color:#000;
}
#home h2{
	text-align:center;
}

body h3{
	font-family:Arial, Helvetica, sans-serif;
	font-weight:normal;
	font-size:12pt;
	color:#000;
	display:inline;
}

body h4{
	font-family:Arial, Helvetica, sans-serif;
	font-weight:bold;
	font-size:12pt;
	color:#000;
	display:inline;
}
body h5{
	font-family:Arial, Helvetica, sans-serif;
	font-weight:normal;
	font-size:14pt;
	color:#fff;
	text-align:center;
}
body h6{
	font-family:Arial, Helvetica, sans-serif;
	font-weight:normal;
	font-size:10pt;
	color:#000;
	font-weight:bold;
	display:inline;
}
body h7{
	font-family:Arial, Helvetica, sans-serif;
	font-weight:normal;
	font-size:10pt;
	color:#000;
	display:inline;
}
#admin .main{
	width:100%; 
	margin:auto;
	position:relative; 
	margin-top:100px;
	display:block;
}
#overallcontainer{
	position:relative;
	min-height:100vh;
}
.gridContainer {
	margin-left: auto;
	margin-right: auto;
	width:100%;
	display:flex;
	flex-direction:row;
	flex-wrap:wrap;
	flex-flow:column-wrap;
	justify-content:center;
}
#LayoutDiv1 {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#header{
	height:auto;
	width:100%;
	top:0;
	z-index:1;
	position:relative;
	margin-bottom:-2px;
}
#header img{
	width:100%;
	display:cover;
}
#header{
	display:none;
}
#mobileheader{
	display:block;
}
#mobileheader img{
	width:100%;
	display:cover;
}
@media only screen and (min-width: 769px) {
	#header{
		display:block;
	}
	#mobileheader{
		display:none;
	}
}

#header h1{

}
.mobilelinks{
	display:block;
	margin-top:5px;
	width:98%;
	margin:auto;
	margin-top:5px;
	margin-bottom:1px;
	display:flex;
	flex-wrap:wrap;
	flex-direction:row;
	justify-content:center;

}
@media only screen and (min-width: 769px) {
	.mobilelinks{
	display:none;
}
}
.desktopdropdown{
	display:none;
}
@media only screen and (min-width: 769px) {		
.desktopdropdown{
	display:block;
	width:;
	display:flex;
	flex-direction:row;
	justify-content:center;
}
}
#desktoplinks {
	display:none;
	
}
@media only screen and (min-width: 769px) {		
#desktoplinks{
	display:block;
	background-color:;
	z-index:2;
	position:absolute;
	right:0;
	top:0;
	margin-right:20px;
	float:right;
	width:100%;
}

#desktoplinks li{
	display: inline;
	padding-left: 6px;
	padding-right: 6px;
	padding-bottom: 3px;
	margin:10px;
	margin-top:0px;
	float:right;
}

#desktoplinks a{
	text-decoration: none;
	font-family: Arial, Helvetica, sans-serif;
	font-size:12pt;
	color: rgba(255,255,255,1);

}
#desktoplinks a:hover{
	opacity:.8;
}
}
.sidebar{
	width:100%;
	background-color:rgba(204,204,204,1);
	position:relative;
	padding-bottom:5px;
}
.sidebar #arrow{
	margin:auto;
}
.sidebar form{
	margin:auto;
}
.dropbtn {
  background-color: #333;
  color: white;
  padding: 8px;
  font-size: 16px;
  border: none;
  cursor: pointer;
  width:100%;
}

.dropdown {
  position: relative;
  display: inline-block;
  width:100%;
  margin-top:10px;
  font-family:font-family:Arial, Helvetica, sans-serif;
  clear:both;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width:100%;
  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;
  text-align:center;
  border-bottom: rgba(204,204,204,.6) solid thin;
  font-family:Arial, Helvetica, sans-serif;
}

.dropdown-content a:hover {background-color: #f1f1f1}

.dropdown:hover .dropdown-content {
  display: block;
  visibility:visible;

}

.dropdown:hover .dropbtn {
  background-color: #333;
}

.searchbar{
	width:100%;
	margin:5px;
}
.sidebar input{
	margin:auto;
	text-align:center;
	
	
}
.sidebar input#searchbtn{
	margin:auto;
}
 @media only screen and (min-width: 769px) {
	.sidebar input{
	margin:auto;
}
.sidebar input#searchbtn{
	margin:auto;
}
}
#legend{
	margin:auto;
	width:80%;
	text-align:cetner;
	background-color:;
	height:40px;
	margin-left:5%;
}

.main{
	height:auto;
	width:100%;
	display:flex;
	flex-direction:row;
	flex-wrap:wrap;
	margin-top:50px;
	position:relative;
	clear:both;
}
  @media only screen and (min-width: 769px) {
	  .main{
		  width:80%;
		  margin:auto;
	  }
  }
.main h1{
	text-align:center;
}
.main h2{
	font-weight:bold;
	text-align:left;
}
.main p{
	font-size:14pt;
}

#body1{
	width:90%;
	margin:auto;	
}
.body2{

	
}
#about, #about3{
	width:100%;
	margin:auto;
}
#about2{
	display:flex;
	flex-direction:row;
	flex-wrap:wrap;
	justify-content:center;
	margin:auto;
	background-color:rgba(0,0,102,1);
	height:100%;
}
#about3{
	margin-top:20px;
}

#p1, #p2, #p3{
	width:auto;
	margin-bottom:5px;
	color:#fff;
}
#p1, #p2{
	border-right:none;
	border-bottom:#fff solid thick;
}

  @media only screen and (min-width:1056px) {
	  #p1, #p2, #p3{
		  width:32.9%;
	  }
	  #p1, #p2{
		 border-right:#fff solid thick; 
		 border-bottom:none;
	  }
}

 #p1 p, #p2 p, #p3 p{
	padding:10px;
}


input{
	height:5%;
	border:1px;
	border-radius:05px;
	padding:8px 15px 8px 15px;
	margin:10px 0px 15px 0px;
	box-shadow:1px 1px 2px 1px grey;
}

#info{
	margin:auto;
	width:100%;
	text-align:center;
	position:relative;
	display:block;
	clear:both;
	margin-bottom:85px;
	padding:10px;
	border-top: rgba(51,51,51,1) solid thick;


}
#info table{
	padding-left:5px;
	padding-right:5px;
}
#info h1{
}

#button1{
	background-color: rgba(0,0,102,1);
}
#button2{
	background-color: rgba(154,202,207,1);
}
#button2:hover{
	color:#000;
}
#button3{
	background:linear-gradient(90deg, rgba(0,0,102,1) 0%, rgba(0,0,102,1) 12%, rgba(192,192,192,1) 12%, rgba(192,192,192,1) 100%);
}
@media only screen and (min-width: 769px) {
	 #button3{
	background:linear-gradient(90deg, rgba(0,0,102,1) 0%, rgba(0,0,102,1) 5%, rgba(192,192,192,1) 5%, rgba(192,192,192,1) 100%);
}
  }
#button4{
	background-color: rgba(0,153,204,1);
}
#button5{
	background-color:rgba(192,192,192,1);
}
.loader{
	position:fixed;
	top:0;
	left:0;
	width:100vw;
	height:100vw;
	display:flex;
	justify-content:center;
	align-items:center;
	background-color:rgba(204,204,204,1);
	transition:opacity 0.75s, visibility 0.75s;
}

.loader-hidden{
	opacity:0;
	visibilty:hidden;
}

.loader-after{
	content:"";
	width:75px;
	height:75px;
	border: 15px solid rgba(51,204,255,1);
	border-top-color:rgba(0,51,153,1);
	border-radius:50%;
	animation: loading .75s ease infinite;
}

@keyframes loading{
	from{
		trasform:rotate (0turn);
	}
	to{
		transform: rotate(1turn);
	}
}



#bginfo{
	width:100%;
	text-align:center;
	position:relative;
	display:block;
	background-color:rgba(204,204,204,1);
	margin-bottom:25px;
}
#bginfo table{
	margin:auto;
	border-collapse:collapse;
}

#bginfo tr{
}
#bginfo td{
	border:black thin solid;
	padding:8px;
	padding-top:6px;
	padding-bottom:6px;
	margin:5px;
	text-align:center;
}

.main table{
	width:100%;
}
.collapsible {
  background-color:#fff;
  cursor: pointer;
  padding-bottom:5px;
  width:100%;
  outline: none;
  height:45px;
  border:none;
  margin:2px;
}

 @media only screen and (min-width: 769px) {
	 .collapsible {
		  background-color:#fff;
		  cursor: pointer;
		  padding-bottom:5px;
		  width:95%;
		  outline: none;
		  height:45px;
		  border:none;
		  margin:2px;
}
	 

 }
.active, .collapsible:hover{
  background-color:#333;
  color:white;
}
#bginfo #content.content{
	width:80%;
}
  @media only screen and (min-width: 769px) {
	#bginfo #content.content{
	width:75%;
}
}
.main .content{
	width:90%;
	margin:auto;

}

.content {
  padding: 0 5px;
  display:none;
  overflow: scroll;
  margin:auto;
}
  @media only screen and (min-width: 769px) {
  .content {
    overflow: hidden;
}
}

.coincontent table{
	margin-left:2.5%; 
	width:95%; 
	height:auto; 
	background-color:rgba(219,219,219,1);
	margin-bottom:5px;
}
.coincontent h2{
	text-align:center;
}
.coincontent p{
	text-align:center;
	margin-top:-10px;
	font-family:Arial, Helvetica, sans-serif;
}
.coincontent td{
	width:100%;
	margin:auto;
	vertical-align:bottom;

}

.coincontent tr{
	display:flex; 
	flex-direction:row; 
	justify-content:center; 
	text-align:center;
	width:100%;
}
.description{
	text-align:center;
	margin-bottom:0;
	word-break:break-word;
}
#coinset{
	border-bottom: medium solid rgba(102,102,102,1);
	width:95%; 
	margin-left:2.5%;
	height:auto;
	margin-bottom:5px;
	display:none;
}

#coinsetmobile{
	display:block;
	border-bottom: medium solid rgba(102,102,102,1);
	width:95%; 
	margin-left:2.5%;
	height:auto;
	margin-bottom:5px;
}
#coinsetmobile table{
	margin-left:2.5%; 
	width:95%; 
	height:auto; 
}

#coinsetmobile table tr{
	display:flex; 
	flex-direction:row; 
	justify-content:center; 
	text-align:center;
	width:100%;
}
#coinsetmobile table td{
	padding-left:12px;
	padding-right:12px;
}

#coinsetmobile table td h1{
	display:inline;
}
@media only screen and (min-width: 769px) {
  #coinset{
	border-bottom: medium solid rgba(102,102,102,1);
	width:95%; 
	margin-left:2.5%;
	height:auto;
	margin-bottom:5px;
	display:block;
}

#coinsetmobile{
	display:none;
}
}
#coinset table{
	margin-left:2.5%; 
	width:95%; 
	height:auto; 
}

#coinset table tr{
	display:flex; 
	flex-direction:row; 
	justify-content:space-between; 
	text-align:center;
	width:100%;
}
#coinset table td{
	padding-left:12px;
	padding-right:12px;
}

#coinset table td h1{
	display:inline;
}

#arrow {
  box-sizing: border-box;
  height:15px;
  width:15px;
  border-style: solid;
 border-width: 0px 1.5px 1.5px 0px;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  margin-left:5px;
  padding:2px;
  margin-top:2px;
  margin-bottom:-12px;
 }
#arrow:hover{
	color:rgba(154, 202, 207, 1);
}
.active #arrow{
	color:white;
}

#arrow2 {
  box-sizing: border-box;
  height:15px;
  width:15px;
  border-style:solid;
  border-color:white;
 border-width: 0px 1.5px 1.5px 0px;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  margin-left:4px;
  padding:6px;
  margin-top:8px;
 }
 #arrow2:hover{
	color:rgba(154, 202, 207, 1);
}
.active #arrow2{
	color:rgba(154, 202, 207, 1);
}

#arrow3{
  box-sizing: border-box;
  height:15px;
  width:15px;
  border-style:solid;
  border-color:white;
 border-width: 0px 1.5px 1.5px 0px;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  margin-left:4px;
  display:inline;
  float:left;
  margin:8px;
 } 
#arrow3:hover{
	color:rgba(154, 202, 207, 1);
}
.active #arrow3{
	color:rgba(154, 202, 207, 1);
}


.show {display: block;}

#obtained{
  width: 14px;
  height: 18px;
  background-color: rgba(0,0,102,1);
  margin-right:3px;
  float:left;
  margin-top:-2px;
  display:inline-block;
}
@media only screen and (min-width: 769px) {
	 #obtained{
		 margin-left:;
	 }
  }

#coins .main{
	width:95%;
	margin:auto;
}
  @media only screen and (min-width: 769px) {
	 #coins .main{
		width:70%;  
	 }
  }

 @media only screen and (min-width: 769px) {
	 .description {
	 margin-top:-5px;  
	 }
 }
tr.desktopversion{
	display:none;
}
tr.mobileversion{
	display:flex;
}

 @media only screen and (min-width: 769px) {
	tr.desktopversion{
		display:flex; 
	 }
	 tr.mobileversion {
		 display:none;
	 }
  }

/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index:18; /* Sit on top */
  padding-top:2%; /* Location of the box */
  left: 0;
  top:2.2%;
  width:95%; /* Full width */
  height:92%; /* Full height */
  overflow: hidden; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.9); /* Black w/ opacity */
  margin-left:2.5%;
}
.img:hover{
	opacity:.8;
}
/* Modal Content (image) */
.modal-content {
  margin: auto;
  display:block;
  max-width:98%;
  height:auto;
  max-height:95%;
  margin-top:12px;
}

a:active{
	color: #999;
}
/* Add Animation */
.modal-content{  
  -webkit-animation-name: zoom;
  -webkit-animation-duration: 0.6s;
  animation-name: zoom;
  animation-duration: 0.6s;
}

@-webkit-keyframes zoom {
  from {-webkit-transform:scale(0)} 
  to {-webkit-transform:scale(1)}
}

@keyframes zoom {
  from {transform:scale(0)} 
  to {transform:scale(1)}
}

/* The Close Button */
.close {
  position: absolute;
  top:8px;
  right:20px;
  color: #f1f1f1;
  font-size: 40px;
  font-weight: bold;
  transition: 0.3s;
}

.close:hover,
.close:focus {
  color: #bbb;
  text-decoration: none;
  cursor: pointer;
}
#footer{
	bottom:0px;
	background-color:#fff;
	position:absolute;
	width:100%;

}
#footer ul{
	margin:auto;
	background-color:rgba(204,204,204,1);
	height:20px;
	padding-top:10px;
	padding-bottom:10px;
	text-align:center;
	padding-left:0px;
	padding-right:0px;
}
#footer p{
	font-family:Arial, Helvetica, sans-serif;
	font-weight:normal;
	font-size:12pt;
}

#footer a{
	color:black;
	text-decoration:none;
}
#footer a:hover{
	opacity:.8;
}
#footer img{
	width:100%;
	min-height:20px;
	bottom:0px;
	margin-top:2px;
}

  @media only screen and (min-width: 769px) {
	#footer img{
	height:auto;
	bottom:0px;
	margin-top:2px;
	}
}

input[type=checkbox]
{
	-webkit-appearance:checkbox;
	height:auto;
	width:auto;
	box-shadow:none;

	
}