body
	{
	background-color: black;
	font-family: "century gothic"; "helvetica"; "verdana";
	margin-left: 0;
	margin-top: 20;
	}

	h1
	{
	font-family: "century gothic"; "helvetica"; "verdana";
	font-size: 50px;
	color: #C0C0C0;
	}

	h2
	{
	font-family: "century gothic"; "helvetica"; "verdana";
	font-size: 20px;
	color: #C0C0C0;
	}

	p
	{
	font-family: "century gothic"; "helvetica"; "verdana";
	font-size: 14px;
	font-weight: bold;
	color: #C0C0C0;
	}

	.body
	{
	font-family: "century gothic"; "helvetica"; "verdana";
	font-size: 14px;
	font-weight: bold;
	color: #C0C0C0;
	}

	.date
	{
	font-family: "century gothic"; "helvetica"; "verdana";
	font-size: 14px;
	color: #C0C0C0;
	font-weight: bold;
	}

	.footer
	{
	font-family: "century gothic"; "helvetica"; "verdana";
	font-size: 10px;
	color: #C0C0C0;
	}

	a:link
	{
	background-color: transparent;
	font-family: "century gothic"; "helvetica"; "verdana";
	font-size: 14px;
	color: #C0C0C0;
	text-decoration: none;
	font-weight: bold;
	border: none;
	}

	a:visited
	{
	background-color: transparent;
	font-family: "century gothic"; "helvetica"; "verdana";
	font-size: 14px;
	color: #C0C0C0;
	text-decoration: none;
	font-weight: none;
	border: none;
	}

	a:hover
	{
	background-color: transparent;
	font-family: "century gothic"; "helvetica"; "verdana";
	font-size: 14px;
	color: #C0C0C0;
	text-decoration: underline;
	font-weight: bold;
	border: none;
	}

	a:active
	{
	background-color: transparent;
	font-family: "century gothic"; "helvetica"; "verdana";
	font-size: 14px;
	color: #C0C0C0;
	text-decoration: none;
	font-weight: none;
	border: none;
	}

	style3
	{
	font-family: "century gothic"; "helvetica"; "verdana";
	font-size: 14px;
	font-weight: bold;
	color: #C0C0C0;
	}
	
	img
	{
	border: none;
	}

	
/* Oct 2019 This bit of code is from https://daveismyname.blog/creating-an-image-gallery-from-a-folder-of-images-automatically */

	li{
	list-style-type:none;
	margin-right:10px;
	margin-bottom:10px;
	float:left;
}

/* the following code is from Code Boxx - I couldn't get it to work but I've left it in in case I try again some time, so I only need the one .css file */
/* [GALLERY] */
#gallery {
  max-width: 1200px;
  margin: 0 auto;
}

#gallery img {
  box-sizing: border-box;
  width: 25%;
  max-height: 150px;
  padding: 5px;
  /* fill, contain, cover, scale-down : use whichever you like */
  object-fit: cover;
  cursor: pointer;
}

/* [RESPONSIVE GALLERY] */
@media screen and (max-width: 850px) {
  #gallery img {
    width: 33%;
  }
}

@media screen and (max-width: 640px) {
  #gallery img {
    width: 50%;
  }
}

/* [LIGHTBOX] */
#lfront, #lback {
  position: fixed;
  opacity: 0;
  visibility: hidden;
  transition: all 0.5s;
  width: 100%;
}

#lfront img {
  max-width: 100%;
  max-height: 100%;
  margin: 0 auto;
  display: block;
}

#lback {
  height: 100vh;
  background: #000;
}

#lfront.show {
  z-index: 1000;
  opacity: 1;
  visibility: visible;
}

#lback.show {
  z-index: 999;
  opacity: 0.8;
  visibility: visible;
}