* {
	margin: 0;
}

html {
	height: 100%;
}

@font-face {
	font-family: 'Comic Sans MS';
	src: url('/fonts/comic_sans_ms.ttf') format('truetype');
}
  

body {
	background-color: #fdfdfd;
	height: 100%;
	/* font-family: 'Open Sans', sans-serif; */
	font-family: 'Comic Sans MS';
	padding-left: 20px;
	padding-right: 20px;
}

.flex-wrapper {
	display: flex;
  	min-height: 100vh;
  	flex-direction: column;
	justify-content: space-between;
	padding-top: 70px;

}

#green-terminal {
	color: black;
}

nav {
	position: relative;
	font-size: 1.3em;
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}

.dropdown-menu li {
	font-size: 1.5em;
}

#user-name {
	font-size: 2.5rem;
	color:black;
}

.user-description {
	margin-top: 10px;
	margin-bottom: 1em;
	padding: 0rem;
	font-size: initial;
}

.user-profile {
	padding: 0;
}

.user-picture {
	border-radius: 2%;
	border-style: solid;
	border-width: 0;
	border-color: black;
	margin-top: 20px;
}

i {
	margin: 10px 10px 10px 10px;
	color: black;
}

i:hover {
	color: #1b619b;
}

.post-link {
	/* float: left; */
	text-align: center;
}

.post-date {
	float: right;
}

.post-updated-date {
	float: right;
    font-style: italic;
}

.post-header {
	/* background-color: #F5F5F5; */
	overflow: hidden;
	padding: 10px 5px 0 5px;
}

.post-summary, .post-content{
	clear: both;
}

.post-summary {
	padding: 0 5px 0 5px;
	font-size: initial;
}

.post-list-footer {
	padding-bottom: 5px;
}

#post-list {
	list-style: none;
}

.post-list-item {
	margin-top: 20px;
	border-style: dashed;
	border-width: 0 0 0 0;
	border-color: #292929;
	margin-bottom: 50px;
}

.post-comments {
	padding-top: 10px;
	border-top-style: solid;
}

.wrapper {
	min-height: 100%;
	padding-left: 250px;
	padding-right: 250px;
	
}

.footer {
	background-color: white;
	display: flex;
	flex-direction: row;
	justify-content: flex-end;
	width: 100%;
	padding: 10px;
}

.footer p {
	margin-top: 20px !important;
	font-size: 0.8em;
}

.col-centered{
	float: none;
	margin: 0 auto;
}

td {
	margin: 0 20px 0 20px;
}

/* Leo customized */

.bg-dark {
	background-color: white !important;
}

.nav-link {
    color: black !important;
	padding-left: 1rem !important;
	padding-right: 1rem !important;
}

.nav-link:hover {
    color: #1b619b !important;
}

.navbar-dark .navbar-toggler-icon {
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='black' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

.img-fluid {
    width: 100%;
    height: auto;
}

.offset-lg-4 {
	margin-left: 20%;
}

.col-lg-4 {
	width: 65%;
	margin-bottom: 0;
}

p {
	margin-bottom: 0;
	text-align: justify;
	direction: ltr;
	font-size: 1.03em;
}

.header5 {
	text-align: left;
	color: black;
}

.bullet {
	position: relative;
	text-align: left;
	padding-left: 1.5em; /* space for the bullet */
	text-indent: -1.5em; /* pull first line back to align with bullet */
}

.bullet::before {
	content: "•";
	color: black;
	font-size: 1em;
	margin-right: 1em;
  }

.user-social {
	font-size: 60%;
}

ul {
    padding-left: 0rem;
}

a:link {
	color: #1b619b;
	text-decoration: none;
	background-image: linear-gradient(currentColor, currentColor);
	background-size: 0% 2px;
	background-position: center 100%;
	background-repeat: no-repeat;
	transition: background-size 0.3s ease;
  }


a:visited {
	color: #1b619b; /* Change this to your desired visited color */
	background-image: linear-gradient(currentColor, currentColor);
	background-size: 0% 2px;
	background-position: center 100%;
	background-repeat: no-repeat;
	transition: background-size 0.3s ease;
}
	

a:hover {
	background-size: 100% 2px;
}


a.social {
	background-image: none;
	transition: none;
}

a.navbar-brand {
	background-image: none;
	transition: none;
}

a.social i {
	transition: transform 0.3s ease;
}

a.social:hover i {
	transform: scale(1.3);
  }

div.container-fluid {
position: relative;
display: flex;
gap: 2rem;
}

div.container-fluid::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 0;
height: 2px;
background-color: currentColor;
transition: width 0.3s ease;
}

.container-fluid:has(.navbar-brand:hover)::after {
	width: 100%;
}

figcaption {
	text-align: center;
}

.featured-img {
	width: 80%;
	height: auto;

	display: block;
	/* border: 1px dashed #DEDEDE; */
	margin-left:auto; 
	margin-right:auto;
	padding: 10px
}

/*
 * Some font-size tweaks for smaller screens
 */

@media screen and (max-width: 1200px) {
	.wrapper {
		min-height: 100%;
		padding-left: 150px;
		padding-right: 150px;
		
	}
}

@media screen and (max-width: 991px) {
	.wrapper {
		min-height: 100%;
		padding-left: 25px;
		padding-right: 25px;
		
	}

	.offset-lg-4 {
		margin-left: 10%;
	}
	
	.col-lg-4 {
		width: 80%;
		margin-bottom: 0;
	}


}

@media screen and (max-width: 767px) {
	.container {
		max-width: 767px;
	}

	.offset-lg-4 {
		margin-left: 10%;
	}
	
	.col-lg-4 {
		width: 80%;
		margin-bottom: 0;
	}

}

@media screen and (max-width: 575px) {
	.wrapper {
		min-height: 100%;
		padding-left: 10px;
		padding-right: 10px;
		
	}

	.img-fluid {
		max-width: 50%;
		height: auto;
	}

	.offset-lg-4 {
		margin-left: 3%;
	}
	
	.col-lg-4 {
		width: 95%;
		margin-bottom: 0;
	}

}

@media screen and (max-width: 480px) {
	.wrapper {
		min-height: 100%;
		padding-left: 0px;
		padding-right: 0px;
		
	}
	.user-social {
		font-size: 50%;
	}

	#user-name {
		font-size: 2em;
	}

	nav {
		font-size: 80%;
	}

	.dropdown-menu li {
		font-size: 80%;
	}

	.offset-lg-4 {
		margin-left: 0%;
	}
	
	.col-lg-4 {
		width: 100%;
		margin-bottom: 0;
	}


}

@media screen and (max-width: 320px) {
	.user-social {
		font-size: 40%;
	}

	#user-name {
		font-size: 2em;
	}

	nav {
		font-size: 80%;
	}

	.dropdown-menu li {
		font-size: 80%;
	}
}