@charset "utf-8";

/* Fonts */
@import url('https://fonts.googleapis.com/css?family=Open+Sans|Inconsolata|Baloo+Tamma+2:wght@400;500;600;700;800&display=swap');
/* Dark mode */
@media (prefers-color-scheme: light) {
	body {
	color: #0b1520;
	background-color: #FFF;
}
}
/* Dark mode */
@media (prefers-color-scheme: dark) {
	body {
		color: #FFF;
		background-color: #0b1520;
	}
}
body {
	font-family: 'Open Sans', sans-serif;
}
progress {
	display: block; /* default: inline-block */
	margin: 0.5em auto 1em auto;
	height: 1px;
	-webkit-appearance: none;
}
progress::-webkit-progress-value {
	background: #3b5998;
}
progress::-moz-progress-bar {
	background: #3b5998;
}
.code {
	font-family: 'Inconsolata';
}
a, a:visited, a:hover {
	color: inherit;
}
h1#mainTitle {
	font-family: 'Baloo Tamma 2', cursive;
	font-weight: 600;
}
/*
.code:before {
	content: "<?=";
	color: rgba(209,  110,  110, 0.5);
}
.code:after {
	content: "()?>";
	color: rgba(209,  110,  110, 0.5);
}
*/
#me > .row > div > a {
	position: relative;
	z-index: 9999;
}
#me > .row > div > a + a {
	left: -25px;
	z-index: 1;
}
#me a img {
	-webkit-transition: transform .3s ease-in-out;
    -moz-transition: transform .3s ease-in-out;
    -o-transition: transform .3s ease-in-out;
    -ms-transition: transform .3s ease-in-out;
    transition: transform .3s ease-in-out;
}
#me > .row > div > a + a:hover {
	z-index: 9999;
}
#me a:hover img {
	transform: scale(1.2);
}
#me .row:first-child {
	min-height: 86vh;
}
#me .scrollDown a {
	color: #FFF;
	font-size: 1.5rem;
}
#me .row + .row {
	position: relative;
	bottom: 30px;
}
#me img {
	height: 150px;
	margin-bottom: 25px;
}
#me figure {
	display: inline-block;
}
#me figcaption {
	font-size: 1.5em;
}
/*
#me h1.code:before {
	content: "< ";
	color: rgba(255,  255,  255, 0.5);
}
#me h1.code:after {
	content: "/>";
	color: rgba(255,  255,  255, 0.5);
}
*/
#skills .row i.fa {
	color: #0b1520;
	width: 75px;
	line-height: 75px;
	font-size: 50px;
	text-align: center;
	top: 16px;
	background-color: #f2f2f2;
	border-radius: 50%;
	box-shadow: 0px 0px 10px 5px rgba(0, 0, 0, 0.54)
}
#skills i.fa + h4 {
	margin: 15px 0;
	font-weight: bold;
}
.card {
	color: #333;
}
.card-text .fa {
	font-size: 2.5em;
}
footer {
	bottom: 0;
	min-width: 100%;
	text-align: center
}
section+section {
	padding: 75px 0;
}
section > h1.code {
	text-align: center;
	margin-bottom: 35px
}
nav.navbar {
	 background-color: rgba(10,  21,  34, 0.95);
	 color: #FFF;
}
footer ul li:not(:last-child) {
	margin-right: 7px
}
footer ul li a i.fa-facebook-official {
	color: #3b5998;
}
footer ul li a i.fa-twitter {
	color: #1da1f2;
}
footer ul li a i.fa-linkedin-square {
	color: #0077b5;
}
footer ul li a {
	font-size: 2em;
	color: #fff;
}
footer ul li a i {
	transform: scale(1);
	transition: 0.25s transform cubic-bezier(0.28, -0.47, 0.89, 1.97)
}
footer ul li a:hover {
	color: inherit;
}
footer ul li a:hover i {
	transform: scale(1.25)
}
#timeline {
	padding: 30px 10px;
	position: relative;
	color: #333;
	list-style: none;
}
#timeline:before {
    top: 0;
    bottom: 0;
    position: absolute;
    content: " ";
    width: 5px;
    background-color: #4e5c6a;
    left: 50%;
    margin-left: -2.5px;
}
#timeline > li {
	margin-bottom: 20px;
	position: relative;
}
#timeline > li:after {
	clear: both;
}
#timeline > li:before, #timeline >li:after {
	content: " ";
	display: table;
}
#timeline li .timeline-badge {
	color: #0b1520;
	width: 50px;
	line-height: 50px;
	font-size: 30px;
	text-align: center;
	position: absolute;
	top: 16px;
	left: 50%;
	margin-left: -25px;
	background-color: #f2f2f2;
	border-radius: 50%;
	box-shadow: 0px 0px 10px 5px rgba(0, 0, 0, 0.54)
}
#timeline li .timeline-badge i.fa.fa-building {
	padding-left:1px
}
.timeline-panel-container {
	width: 50%;
	float: left;
}
.timeline-panel-container-inverted {
	width: 50%;
	float: right;
}
.timeline-panel {
	width: 90%;
	float: right;
	margin-right: 50px;
	border: 1px solid #b3b3b3;
	border-radius: 7px;
	padding: 15px;
	position: relative;
	box-shadow: 0 1px 6px rgba(0, 0, 0, 0.175);
	background: #FFF;
}
.timeline-panel-container-inverted .timeline-panel {
	float: left;
	margin-left: 50px;
}
.timeline-panel:after {
	position:absolute;
	top: 27px;
	right: -14px;
	display: inline-block;
	border-top: 14px solid transparent;
	border-left: 14px solid #FFF;
	border-right: 0 solid #FFF;
	border-bottom: 14px solid transparent;
	content: " ";
}
.timeline-panel-container-inverted .timeline-panel:after {
	border-left-width: 0;
	border-right-width: 14px;
	left: -14px;
	right: auto;
}
.timeline-heading h3 {
	margin-top: 5px;
	font-size: 20px;
}
.timeline-heading h4 {
	color: #505050;
}
.timeline-body > ul > li {
	margin-bottom:1rem;
}
#training .fa-graduation-cap {
	transform: rotate(-10deg);
}
@media all and (min-width:800px) {
	#me .row:first-child {
		min-height: 96vh;
	}
}
@media print {
	body {
		font-size: 11px;
	}
	section+section {
		padding: 15px 0px
	}
	#me .row:first-child {
		min-height:75vh;
	}
	#experiences .row > .col-lg-8 {
		max-width: 100% !important;
		flex: 0 0 100% !important
	}
	section+section {
		page-break-after : auto;
	}
	 .timeline-panel {
		 page-break-after: avoid;
	 }
	.collapse {
	    display: block !important;
	    height: auto !important;
	}
	.timeline-panel-container-inverted, .timeline-panel, .timeline-panel-container {
		float: none !important;
		width: 100% !important;
	}
	.timeline-panel {
		margin: 0 !important;
	}
	#timeline > li:before, #timeline >li:after {
		display: none !important;
	}
	#timeline {
		position: relative !important;
	}
	#timeline li .timeline-badge {
		display: none;
	}
	#experiences .row > .col-lg-8 {
		max-width: 100% !important;
		flex: 0 0 100% !important;
	}

}