@import url('https://fonts.googleapis.com/css2?family=Source+Sans+Pro:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&display=swap');

html {
    height: 100%;
}
body {
	font-family: 'Source Sans Pro', sans-serif;
	font-size: 1.3rem;
	line-height: 1.7em;
	/*border: 12px solid #2C90DA;*/
	/*border-image: linear-gradient(180deg, #0A59D7, #0079f0) 1;*/
}

::selection {
	background: rgba(0,0,0,0.8);
	color: #fff;
}

body.light {
	background-color: #fff;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='49' viewBox='0 0 28 49'%3E%3Cg fill-rule='evenodd'%3E%3Cg id='hexagons' fill='%232d3850' fill-opacity='0.05' fill-rule='nonzero'%3E%3Cpath d='M13.99 9.25l13 7.5v15l-13 7.5L1 31.75v-15l12.99-7.5zM3 17.9v12.7l10.99 6.34 11-6.35V17.9l-11-6.34L3 17.9zM0 15l12.98-7.5V0h-2v6.35L0 12.69v2.3zm0 18.5L12.98 41v8h-2v-6.85L0 35.81v-2.3zM15 0v7.5L27.99 15H28v-2.31h-.01L17 6.35V0h-2zm0 49v-8l12.99-7.5H28v2.31h-.01L17 42.15V49h-2z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
	color: #12121b;
}

	body.light .bg-clip {
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		height: 50vh;
		width:100vw;
		/*clip-path: ellipse(148% 70% at 91% -14%);*/
		background: #4FB5F0;
		z-index: -1;
	}

body.dark {
	background: rgb(0,2,33);
	background: rgb(0,2,33);
background: linear-gradient(45deg, rgba(0,2,33,1) 0%, rgba(32,36,93,1) 32%, rgba(48,32,93,1) 48%, rgba(32,36,93,1) 65%, rgba(0,2,33,1) 100%);
	background-attachment: fixed;
	
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='49' viewBox='0 0 28 49'%3E%3Cg fill-rule='evenodd'%3E%3Cg id='hexagons' fill='%23ffffff' fill-opacity='0.025' fill-rule='nonzero'%3E%3Cpath d='M13.99 9.25l13 7.5v15l-13 7.5L1 31.75v-15l12.99-7.5zM3 17.9v12.7l10.99 6.34 11-6.35V17.9l-11-6.34L3 17.9zM0 15l12.98-7.5V0h-2v6.35L0 12.69v2.3zm0 18.5L12.98 41v8h-2v-6.85L0 35.81v-2.3zM15 0v7.5L27.99 15H28v-2.31h-.01L17 6.35V0h-2zm0 49v-8l12.99-7.5H28v2.31h-.01L17 42.15V49h-2z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E"), linear-gradient(45deg, rgba(0,2,33,1) 0%, rgba(0,36,93,1) 32%, rgba(0,32,93,1) 48%, rgba(0,36,93,1) 65%, rgba(0,2,33,1) 100%);
	
	
	color: #fff;
}

	body.dark .bg-clip {
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		height: 50vh;
		width:100vw;
		/*clip-path: ellipse(148% 70% at 91% -14%);*/
		background: #0F0F1F;
		z-index: -1;
	}
	
	body.dark .dark-overlay {
		background: linear-gradient(0deg, rgba(0,0,0,0.5) 0%, rgba(15,15,30,0.6) 90%, rgba(0,0,0,0.99) 100%);
		z-index: 1;
		position: fixed;
		top:0;
		left:0;
		right:0;
		bottom:0;
	}
	
hr.short {
	background-color: #0A5BDF;
	max-width: 100px;
	height: 2px;
	border: 1px solid #0A5BDF;
	opacity: 1;
}

.hex-icon {
	position: relative;
	margin: 0 auto;
	text-align: center;
	max-width: 100px;
}

.hex-icon::before {
  content: "\2B22";
  font-size:135px;
  z-index: 1;
  background: linear-gradient(180deg, #0A59D7, #51E2F8);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

	.hex-icon svg {
		position: absolute;
		left: 0;
		right:0;
		margin: 0 auto;
		top: 2px;
		z-index: 50;
	}

/****************
BACKGROUND ANIMATION
*****************/

@keyframes bggradient-animate {
    0%{background-position:0% 0%}
    50%{background-position:50% 50%}
    100%{background-position:0% 50%}
}

/*****************
TEXT STYLES
******************/
h1, .h1 {
	font-weight: 300;
}

h2, .h2 {
	font-weight: 300;
}

h3, .h3 {
	
}

h4, .h4 {
	font-weight: 600;
}

h5, .h5 {
	font-weight: 400;
	text-transform: uppercase;
	letter-spacing: 1px;
	font-size: 1rem;
}

	h5.card-title {
		font-weight: 400;
		text-transform: uppercase;
		letter-spacing: 1px;
		font-size: 1.3rem;
	}

h6, .h6 {
	font-weight: 300;
	text-transform: uppercase;
	letter-spacing: 1px;
	font-size: .65em;
}

blockquote:before {
	content: '“';
	color: #0A5BDF;
	font-size: 5rem;
	width: 100%;
	display: block;
	font-style: normal;
	font-weight: 800;
	text-align:center;
}

blockquote {
	font-weight: 300;
	font-style: italic;
	font-size: 1.6rem;
	max-width: 500px;
	margin: 1.5rem auto;
	text-align: center;
}

blockquote p {
	margin 0;
}

blockquote footer {
	font-weight: 700;
	font-style: normal;
	font-size: 0.95rem;
}

.badge {
	font-weight: 300;
	text-transform: uppercase;
	letter-spacing: 1px;
	border: 1px solid #0A5BDF;
	background: none;
	display: inline-block;
	margin: .25em .65em .25em 0;
	font-size: .65em;
}

	.dark .badge {
		color: #fff!important;
	}
	
	.light .badge {
		color: #12121b!important;
	}
	
	
.dark .page-link {
	background: rgba(0,0,0,0.5);
	border-color: #0A5BDF;
	color: #fff;
}

	.dark .page-item.disabled .page-link {
		background: rgba(0,0,0,0.3);
		border-color: #0A5BDF;
	}
	
.list-group {
	background: none!important;
}

	.list-group-item {
		background: none;
	}
	
	.list-group-item a {
		text-decoration: none;
	}
	
	.list-group-item svg {
		margin: 5px;
	}
	
	.dark .list-group-item a {
		color: #fff;
		transition: 0.3s;
	}
	
/***************
LINKS AND BUTTONS & FORMS
****************/
a {
	transition: 0.3s;
}

.dark label {
	color: #bbb;
	font-size: 1.2rem;
	margin: 5px 0;
}

.dark .form-control, .dark .form-select {
	background: rgba(0,0,0,0.8);
	color: #fff;
	border: 1px solid #0A5BDF;
}

.btn {
	font-size: 0.8rem;
	text-transform: uppercase;
	letter-spacing: 1px;
	background: #0A59D7;
	background-clip: border-box;
	border: 4px solid #12121B;
	outline: 1px solid #0A59D7;
	transition: 0.3s;
}

	.btn:hover {
		background: linear-gradient(180deg, #0A59D7, #2C9BE7);
		border: 1px solid rgba(255,255,255,.1);
	}

/***************
COLORS and COLOR SWITCHING
****************/
.bg-primary { /*midtone blue*/
	background: #0A5BDF!important;
}

.text-primary {
	color: #0A5BDF!important;
}

.bg-secondary { /*bright teal*/
	background: #6ec5f6!important;
}

.text-secondary {
	color: #6ec5f6!important;
}

.bg-dark { /*navy*/
	background: #12121B!important;
}

.text-dark {
	color: #12121B!important;
}

.text-muted {
	color: inherit!important;
	opacity: 0.7;
}

.lead {
	font-size: 1.5rem;
}

.text-overlay {
	position: relative;
	z-index: 3;
}

.dark .gradient-bottom {
	position: absolute;
	x-index: 1;
	left: 0; right: 0; bottom: 0; top: 0;
	background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(18,18,27,0.8) 50%, rgba(0,0,0,1) 100%);
}

.light .gradient-bottom {
	position: absolute;
	x-index: 1;
	left: 0; right: 0; bottom: 0; top: 0;
	background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.8) 50%, rgba(255,255,255,1) 100%);
}

/****************
CARDS
*****************/
.card {
	border: 0;
	border-radius: 0;
	box-shadow: 0 0 0;
	background: none!important;
}

.card-title {
	text-transform: none!important;
}

.content-link a {
	text-decoration: none;
}

	.dark .content-link a {
		color: rgba(255,255,255,0.9);
		transition: 0.3s;
	}
	
	.dark .content-link a:hover {
		color: rgba(255,255,255,1);
		text-shadow: 0px 3px 0 rgba(0,0,0,0.5);
	}
	
	.light .content-link a {
		color: rgba(15,16,26,0.9);
		transition: 0.3s;
	}
	
	.light .content-link a:hover {
		color: rgba(15,16,26,1);
		text-shadow: 0px 3px 0 rgba(0,0,0,0.2);
	}
	

/****************
NAVIGATION
*****************/
.mainnav {
	/*background: rgb(15,15,22);
	background-image: linear-gradient(180deg, #000, #0f2c61);
	box-shadow: 0px 10px 25px rgba(0,0,0,0.2);
	border-bottom: 1px solid rgba(255,255,255,0.1);*/
}

.navbar {
	border-top: 8px solid #0959D7;
	border-bottom: 1px solid rgba(255,255,255,0.08)
}

.navbar-toggler {
	background: #0A5BDF!important;
	color: #fff;
	font-size: 1.8rem;
	box-shadow: 5px 0px 15px rgba(0,0,0,0.5);
}

.navbar a {
	font-size: 0.85rem;
	text-transform: uppercase;
	letter-spacing: .05rem;
	font-weight: 800;
	text-decoration: none;
}

.navbar a {
	color: #fff;
}

.navbar .nav-item .nav-link {
	padding: .5rem .7rem;
}

/*dropdowns*/
.dropdown-item {
	transition: 0.3s;
	color: #fff;
}

.dark .dropdown-menu {
	background: #12121B;
	margin: 0;
	padding: 0;
}

.dark .dropdown-item {
	background: #12121B;
	border-bottom: 1px solid rgba(255,255,255,0.1);
}

.dropdown-item:hover {
	padding: .25rem 1rem;
}

.dark .dropdown-item:focus, .dark .dropdown-item:hover {
	background:#12121B;
	color: #fff;
}
/****************
FOOTER
*****************/
footer {
	position: relative;
	z-index: 2;
}

footer ul {
	display: flex;
    justify-content: center;
}

.light footer.footer {
	background: #fff;
}

	.light footer a {
		color: rgba(0,0,0,0.7);
	}

.dark footer.footer {
	background: #12121B;
	border-top: 1px solid rgba(255,255,255,0.15)
}

	.dark footer a {
		color: rgba(255,255,255,0.8);
		transition: 0.3s;
	}
	
	.dark footer a:hover {
		color: rgba(255,255,255,1);
	}
	
/****************
FEATURE ARTICLE CONTENT
*****************/
.feature-header {
	background-repeat: none;
	background-size: cover;
	background-position: center center;
}

.feature-header .list-highlights {
	font-size: 1rem;
	line-height: 1.3rem;
	font-style: italic;
}

	.feature-header .list-highlights .list-group-item {
		padding: .5rem 0;
	}

.feature-header .row {
	min-height: 70vh;
}


.feature-article p:first-child:first-line{
	font-weight: bold;
}

.full-width-image {
   width: 100vw;
	position: relative;
	left: 30%;  
	margin-left: -30vw;
	text-align: center;
}

.full-width-image img {
  width: 100%;
  margin: 0 auto;
}

	/** tablet / mobile full width **/
	@media screen and (max-width: 992px) {
		.full-width-image {
		   width: 100%;
		   position: relative;
			left: 0%;
			margin-left: 0;
		}

		.full-width-image img {
		  width: 100%;
		  margin: 0 auto;
		}
	}

.half-width-image {
   width: 120%;
   position: relative;
   margin-left: -10%;
   margin-right: -10%;
}

.half-width-image img {
  width: 100%;
  margin: 0 auto;
  text-align: center;
}

	/** tablet / mobile half width **/
	@media screen and (max-width: 1080px) {
		.half-width-image {
		   width: 100%;
		   position: relative;
		   margin-left: 0%;
		   margin-right: 0%;
		}

		.half-width-image img {
		  width: 100%;
		  margin: 0 auto;
		  text-align: center;
		}
	}

figcaption {
	font-style: italic;
	opacity: 0.7;
	background: none;
	max-width: 1140px;
	margin: 15px auto;
	font-size: 1rem;
	border-bottom: 1px solid rgba(255,255,255,0.1);
}
	
/****************
ARTICLE CONTENT
*****************/
.dark .body-container {
	background: linear-gradient(0deg, rgba(0,0,0,0.5) 0%, rgba(15,15,30,0.6) 90%, rgba(0,0,0,0.99) 100%);
	background-position: fixed;
	z-index: 2;
}

.light .body-container {
	background: linear-gradient(0deg, rgba(255,255,255,0.1) 0%, rgba(255,255,255,1) 100%);
	background-position: fixed;
	z-index: 2;
}

.dark article .border-bottom {
	border-bottom: 1px solid rgba(255,255,255,0.3)!important;
}

.dark article .border-bottom {
	border-top: 1px solid rgba(255,255,255,0.3)!important;
}

.dark .list-group {
	background: none;
}

	.dark .list-group .list-group-item {
		background: none!important;
		color: #fff;
		opacity: 0.7;
		transition: 0.3s;
		border: 0;
		border-radius: 0;
		border-bottom: 1px solid rgba(255,255,255,0.2)
	}
	
	.dark .list-group-item-action.active {
		background: none!important;
		opacity: 1;
	}
	
	.dark .list-group-item-action:focus, .dark .list-group-item-action:hover {
		background: none!important;
		opacity: 1;
	}

.author-img {
	border: 1px solid rgba(255,255,255,0.2);
	margin: 0 0 1rem 0;
}

article li {
	
}

article.content h2, article.content h3 {
	color: #4FB5F0!important;
}

article table {
	width: 120%;
	margin: 2.5rem -5%;
}

article table th {
	background: rgba(255,255,255,0.1);
	padding: 0.5em;
}

article table td {
	padding: 0.5em;
}

.dark table tr {
	border-bottom: 1px solid rgba(255,255,255,0.3);
}

.light table tr {
	border-bottom: 1px solid rgba(0,0,0,0.3);
}

.bodytint {
	background: rgba(0,0,0,0.33);
}

.accordion-body, .accordion-item, .accordion-button {
	background: transparent;
}

.dark .accordion-button {
	color: #fff!important;
	background: transparent;
}

.dark .accordion-body {
	color: #fff!important;
}