/* css for none index pages */

/* background */
html {
	background: rgb(2,0,36);
	background: linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(121,92,9,1) 0%, rgba(0,212,255,1) 100%);
}

img {
	max-width: 100%;
	height: auto;
}

/* website font family */
body {
	margin: 0;
	font-family: Stencil Std, fantasy;
}

/* topnav background color */
.topnav {
	overflow: hidden;
	background: rgb(238,174,202);
	background: radial-gradient(circle, rgba(238,174,202,1) 0%, rgba(148,187,233,1) 100%);
}

	/* topnav link styling */
	.topnav a {
		float: left;
		display: block;
		color: #f2f2f2;
		text-align: center;
		padding: 14px 16px;
		text-decoration: none;
		font-size: 30px;
	}

		/* topnav changes link color on hover*/
		.topnav a:hover {
			background-color: #ddd;
			color: black;
		}

		/* topnav highlight for current page */
		.topnav a.active {
			background: rgb(63,94,251);
			background: radial-gradient(circle, rgba(63,94,251,1) 0%, rgba(252,70,107,1) 60%);
			color: white;
		}

	/* hide links on open/close for small screens */
	.topnav .icon {
		display: none;
	}

/* hides links except home on 600px size devices*/
@media screen and (max-width: 600px) {
	.topnav a:not(:first-child) {
		display: none;
	}

	.topnav a.icon {
		float: right;
		display: block;
	}
}

/* topnav media query */
@media screen and (max-width: 600px) {
	.topnav.responsive {
		position: relative;
	}

		.topnav.responsive .icon {
			position: absolute;
			right: 0;
			top: 0;
		}

		.topnav.responsive a {
			float: none;
			display: inline-block;
			text-align: center;
		}
}

/* banner responsiveness */
.img-responsive {
	display: block;
	max-width: 100%;
	height: auto;
}

img {
	max-width: 100%;
	height: auto;
}