body{
    font-family:'Open Sans',serif;padding-top:54px;color:#868e96}

@media (min-width:992px){
    body{
    padding-top:0;padding-left:17rem}
}

h1,h2,h3,h4,h5,h6{
    font-family:'Saira Extra Condensed',serif;font-weight:700;text-transform:uppercase;color:#1d2022}

h1{
    font-size:6rem;line-height:5.5rem}

h2{
    font-size:3.5rem}

.subheading{
    text-transform:uppercase;font-weight:500;font-family: 'Saira Extra Condensed', sans-serif;font-size:1.35rem}

.list-social-icons a{
    color:#495057}

.list-social-icons a:hover{
    color:#bd5d38}

.list-social-icons a .fa-lg{
    font-size:1.75rem}

.list-icons{
    font-size:3rem}

.list-icons .list-inline-item i:hover{
    color:#bd5d38}

#sideNav .navbar-nav .nav-item .nav-link{
    font-weight:600;text-transform:uppercase}

@media (min-width:992px){
    #sideNav{
    text-align:center;position:fixed;top:0;left:0;display:flex;flex-direction:column;width:17rem;height:100vh}

#sideNav .navbar-brand{
    display:flex;margin:auto auto 0;padding:.5rem}

#sideNav .navbar-brand .img-profile{
    max-width:10rem;max-height:10rem;border:.5rem solid rgba(255,255,255,.2)}

#sideNav .navbar-collapse{
    display:flex;align-items:flex-start;flex-grow:0;width:100%;margin-bottom:auto}

#sideNav .navbar-collapse .navbar-nav{
    flex-direction:column;width:100%}

#sideNav .navbar-collapse .navbar-nav .nav-item{
    display:block}

#sideNav .navbar-collapse .navbar-nav .nav-item .nav-link{
    display:block}

}

section.resume-section{
    border-bottom:1px solid #dee2e6;padding-top:5rem!important;padding-bottom:5rem!important}

section.resume-section .resume-item .resume-date{
    min-width:none}

@media (min-width:768px){
    section.resume-section{
    min-height:100vh}

section.resume-section .resume-item .resume-date{
    min-width:18rem}

}

@media (min-width:992px){
    section.resume-section{
    padding-top:3rem!important;padding-bottom:3rem!important}

}

.bg-primary{
    background-color:#4d3b34!important}

.text-primary{
    color:#bd5d38!important}

a{
    color:#bd5d38}

a:active,a:focus,a:hover{
    color:#824027}

.project1:hover {
    z-index: 1;
}
.project2:hover {
    z-index: 1;
}
.project3:hover {
    z-index: 1;
}
.project4:hover {
    z-index: 1;
}

.buttonDownload {
	display: inline-block;
	position: relative;
	padding: 10px 25px;
  
	background-color:  rgb(224, 106, 15);
	color: white;
  
	font-family: sans-serif;
	text-decoration: none;
	font-size: 0.9em;
	text-align: center;
	text-indent: 15px;
}

.buttonDownload:hover {
	background-color: #333;
	color: white;
}

.buttonDownload:before, .buttonDownload:after {
	content: '';
	display: block;
	position: absolute;
	left: 15px;
	top: 52%;
}

/* Download box shape  */
.buttonDownload:before {
	width: 10px;
	height: 2px;
	border-style: solid;
	border-width: 0 2px 2px;
}

/* Download arrow shape */
.buttonDownload:after {
	width: 0;
	height: 0;
	margin-left: 1.5px;
	margin-top: -7px;
  
	border-style: solid;
	border-width: 4px 4px 0 4px;
	border-color: transparent;
	border-top-color: inherit;
	
	animation: downloadArrow 2s linear infinite;
	animation-play-state: paused;
}

.buttonDownload:hover:before {
	border-color:  rgb(224, 106, 15);
}

.buttonDownload:hover:after {
	border-top-color: rgb(224, 106, 15);
	animation-play-state: running;
}

/* keyframes for the download icon anim */
@keyframes downloadArrow {
	/* 0% and 0.001% keyframes used as a hackish way of having the button frozen on a nice looking frame by default */
	0% {
		margin-top: -7px;
		opacity: 1;
	}
	
	0.001% {
		margin-top: -15px;
		opacity: 0;
	}
	
	50% {
		opacity: 1;
	}
	
	100% {
		margin-top: 0;
		opacity: 0;
	}
}