body {
  font-family: 'Muli', sans-serif;
}

header {

}

.jumbotron-home {
  height: 100vh;
  /*min-height: 300px;*/
  background: no-repeat left center scroll;
  background-size: cover;
		display: flex;
  align-items: center;
}

.jumbotron-home h1 {
  font-family: 'Merriweather', serif;
  font-size: 36pt;
		color: #fff;
		padding-top: 10px;
}

.jumbotron-home h1 small {
  font-family: 'Muli', sans-serif;
  font-size: 14pt;
		display: block;
		color: #ccc;
		margin-top: 15px;
		line-height:18pt;
}

.jumbotron-page {
  height: 50vh;
  min-height: 300px;
  background: no-repeat center center scroll;
  background-size: cover;
		display: flex;
  align-items: center;
		margin-bottom: 0px;
}

.jumbotron-page h1 {
  font-family: 'Merriweather', serif;
  font-size: 36pt;
		color: #fff;
		padding-top: 10px;
		text-align: center;
}
.jumbotron-page h1 small {
  font-family: 'Muli', sans-serif;
  font-size: 14pt;
		display: block;
		color: #ccc;
		margin-top: 0px;
		line-height:18pt;
}

.home nav {  
		background-color: transparent;
		transition: background-color 100ms linear;
}

nav {
  background-color: rgba(0,0,0,0.3);
}

.navbar .nav-item .nav-link {
  font-size: 12pt;
		color: #fff;
		padding: 5px 15px;
}

.navbar .nav-item .nav-link:hover {
  color: #000;
}

.navbar .nav-item a:hover {
	 color: #111;
		background-color: #fff;
		transition: background-color 200ms linear;
}

.navbar-brand img {
  height: 50px;
		padding: 0px;
}

.navbar-toggler-icon {
  color: #fff;
}

.navbar.scrolled {
  background-color: rgba(0,0,0,0.8);
  transition: background-color 100ms linear;
}

.navbar.scrolled .nav-link {
  color:#fff;
}

.social {
  display: inline-block
}

.calltoaction {
  display: inline-block;
		text-align: right;
}

footer {
  background-color: #3a3e44;
		padding: 40px;
}

footer .social {
  padding: 10px;
		margin-bottom: 10px;
}

footer .social a,
footer .social a:hover {
  color: #ccc;
		/*border: 1px solid #777;*/
		padding: 10px 7px;
		/*border-radius: 50%;*/
		margin: 0px 3px;
}

footer p {
  font-size: 8pt;
}

footer h6 {
  color: #555;
		margin: 0px 0px 3px;
}

footer h6 a,
footer h6 a:hover {
  color: #aaa;
		font-size: 9pt;
		margin: 0px 3px;
		text-decoration: none;
}

section {
  padding: 50px 0;
}

.section-light {
  background-color: #eee;
}

.section-dark {
  background-color: #656b75;
}

.section-topbar {
  background-color: #656b75;
		height: 76px;
}

section h3 {
  font-weight: normal;
		font-size: 18pt;
}

section h3 small {
  display: block;
		font-size: 11pt;
		color: #888;
		margin-top: 5px;
		font-style: italic;
}

section .lead {
  color: #555;
}

@media (max-width: 575.98px) {
  
  .home nav {  
		  background-color: rgba(0,0,0,0.8);
  }
  nav {  
		  background-color: rgba(0,0,0,0.8);
  }
  .navbar-brand img {
    height: 30px;
  }
		.home .jumbotron-home {
    background: no-repeat 20% 0% scroll;
				background-size: cover;
				display: flex;
    align-items: flex-end;
				padding-bottom:100px;
				text-align: center
  }
		.home .jumbotron-home h1 {
    font-size: 22pt;
  }

  .home .jumbotron-home h1 small {
    font-size: 10pt;
				line-height: 15pt;
				color: #fff;
  }
		
		.jumbotron-page h1 {
    font-size: 22pt;
				padding-top: 50px;
  }

  .jumbotron-page h1 small {
    font-size: 10pt;
				line-height: 15pt;
				color: #fff;
  }
		
		.section-topbar {
		  background-color: transparent;
				height: 30px;
		}
		
		section h2 {
		  font-size: 18pt;
		}
		
		section .lead {
		  font-size: 11pt;
		}
}

/* custom styles */
.resume_icon {
  color: #aaa;
		margin-bottom: 20px;
}