body {
		background-image: url('images/flag_bkg.png');
				background-size: 100%;
/* background-attachment: fixed; */
		font-size: 16px;
		}
	

		#home {
			height: document.body.scrollHeight;
		}
		

	#grad	{
			background: linear-gradient(to bottom right, #151b54, #1569c7, #00008b, #1589ff, #0020c2, #151b54) fixed;
		}
		
	.center	{
		display:block;
		width:100vw;
		margin: auto;
		text-align:center;
		background-size: cover;
		}

#main {
      display:block;
	      position: relative;
	      height: 100%;
    }
		
	#sub {
	  display:none;
	}
	
	#newimg {
	  display:inline-block;
	}
	
	#side	{
		display:none;
//		width:98vw;
		}


#planetdiv {
	 height: 100%;
	 position:relative;
}

#planet {
	 width: 6vw;
	 max-width: 100px;
	 height: auto;
	 position:absolute;
	 display: none;
	 top:75vh;
	 left:5vw;
	 z-index: 4;
}

#voy {
	 width: 14vw;
	 max-width: 300px;
	 height: auto;
	 position:absolute;
	 top:50vh;
	 left:0vw;
	z-index: 1;
	display:none;
}

#capsule {
	 width: 34vw;
	 max-width: 300px;
	 height: auto;
	 position:absolute;
	 top:0vh;
	 left:20vw;
	 display: none;
	 z-index: -2;
}

#stage {
	 width: 6vw;
	 max-width: 300px;
	 height: auto;
	position:absolute;
	 top:60vh;
	 left:5vw;
	 display: none;
		 z-index: 2;
}

#land {
	 width: 15vw;
	 max-width: 300px;
	 height: auto;
	 position:absolute;
	 top:0;
	 right:4vw;
		z-index: 8;
	 display: none;
}


#legs {
	 width: 15vw;
	 max-width: 300px;
	 height: auto;
	 position:absolute;
 	top: 89.6vh;
	 right:4vw;
	z-index: 10;
	 display: none;
}

#footer {
	position:fixed;
	left: 0;
	bottom: 0dvh;
/*	 z-index: 5;  */
	width: 100vw;
	height:auto;
	margin: auto;
	background-color: #57005f;
	background-image: none;
	color: white;
	text-align: center;
	display: block;
/* 	vertical-align: bottom; */
	}

#moonsurf {
	position:fixed;
	left: 0;
	bottom: -0.50dvh;
	width: 100vw;
	/* z-index: ;  */
	object-fit: cover;
height: auto;
	margin: auto;
	background-color: #88888800;
	background-image: none;
	color: white;
	text-align: center;
/* 	vertical-align: bottom; */
display: none;
	}

#mimg {
	 opacity: 1.0;
}
		
	img, div {
	    box-sizing:border-box;
  		}
	
	.p1 {
		font-weight: bold;
		font-size: 24px;
		font-family: Verdana, Tahoma, sans-serif;
		color: FireBrick;
		}
	.p2 {
		font-weight: bold;
		font-size: 16px;
		font-family: Verdana, Tahoma, sans-serif;
		color: #555555;
		text-align: right;
		vertical-align: bottom;
		line-height: 20px;
		}
	.p3 {
		font-weight: bold;
		font-size:2.5em ;
		font-family: Verdana, Tahoma, sans-serif;
		color: #b92222;
		text-shadow: 3px 3px 5px DimGrey;
		line-height: 1.0em;
		}

	.p3main {
		font-weight: bolder;
		font-size: 3.0em;
		font-family: Verdana, Tahoma, sans-serif;
		color: #b92222;
		text-shadow: 4px 4px 7px MediumBlue, 6px 6px 10px #addfff;
		line-height: 1.5em;
//		margin: 6.0em 0 6.0em 0;
		}


	.p3a {
		font-weight: bolder;
		font-size: 2.2em;
		font-family: Verdana, Tahoma, sans-serif;
		color: #aa1111;
		text-shadow: 2px 2px 3px #ffbf00, 6px 6px 10px #ffe87c;
		line-height:2.6em;
		}
				
	.p4 {
		font-weight: 900;
		font-size: 16px;
		font-family: Verdana, Tahoma, sans-serif;
		color: #444444;
		text-align: center;
		vertical-align: middle;
		line-height: 1.5rem;
		}
		
	.p5 {
		font-weight: bold;
		font-size: 38px;
		font-family: Verdana, Tahoma, sans-serif;
		color: FireBrick;
		text-shadow: 3px 3px 5px DimGrey;	
}

.p5a {
	font-weight: bold;
	font-size: 2.1em;
	line-height:1.4em;
	font-family: Verdana, Tahoma, sans-serif;
	color: #af0b0b;
	text-shadow: 2px 2px 3px #887700;	
}

.p5c {
	font-weight: 400;
	font-size: 1.6em;
	font-family: Verdana, Tahoma, sans-serif;
	color: #ffffff;
	text-shadow:1px 1px red, 0px 0px 15px #f433ff;
	}


.p5b {
	font-weight: bolder;
	font-size: 2.3em;
	font-family: Verdana, Tahoma, sans-serif;
	color: #d52525;
	text-shadow: 3px 3px 6px #000000, 4px 4px 10px #888888;	
	line-height: 1.6em;
}

	.top{
		font-weight: bold;
		font-size: 26px;
		font-family: Verdana, Tahoma, sans-serif;
		color: navy;
		background-color: LightGrey;
		text-align: center;
		vertical-align: middle;
		line-height: 34px;
		text-decoration: none;
	}
	ul {
		font-size: 20px;
		font-family: Verdana, Tahoma, sans-serif;
	}

	.gallery {
		border: 5px Silver ridge;
		max-width: 100%;
	}

	.divrule {
		height:9px;
		width:100%;
		border: 3px ridge #440000;
		background-color:#dd0000;
		box-shadow: 2px 2px 5px #da1884, 6px 6px 12px #333333;
//	border-style:ridge;
//	border-width:3px;
	}

	.vid {
		border:6px ridge #881177;
		box-shadow:2px 2px 10px 5px #999999;
		background-color:black;
		display:inline-block;
		margin:auto;
		max-width:95vw;
	}

	.vid1 {
		border:6px ridge #0000a5;
		box-shadow:5px 5px 10px #1589ff, 0 0 35px #82caff;
		background-color:black;
		display:inline-block;
		margin:auto;
		width:90vw;
		max-width:800px;
		height: auto;
		object-fit: contain;
		z-index: 3;
	}


	.picborder {
	max-width:40vw;
		max-height:40vw;
		object-fit:cover;
	    border:6px ridge #881177;
	    box-shadow:2px 2px 10px 5px #999999;
	}

	.picborder1 {
		width:35vw;
		height:35vw;
		max-width:200px;
		max-height:200px;
		object-fit:cover;
		text-align:center;
 		border:6px ridge #0000a5;
	    box-shadow:5px 5px 10px #1589ff, 0 0 35px #82caff;
	}
	
	.viewer_p	{
//		width:100%;
		text-align:center;
		border:6px ridge red;
		color:Yellow;
		font-weight:bolder;
		font-size:2.0em;
		font-family: Verdana, Tahoma, sans-serif;
	}


	.ctr {
		max-width:100%;
	}

	.knac {
		max-width:40vw;
		height: auto;
		margin: 30px 0 20px 0;
//	padding: 20px 0;
		box-shadow:7px 7px 5px FireBrick;
		display:inline-block;
		box-sizing:border-box;
//	margin:30px 0;
	}

.flex-cont {
	display: flex;
	flex-direction:row;
	flex-wrap: wrap;
	justify-content: center;
	align-items:center;
	row-gap:50px;
	column-gap:31px;
}

.flex-col {
	display: flex;
	flex-direction:column;
	flex-wrap: wrap;
	row-gap: 30px;
	justify-content: center;
 	align-items:center;
}

.flex-fam {
	display: flex;
	flex-direction:row;
	flex-wrap: wrap;
	gap: 25px 25px;
	justify-content: space-around;
 	align-items:space-between;
 	padding:30px 0;
}

.flex-rnd {
	display: flex;
	flex-direction:row;
	flex-wrap: wrap;
	gap: 25px 25px;
	justify-content: center;
 	align-items:center;
// 	padding:30px 0;
}

.flex-rnd img	{
	border:5px ridge #ffef00;
	border-radius:6px;
	width:25vw;
	height:25vw;
	max-width:300px;
	max-height:300px;
//	margin:20px;
//	padding:0 20px;
	object-fit:cover;
	text-align:center;
	box-shadow:3px 3px 20px 1px Red;
}

.flex-fam > img	{
	border:4px ridge #ffef00;
	border-radius:5px;
	width:25vw;
	height:25vw;
	max-width:300px;
	max-height:300px;
//	margin:20px;
//	padding:0 20px;
	object-fit:cover;
	text-align:center;
	box-shadow:6px 6px 7px DarkRed;
}

.flex-col > div{
//	width:100%;
//	height:8vh;
	text-align:center;
	vertical-align:middle;
//	border:3px solid white;
}

img.flex-cont {
	border:6px ridge #881177;
	border-radius:3px;
	width:35vw;
	height:35vw;
	max-width: 300px;
	max-height: 300px;
	object-fit:cover;
	text-align:center;
	box-shadow:6px 6px 7px #444444;
}

.toplink {
	font-weight: bolder;
	font-size: 1.3em;
	font-family: Verdana, Tahoma, sans-serif;
	color: navy;
	background-color: LightGray;
	text-align: center;
	vertical-align: middle;
	width: 120px;
	height: auto;
	text-decoration: none;
	padding: 5px 0 5px 0;
	margin:auto;
	border: 4px ridge crimson;
	border-radius:15px;
	display:inline-block;
	cursor:pointer;
	box-shadow: 2px 1px 20px #00bbff, 6px 3px 20px #006699, 12px 9px 20px #000066;
	}
	
.toplink:active {
	font-weight: bolder;
	font-size: 1.3em;
	font-family: Verdana, Tahoma, sans-serif;
	color: red;
	background-color: LightSlateGray;
	text-align: center;
	vertical-align: middle;
	width: 120px;
	height: auto;
	text-decoration: none;
    transform: translate(6px, 6px);
	padding: 5px 0 5px 0;
	margin:auto;
	border: 4px ridge crimson;
	border-radius:15px;
	display:inline-block;
	cursor:pointer;
	box-shadow: 2px 1px 20px #ffff00, 6px 3px 20px #999900, 12px 9px 20px #333300;
	}
	
.main_butt {
	font-weight: bolder;
	font-size: 1.3em;
	font-family: Verdana, Tahoma, sans-serif;
	color: navy;
	background-color: LightGray;
	text-align: center;
	vertical-align: middle;
	width: 50vw;
	height: auto;
	line-height:1.7em;
	text-decoration: none;
//	padding: 15px 0 15px 0;
// 	margin:20px 0 20px 0;
	border: 6px ridge crimson;
	border-radius:15px;
	display:inline-block;
	cursor:pointer;
	box-shadow: 2px 1px 20px yellow, 6px 3px 20px gold, 10px 6px 20px DarkGoldenRod;
	}
	
.main_butt:active {
	color: red;
	background-color: LightSlateGray;
	transform: translate(6px, 6px);
	box-shadow: 2px 1px 20px #ffff00, 6px 3px 20px #999900, 12px 9px 20px #333300;
	}
	
.butt_2	{
	width:auto;
	font-weight:bold; 
	font-size:1.2em;
	padding:5px 20px;
	border:3px ridge crimson;
	font-family: Verdana, Tahoma, sans-serif;
	color: #ffef00;
	background-color: #000080;
	text-align: center;
	vertical-align: middle;
	height: auto;
	text-decoration: none;
	border-radius:15px;
	display:inline-block;
	cursor:pointer;
	}
	
.butt_2:active	{
	color:#ff1493;
	background-color:#82caff;
	transform: translate(6px, 6px);
	}
	
.playme {
	font-weight: bolder;
	font-size: 1.0em;
	font-family: Verdana, Tahoma, sans-serif;
	color: #f433ff;
	background-color: #560319;
	text-align: center;
	vertical-align: middle;
	width: 100px;
	height: auto;
	text-decoration: none;
	padding: 5px 5px;
	margin:0 10px;
	border: 4px ridge #ffbf00;
	border-radius:5px;
//	display:inline-block;
	cursor:pointer;
	box-shadow: 2px 1px 20px #00bbff, 6px 3px 20px #006699, 12px 9px 20px #000066;
	}
	
.playme:active {
  	transform: translate(6px, 6px);
    background-color: #f433ff;
	color: #560319;
	box-shadow: 2px 1px 20px #000066, 6px 3px 20px #006699, 12px 9px 20px #00bbff;
}   
    
/*
.footer {
	position:fixed;
	left: 0;
	bottom: 0;
	width: 100vw;
//	height:6.0vh;
	margin:0 0 0 0;
	background-color: #ff007f4f;
	
	
	color: white;
	text-align: center;
vertical-align: bottom;
	}
*/

.footer-img {
	max-height:45px;
	padding: 10px 0;
	width:auto;
	border-style:none;
	}

.bigpic {
	max-width:90vw;
	height:auto;
	padding-top:20px;
	}
	
.fb	{
	width: 12vw;
	max-width:125px;
	height:auto; 
	object-fit:contain;
	}

#fbAni	{
	width: 10vw;
	max-width:125px;
	height:auto; 
	object-fit:contain;
 position:absolute;
left:0;
bottom:1vh;
	}
	
.v_space	{
	display:inline-block;
	height:5vh;
	width:100%;
	text-align:center
	vertical-align:middle;
	}
	
.fbdiv	{
	width:100%;
	text-align:center; 
	padding-top:1vh;
	}
		
#fbdivM {
	position:relative;
	width:100%;
	text-align:center; 
	padding-top:1vh;
	}
		
	/*

@media only screen and (max-width: 444px) {
	
	.body {
		font-size:8px;
	}
	
	.center	{
		max-height:100vh;
	}
	
	img.flex-cont {
    	border:4px ridge #881177;
	}
	
	.picborder {
	  border:4px ridge #881177;
	}
	
	.vid {
		border:4px ridge #881177;
	}
	
	.vid1 {
		border:4px ridge #0000a5;
	}
	
	.p3main	{
		font-weight: bolder;
		font-size: 1.8em;
		font-family: Verdana, Tahoma, sans-serif;
		color: #b92222;
		text-shadow: 4px 4px 7px MediumBlue, 6px 6px 10px #addfff;
		line-height: 1.5em;
		padding: 3.0em 0 3.0em 0;
		}
	
	.p3a {
		font-size: 1.5em;
		line-height:2.0em;
		}
		
	.p4 {
		font-size: 0.6em;
		line-height: 0.7em;
		}
		
		
	.p5a {
		font-weight: bold;
		font-size: 1.3em;
		font-family: Verdana, Tahoma, sans-serif;
		color: #af0b0b;
		text-shadow: 2px 2px 3px #887700;
		line-height:1.3em;	
		}
		
	.p5b {
		font-weight: bolder;
		font-size: 1.6em;
		font-family: Verdana, Tahoma, sans-serif;
		color: #af0b0b;
		text-shadow: 3px 3px 8px #886f6f, 6px 6px 12px #aa8888;	
		line-height: 1.5em;
		}
		
	.p5c {
		font-weight: 400;
		font-size: 1.2em;
		font-family: Verdana, Tahoma, sans-serif;
		color: #ffffff;
		text-shadow:1px 1px red, 0px 0px 15px #f433ff;
		}
		
	
	.main_butt	{
	font-size: 1.0em;
	width: 50vw;
	line-height:1.4em;
	border: 4px ridge crimson;
	}
	
	.main_butt:active {
		color: red;
		background-color: LightSlateGray;
		transform: translate(6px, 6px);
		box-shadow: 2px 1px 20px #ffff00, 6px 3px 20px #999900, 12px 9px 20px #333300;
	}
	
	.butt_2	{
		width:auto;
		font-weight:bold; 
		font-size:0.7em;
		padding:5px 10px;
		border:3px ridge crimson;
		}
				
/*	.flex-fam > img	{
		border:2px ridge #ffef00;
		border-radius:10px;
		width:60px;
		}

	.divrule {
		height:7px;
		width:100%;
		border: 2px ridge #440000;
		background-color:#dd0000;
		box-shadow: 2px 2px 5px #da1884, 6px 6px 12px #333333;
		//	border-style:ridge;
		//	border-width:3px;
		}
		
	.knac {
		max-width:30vw;
//		margin: 30px 0 40px 0;
		}
	
	
	.footer-img {
		max-height:35px;
		width:auto;
//		padding-top:6px;
		border-style:none;
		vertical-align:middle;
	}
		
	.toplink {
		font-size: 1.0em;
		width: 100px;
		border: 3px ridge crimson;
		padding:3px 0 3px 0;
		}
		
	.toplink:active {
		font-size: 1.0em;
		width: 100px;
		border: 3px ridge crimson;
		padding:3px 0 3px 0;
		}
	
	
	.fb	{
		display:none;
		padding:2.0em 0 0 0;
		max-width:85px;
		}	
		
//	.fbdiv	{
//		display:none;
//		}
		
	.v_space	{
		display:none;
		}
}

@media only screen and (min-width: 560px) {
	
	#planet {
	 width: 7vw;
	}
	
		#capsule {
	 width: 26vw;
	}
	
		#land {
	 width: 11vw;
	}
	
		#legs {
	 width: 11vw;
	}
	
		#stage {
	 width: 7vw;
	}
	
	
	
	.main_butt {
		font-size: 1.5em;
		width: 50vw;
		line-height:1.8em;
		}
	
	.flex-col {
		row-gap: 50px;
		}
		
	.v_space	{
		height:1.0vh;
		}
		
}

@media only screen and (min-width: 640px) {
	.main_butt {
		font-size: 1.7em;
		width: 50vw;
		line-height:2.0em;
		}
	
	.flex-col {
		row-gap: 50px;
		}
		
	.v_space	{
		height:2.0vh;
		}
		
}

@media only screen and (min-width: 760px) {
	.main_butt {
		font-size: 1.5em;
		width: 30vw;
		line-height:4vh;
		}
		
	.v_space	{
		height:4vh;
		}
		
	.flex-col {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		row-gap: 8vh;
		column-gap:25px;
		justify-content: center;
		align-items:center;
		}
		
	.flex-col > div	{
//		width:auto;
		}
	
	.p3main {
		font-weight: bolder;
		font-size: 3.2em;
		font-family: Verdana, Tahoma, sans-serif;
		color: #b92222;
		text-shadow: 4px 4px 7px MediumBlue, 6px 6px 10px #addfff;
		line-height: 1.6em;
		padding: 6.0em 0 6.0em 0;
		}
		
	.p5a {
		font-weight: bold;
		font-size: 2.5em;
		font-family: Verdana, Tahoma, sans-serif;
		color: #af0b0b;
		text-shadow: 2px 2px 3px #887700;	
		}
		
	.p5c {
		font-weight: 400;
		font-size: 1.6em;
		font-family: Verdana, Tahoma, sans-serif;
		color: #ffffff;
		text-shadow:1px 1px red, 0px 0px 15px #f433ff;
		}		
		
	.p5b {
		font-weight: bolder;
		font-size: 2.7em;
		font-family: Verdana, Tahoma, sans-serif;
		color: #d52525;
		text-shadow: 3px 3px 6px #000000, 4px 4px 10px #888888;	
		line-height: 1.5em;
		}
		
	.footer-img {
		max-height:60px;
		width:auto;
//		padding:15px 0;
		vertical-align:middle;
		border-style:none;
		}
		
	.knac {
		max-width:25vw;
		}
	}
	
@media only screen and (min-width: 1072px) {
	
	  #planet {
	   width: 3vw;
	   max-width: 100px;
	   height: auto;
  	 position:absolute;
	   top:80vh;
	   left:5vw;
	  }

#voy {
	 width: 4vw;
	 max-width: 300px;
	 height: auto;
	 position:absolute;
	 top:5vh;
	 left:0vw;
}

#capsule {
	 width: 5vw;
	 max-width: 300px;
	 height: auto;
	 position:absolute;
	 top:0vh;
	 left:70vw;
	 display: none;
}

#stage {
	 width: 3vw;
	 max-width: 300px;
	 height: auto;
	 position:absolute;
	 top:57vh;
	 left:5vw;
	 display: none;
}
	
	.footer {
	position:static;
	width: 100vw;
//	height:6.0vh;
	margin:0 0 0 0;
	background-color: #ff007f4f;
//	background-image: url('images/flag_bkg.png');
	color: white;
	text-align: center;
//	vertical-align: bottom;
	}
	
.footer-img {
	max-height:45px;
	width:auto;
	padding:10px 0;
	border-style:none;
	}
	
	.flex-col  > div {
	flex: 50%;
	}
	
	.fbdiv	{
	width:100%;
	text-align:center; 
	padding:2vh 0;
	}
		
}

@media only screen and (min-width: 640px) and (orientation: landscape) {
	.footer	{
		position:static;
	}
}

*/