* { box-sizing: border-box; }

@font-face { font-family: 'Handel Gothic';
	src: url('Handel_Gothic_Regular.ttf') format('ttf'),
	url('Handel_Gothic_Regular.woff2') format('woff2'),
	url('Handel_Gothic_Regular.woff') format('woff');
	font-weight: normal;
	font-style: normal; }
	
	
	@font-face { font-family: 'Conduit';
		src: url('conduit_itc_medium1-webfont.woff2') format('woff2'),
		url('conduit_itc_medium1-webfont.woff') format('woff');
		font-weight: normal;
		font-style: normal; }
		
		#bgvid { position: fixed;
			right: 0;
			bottom: 0;
			min-width: 100%;
			min-height: 100%;
			opacity: 0%;}
			
			body { background-color: #000000;
				color: #666666;
				font-family: 'Conduit',Calibri;
				text-shadow: 2px 2px 2px #000000;}
				
				section { padding-left: 20px;
					padding-right: 20px;
					padding-top: 1px;
					padding-bottom: 20px;
					display: block;
					overflow: auto; } 
					
					#coolsectionL { padding-left: 20px;
						padding-right: 20px;
						padding-top: 10px;
						padding-bottom: 10px;
						margin-left: 10px;
						margin-right: 10px;
						display: block;
						font-size: 120%;
						text-align: center;
						overflow: auto;
						border-right:	solid #fed920;
						border-left:	solid #fed920;
						border-top:		solid #fed920;
						border-bottom: none;
						background-color: #000D20;
						border-radius: 15px 15px 0px 0px;} 
						
						#coolsectioncontent { padding-left: 20px;
							padding-right: 20px;
							padding-top: 10px;
							padding-bottom: 10px;
							margin-left: 10px;
							margin-right: 10px;
							display: block;
							overflow: auto;
							border-right:solid #fed920;
							border-left: solid #fed920;
							border-top: none;
							border-bottom: solid #fed920;
							color: #fed920;
							background-color: #000D20;
							border-radius: 0px 0px 15px 15px;
							font-size: 140%;}
							
							#coolsectionhead { font-size: 150%;
								font-weight: bold;
								padding-bottom: 20px;}
								
								nav { text-align: center;
									font-family: 'Handel Gothic',Calibri;
									font-size: 150%;
									font-weight: bold;
									z-index: 1;
									text-shadow: 4px 4px 4px #000000;
									transform: scale(1, 1.1);
									-webkit-transform: scale(1, 1.1); /* Safari and Chrome */
									-moz-transform: scale(1, 1.1); /* Firefox */
									-ms-transform: scale(1, 1.1); /* IE 9+ */
									-o-transform: scale(1, 1.1); /* Opera */
									padding: 10px;}
									
									body a:visited { text-shadow: 0px 1px 1px #000000; color: #3eff58c4}
									body a:hover { text-shadow: 0px 10px 10px #000000; color: #3eff58}
									body a:link { text-shadow: 0px 1px 1px #000000; color: #3eff58}
									body a { text-decoration: none; }
									
									h1 a:visited { color: #FFFFFF}
									h1 a:hover { color: #FFFFFF}
									h1 a:link { color: #FFFFFF}
									h1 a { text-decoration: none; }
									
									nav a { text-decoration: none; color: #00000000; text-shadow: 1px 0 #006eff22, 0 1px #ffffff2c, 1px 0 #ffffff22, 0 1px #ffffff02;}
									nav a:link { color: #fed920; }
									nav a:visited { color: #eec910; }
									nav a:hover { color: #FFFFFF;text-shadow: -1px 0px 20px #2396ff,-1px 0px 5px #2396ff;}
									nav ul { margin: 0;
										font-size: 1em;
										list-style-type: none; }
										
										h1 { margin: center;
											font-family: 'Conduit',Calibri;
											margin-bottom: -.33em;
											margin-top: 0;
											text-align: center;
											text-shadow: 2px 2px 2px #000000;
											font-size: 5em;
											text-align: center;}
											
											h2 { color: #fed920;
												text-shadow: 2px 2px 2px #000000;
												font-family: 'Conduit',Calibri;
												font-size: 200%;}
												
												footer { color: #FFFFFF;
													font-size: .75em;
													font-style: italic;
													padding: 2em;
													text-align: center;
													text-shadow: 1px -1px 4px #000000, 0px -1px 2px #000000, -1px -1px 4px #000000, 0px -1px 4px #000000;
													font-family: Georgia; }
													
													.outline { color: #000000; text-shadow: inset -1x 0.1px 5px #2bfe20; text-shadow: -0px 0.1px 5px #fed920, -0.5px 0 #fed920, 0 0.5px #fed920, 0.5px 0 #fed920, 0 -0.5px #fed920;}
													
													.HCE { color: #fed920;
														font-weight: bold; }
														
														#wrapper {color: #FFFFFF;
															background-image: linear-gradient(to top, rgba(0,0,0,.25), rgb(4, 20, 51));
															border: solid;
															border-color: #fed920;
															border-radius: 15px;}
															
															#gallerywrapper {color: #FFFFFF;
																background-image: linear-gradient(to top, rgba(0,0,0,.25), rgba(5,30,75,1));
																border: solid;
																border-color: #fed920;
																border-radius: 15px;}
																
																#gallery { display: grid;
																	grid-template-rows: auto;
																	grid-template-columns: 1fr;
																	text-align: center;}
																	
																	#evolution { text-align: center;}
																	
																	.wrapper-layer { position: relative; }	
																	
																	nav ul { padding: .5em; }
																	
																	@media (min-width: 636px) {
																		#bgvid { opacity: 100%;}
																		
																		#gallery { grid-template-columns: 1fr 1fr;}
																	}
																	
																	@media (min-width: 1000px) {	
																		#gallery { grid-template-columns: 1fr 1fr 1fr;}
																	}
																	
																	@media (min-width: 1280px) {
																		
																		#bgvid { opacity: 100%;}
																		
																		main { display: grid;
																			grid-template-rows: auto;
																			grid-template-columns: 75% 25%; }
																			
																			#coolsectionR { grid-row: 2 / 3; grid-column: 2 / 2;
																				margin-right: 20px;
																				border-right: solid #fed920;
																				border-left: none;
																				border-top: none;
																				border-bottom: none;
																				background-color: #000D20;
																				border-radius: 0px; }
																				
																				#coolsectionL { grid-row: auto; grid-column: 1 / 2;
																					margin-left: 20px;
																					margin-right: 0px;
																					border-right: none;
																					border-left: solid #fed920;
																					border-top: solid #fed920;
																					border-bottom: solid #fed920;
																					background-color: #000D20;
																					border-radius: 15px 0px 0px 15px;}
																					
																					#coolsectionT { grid-row: 1 / 3; grid-column: 2 / 2;
																						margin-top: 20px;
																						margin-right: 20px;
																						margin-left: -3px;
																						font-size: 200%;
																						text-align: center;
																						float: right;
																						border-right:solid #fed920;
																						border-left: solid #fed920;
																						border-top: solid #fed920;
																						border-bottom: none;
																						background-color: #000D20;
																						border-radius: 15px 15px 0px 0px; }
																						
																						#coolsectioncontent { grid-row: 1 / 4; grid-column: 2 / 2;
																							position: relative;
																							padding-top: 23px;
																							padding-bottom: 23px;
																							margin-top: 20px;
																							margin-right: 20px;
																							margin-left: -3px;
																							text-align: left;
																							border: none;
																							background: none; }
																							
																							#coolsectionB { grid-row: 3 / 3; grid-column: 2 / 2;
																								margin-bottom: 20px;
																								margin-right: 20px;
																								margin-left: -3px;
																								float: right;
																								border-right:solid #fed920;
																								border-left: solid #fed920;
																								border-top: none;
																								border-bottom: solid #fed920;
																								background-color: #000D20;
																								border-radius: 0px 0px 15px 15px; }
																								
																								section { grid-row: auto; grid-column: 1 / 2; }
																								
																								nav ul { display: flex;
																									flex-flow: row wrap;
																									justify-content: space-evenly;}
																									
																									nav li { padding-left: .5em;
																										padding-right: .5em;
																										border: solid #fed920;
																										background-color: #000D20;
																										border-radius: 10px;
																										box-shadow: 0px 5px 20px #000000,
																										0px 1px 5px #000000,
																										0px 4px 5px #000000;}
																										
																										#homehero { border-radius: 50px 50px 0px 0px;}
																										
																										#wrapper { min-height: 600px;
																											margin: auto;
																											max-width: 1600px;}
																											
																											#gallerywrapper { min-height: auto;
																												margin: auto;
																												max-width: 1600px;}
																												
																												nav { max-width: 1800px;
																													margin: auto;
																													position: -webkit-sticky; /* Safari */
																													position: sticky;
																													top: 0;}
																													
																													#gallery { grid-template-columns: 1fr 1fr 1fr 1fr;}
																												}