html { scroll-behavior: smooth }
h1 {
	letter-spacing: -.02em !important;
}

* {
	font-family: -apple-system, BlinkMacSystemFont,"Helvetica Neue", Helvetica, Arial,
    “Segoe UI”, “Roboto”, “Oxygen”,
    “Ubuntu”, “Cantarell”, “Fira Sans”,
    “Droid Sans”, sans-serif !important
}
/* .section-hero h1 { */
	/* font-family: "Times", "Times New Roman", serif !important; */
	font-weight: 700 !important;
}

.title-text {
	padding-bottom: 20px;
}
.div-title {
	text-align: center;
	margin-top: 10px;
	margin-bottom: 10px;
}
.div-buttons {
	text-align: center;
}

.monospace {
  font-family: "SF Mono", monospace;
  line-height: normal;
  font-weight: 600;
}

a {
  cursor: pointer;
}


/* Sections */
.section-hero {
	position: relative;
	overflow:	hidden;
	min-height: calc( 100vh - 41px );
	/* background-color: #111213; */
	tex
}
.section-details {
	position: relative;
	overflow:	hidden;
	min-height: calc( 100vh - 41px - 53px );
	/* background-color: #111213; */
	tex
}
.section-hero .typography-title-elevated {
	font-size: 2.5rem;
}
@media only screen and (max-width: 1068px) {
	.section-hero .typography-title-elevated {
		font-size: 1.75rem;
		line-height: .85;
	}
}
.hero-title {
	padding-top: 10%;
	position: relative;
}
.hero-text {
	position: relative;
	z-index: 5;
}
.hero-text {
    line-height: normal;
    background: radial-gradient(closest-side, #019fde, #b200f8, #f96216);
    background-size: 400% 600%;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    -webkit-animation: bg-animation 90s ease ;
    animation: bg-animation 90s ease ;
}
@keyframes bg-animation {
		0% {
				background-position: 0% 17%;
		}
		50% {
				background-position: 90% 84%;
		}
		100% {
				background-position: 0% 17%;
		}
}

.hero-subtitle {
	position: relative;
}

.hero-intro {
	margin-top: 50px;
	margin-bottom: 100px;
}
.intro-copy {
	margin-top: 2px;
}



.search-card {
	transition: all 0.15s ease;
	border-radius: 6px;
	color: #111111;
	display: block;
	background-color: #fafcfe;
	padding-top: 8px;
	padding-left: 20px;
	padding-right: 20px;
	padding-bottom: 8px;
	margin-bottom: 20px;
	transition: all .3s ease;
	border: 1px solid #eaecee;
}
.search-card:hover {
	transform: translateY(-6px);
	box-shadow: 0 6px 12px rgba(0,0,0,.05)
}
.search-card p {
	font-weight: 500 !important;
}

.alert {
		font-weight: 500 !important;
		border-radius: 6px;
		display: block;
		padding-top: 8px;
		padding-left: 20px;
		padding-right: 20px;
		padding-bottom: 8px;
		margin-bottom: 10px;
		border: 1px solid;
}
.alert.alert-warn {
	color: #856404;
	background-color: #fff3cd;
	border-color: #f5c6cb
}
.alert.alert-message {
	color: #004085;
	background-color: #cce5ff;
	border-color: #b8daff;
}
.alert.alert-success {
	color: #087f5b;
	background-color: #e6fcf5;
	border-color: #20c997;
}

.dismissIcon {
	height: 20px;
	padding-left: 6px;
	padding-top: 2px;
	padding-right: 10px;
	cursor: pointer;
	position: absolute;
	top: 0;
	right: 0;
	text-align: right;
	font-size: 20px;
	font-weight: 700;
	letter-spacing: .02em;
	text-transform: uppercase;
}
.search-bar {
	position: fixed;
	top: 72px;
	left: 12px;
	width: calc(100% - 24px);
	max-width: 500px;
}
#autocomplete-box {
	display: block;
	overflow-y: scroll;
	max-height: calc(100vh - 160px);
	border-radius: 6px;
	color: #111111;
	background-color: #fafcfe;
	border: 1px solid #dadcde;
	box-shadow: 0 2px 12px rgba(0,0,0,.15)

}
#autocomplete-list li {
	transition: all 250ms ease;
	list-style: none;
	padding: 10px;
	padding-left: 15px;
	cursor: pointer;
}
#autocomplete-list li:hover {
	background-color: #eaecee;
}

@media (prefers-color-scheme: dark) {
  body, html {
    background-color: #04070e;
    color: #fafbfc;
  }
  h1,h2,h3,h4, label {
    color: #eaebec !important;
  }
	input {
		color: #eaebec !important;
    background-color: #0e121b !important;
	}
  input::-webkit-input-placeholder {
    color: #aaabac !important;
  }

	.search-card {
		color: #eaebec;
		background-color: #0e121b;
		border-color: #2B3750;
	}
	.search-card:hover {
		background-color: #1e222b;
	}
	#autocomplete-box {
		border-color: #2B3750;
		background-color: #0e121b;
		color: #eaebec;
	}
	#autocomplete-list li:hover {
		background-color: #1c2435
	}
}
