
/* 
	blue: #05386B	
	green: #5CDB95
	white: #EDF5E1
	light-green: #8EE4AF
	light-blue: #379683
	
*/
:root {
	--main-bg-color: #5CDB95;
	--main-text-color: #05386B;
	--main-heading-color: #EDF5E1;
	--light-bg-color: #8EE4AF;
	--light-text-color: #379683;
}

body {
	background-color: var(--main-bg-color);
	color: var(--main-text-color);
	font-family: 'Roboto', sans-serif;
}

h1, h2, h3, h4 {	
	font-weight: 300;
	color: var(--main-heading-color);
	background-color: var(--main-text-color);
	border-radius: 0.25rem;
}

.heading-box{
	color: var(--main-heading-color);
	background-color: var(--main-text-color);
	border-radius: 0.25rem;

}

.heading-box .img {
	border-right: 1px solid rgba(255, 255, 255, 0.1);
}

.heading-box .heading-text {
	font-weight: 300;
}

a {
	color: var(--main-text-color);
}

p {
	text-align: justify;
}

p:first-letter { border-left: 2em solid rgba(0, 0, 0, 0); }

.sidebar-wrap {
	height: 100vh;
	border-right: 1px solid var(--main-text-color);
	overflow: hidden;
}

.edward-text {
	font-weight: 700;
	background-color: var(--main-text-color);
	white-space: nowrap;
	overflow: hidden;
	border-radius: 0;
}

#typewriter {
	font-weight: 300;
	color: var(--main-heading-color);
}

#sidebar li:hover {
	background-color: var(--main-text-color);
}

#sidebar li:hover a {
	color: var(--main-heading-color);
}

#sidebar .nav-item {
    transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out;
}

#sidebar a {
	color: var(--main-text-color);
}

.header {
	background-color: var(--main-text-color);
}

.logo {
	width: 150px;
}

.logo img {
	border: 1px solid rgba(255, 255, 255, 0.1);
}

.service-item {
	border-color: var(--main-text-color) !important;
}

.service-item div:first-child {
	background-color: var(--main-text-color);
	color: var(--light-bg-color);
}

.csuf {
	background-color: #00274C;
}

.uci {
	background-color: #0064a4;
}

.csuf, .uci {
	text-align: center;
	color: var(--main-heading-color);
}

.language-item {
	text-align: center;
}

.language-item {
	border: 1px solid var(--main-text-color);
	border-radius: 0.25rem;
}

.language-item div:first-child {
	background-color: var(--main-text-color);
	color: var(--main-heading-color);
}

.job-item div:first-child {
	background-color: var(--light-bg-color);
}

.job-item .title {
	background-color: var(--main-text-color);
	color: var(--main-heading-color);
}

.job-img{
	max-width: 100%;
	max-height: 120px;
}

.footer {
	background-color: var(--light-text-color);
}

.footer li a, .footer h6 {
	color: var(--light-bg-color);
}

.footer .btn {
	border-color: var(--main-text-color);
}

.footer li:hover .btn {
	background-color: var(--main-text-color);
	color: var(--main-heading-color);
}

.project-item {
	background-color: rgba(255, 255, 255, 0.2);
	border-color: var(--light-text-color);
}

.project-item .card-header {	
	border-color: var(--light-text-color);
}

.project-item a.project-title {
	text-decoration: none;
}

.project-item a:hover.project-title {
	color: var(--main-text-color);
	text-decoration: underline;
}