/* CUSTOM CSS STYLES TO OVERRIDE BOOTSTRAP STYLES */


/* FONT HANDLING */

:root {
	color-scheme: dark;
}

@supports (font-variation-settings: "wght" 400) {

* {
	font-family: 'Raleway';
	font-weight: 400;
}

}

/*
h1 {
	background: #FFC107; (yellow)
	background: #3D5673; (blue)
	other type colors under consideration: #E45725
}
*/

.no-bullet {
	list-style-type: none;
}

.nav_text {
	font-weight: 800;
}


/* TEXT COLORS */

.blue-text {
	color: #496A91;
}

.med-blue-text {
	color: #77AEED;
}

.lt-blue-text {
	color: #77AEED;
}

.yellow-text {
	color: #666666;
}

.steampunk-gold {
	color: #958050;
}

.orange-text {
	color: #E45725;
}

.black-text {
	color: #000000;
}


/* BOOTSTRAP ICON STYLEING */
	  
.bi	{
	vertical-align: -.125em;
	fill: currentColor;
}

.bi-navbar {
	vertical-align: -.125em;
	fill: currentColor;
	font-size: 24px;
}

.bi-footer {
	vertical-align: -.125em;
	fill: currentColor;
	font-size: 24px;
}


/* ICONS 8 ICON STYLING */

.icons8 {
	vertical-align: -.125em;
	width: 15%;
}


/* HERO HEADLINE TEXT STYLING */

.headline_01 {
	font-family: 'Raleway';
	font-weight: 800;
}

.headline_01_highlighted {
	font-family: 'Raleway';
	font-weight: 800;
	background: #3D5673;
	padding: 2px 0px 5px;
}

.headline_02 {
	font-family: 'Raleway';
	font-weight: 300;
}

.headline_02_highlighted {
	font-family: 'Raleway';
	font-weight: 300;
	background: #3D5673;
	padding: 2px 0px 5px;
}


/* ARTICLES */

/*
.article_text {
	font-family: 'Sacramento' !important;
	color: #E45725;
}
 */

.art_list_anchor {
	color: inherit;
	text-decoration: inherit;
}

.pullquote {
	color: #5986bd;
	font-display: block;
	font-size: 1.6em;
	font-weight: 500;
	margin-top: 56px;
	margin-left: 0px;
	margin-right: 56px;
}


/* NAVBAR: LOGO */
/* IF SCREEN SIZE IS 1025 PX OR MORE: */

@media only screen and (min-width: 1025px) {

	.logo_type_personal {
		font-family: 'Sacramento';
		font-display: block;
		font-size: 2.8em;
		color: #E45725;
		line-height: 100%;
		margin-top: 14px;
		margin-left: 56px;
	}

	.logo_type_steampunks_01 {
		font-family: 'Stint Ultra Expanded';
		font-display: block;
		font-size: 3em;
		font-weight: 600;
		color: #306484;
		line-height: 100%;
		margin-top: 14px;
		margin-bottom: 0px;
		margin-left: 56px;
	}

	.logo_type_steampunks_02 {
		font-family: 'Stint Ultra Expanded';
		font-display: block;
		font-size: 2.5em;
		font-weight: 700;
		color: #958050;
		line-height: 100%;
		margin-top: 14px;
		margin-bottom: 0px;
	}

	.logo_type_steampunks_03 {
		font-size: 0.9em;
		margin-left: 48px;
		margin-top: 0px;
	}
	
	.mobile_indent_small {
		margin-left: 0px;
	}
	
	.mobile_indent_large {
		margin-left: 0px;
	}

}

/* IF SCREEN SIZE IS 1024 PX OR LESS: */

@media only screen and (max-width: 1024px) {

	.logo_type_personal {
		font-family: 'Sacramento';
		font-display: block;
		font-size: 2.6em;
		color: #E45725;
		line-height: 100%;
		margin-top: 14px;
		margin-left: 20px;
	}

	.logo_type_steampunks_01 {
		font-family: 'Stint Ultra Expanded';
		font-display: block;
		font-size: 2em;
		font-weight: 600;
		color: #306484;
		line-height: 100%;
		margin-top: 10px;
		margin-left: 12px;
	}

	.logo_type_steampunks_02 {
		font-family: 'Stint Ultra Expanded';
		font-display: block;
		font-size: 1.6em;
		font-weight: 700;
		color: #958050;
		line-height: 100%;
		margin-top: 16px;
	}

	.logo_type_steampunks_03 {
		font-size: 0.65em;
		margin-left: 20px;
	}
	
	.mobile_indent_small {
		margin-left: 10px;
	}
	
	.mobile_indent_large {
		margin-left: 20px;
	}

}


/* PERSONAL HOMEPAGE IMAGE SWAPPER */
/* CREATE ALTERNATE PICTURES AND THEN ACTIVATE THE FOLLOWING: */

#personal_hero_background {
	background-image:url('../images/homepage/hero_personal_testing_02.jpg');
}

body:has(#image_swap_programming:hover) #personal_hero_background {
	background-image:url('../images/homepage/hero_personal_testing_02.jpg');
}

body:has(#image_swap_engineering:hover) #personal_hero_background {
	background-image:url('../images/homepage/hero_personal_testing_02.jpg');
}

body:has(#image_swap_building:hover) #personal_hero_background {
	background-image:url('../images/homepage/hero_personal_testing_02.jpg');
}

body:has(#image_swap_making:hover) #personal_hero_background {
	background-image:url('../images/homepage/hero_personal_testing_02.jpg');
}

body:has(#image_swap_design:hover) #personal_hero_background {
	background-image:url('../images/homepage/hero_personal_testing_02.jpg');
}