/* 0.0 Global */

body {
	padding: 0;
	margin: 0;
	background: #cfdadc;
}
.nopadding {
   padding: 0 !important;
   margin: 0 !important;
}
.sectionblock {
	padding: 3em;
	margin: 0;
}

/* 0.1 Typography */

p, a, h1, h2, h3 {
	color: #f0e5d1;
}
p, a {
	font-family: 'Fira Sans', sans-serif;
}
h1 {
	font-size: 48px;
}
h1, h2, h3 {
	font-family: 'Bree Serif', serif;
	text-transform: lowercase;
	font-weight: normal;
}
h2 {
	margin-bottom: 34px;
}
h1:after, h2:after {
	content: ".";
}

/* 0.2 Navigation */

#topnav {
	position: fixed;
	margin: auto;
	width: 100%;
	transition: 1s;
}
.nav-link, .navbar-brand {
	color: #464a4a;
	cursor: pointer;
	text-transform: uppercase;
	font-weight: normal;
	font-size: 14px;
}
.nav-link {
	margin-right: 1em !important;
}
.nav-link:hover {
	color: #686d6e;
}
.navbar-social {
	justify-content: flex-end;
}
#navbar-main {
	border-bottom: 2px solid rgba(70, 70, 74, .15);
	margin-right: 38%;
}
.social-link {
	padding-right: 14px;
}
.vanish {
	opacity: 0;
	pointer-events: none;
}

/* 1.0 Jumbotron */

#jtron {
	min-height: 710px;
}

/* 1.1 Parallax */

.parallax-window {
	background-attachment: inherit; 
	background-position: left bottom;
	background-repeat: repeat;
	background-size: cover;
}

/* 1.3 Intro Message */

#intromsg {
	width: 80%;
	height: 80%;
	margin-top: 60px;
	margin-left: 6%;
}

/* 2.0 About */

#about {
	background-color: #a14760;
	min-height: 400px;
}
#about-profile {
    width: 460px;
    margin-top: -140px;
    text-align: center;
    margin: auto;
    border: 10px solid #f0e5d1;
    border-radius: 500px;
    -webkit-border-radius: 500px;
    -moz-border-radius: 500px;
}
#about button {
	background: #7d1d38;
	border-color: #7d1d38;
}
#about button:hover {
	opacity: .9;
}

/* 3.0 Video */

#video-old {
	background: url(../images/video.jpg) #1a463c no-repeat;
	background-position: center bottom;
	background-size: 100%;
}
#video {
	background: url(../images/video.jpg) #1a463c no-repeat;
	background-position: center bottom;
	background-size: 100%;	
}
.videotag {
	font-size: 12px !important;
	margin-top: 8px;
	margin-bottom: 20px;
	color: #f0e5d1;
}
.flex-container {
	display: flex;
	flex-wrap: wrap;
	margin-right: auto;
	margin-left: auto;
}
.flex-container > div {
	min-width: 300px;
	text-align: left;
}

/* 4.0 Voice */

#voice {
	background-color: #263d61;
}
.audioclip {
	padding-bottom: 60px;
	display: block;
	width: 100%;
	margin: 0;
}
.audioheader {
	line-height: 86px;
}
.audioimg {
	height: 80px;
	background: url(../images/audio-bg.png) repeat-x;
	background-position: right 9px bottom 0;
	text-align: center;
	margin: auto;
}


/* 4.1 AudioPlayer (see css/audioplayer.css) */

/* 5.0 Podcasts */

#podcasts {
	background: url(../images/podcasts-bg.png) repeat;
}
#podcasts-logo {
    padding-right: 30px;
    min-height: 400px;
    text-align: left;
    margin: auto;
}
.podcasts-desc {
	max-width: 600px;
}
#podcasts-content img {
	margin-bottom: 10px;
}
#podcasts-content img:hover {
	opacity: 0.7;
}
/* 6.0 Photos */

.photo-gallery {
  color:#313437;
  background-color:#fff;
}

.photo-gallery p {
  color:#7d8285;
}

.photo-gallery h2 {
  font-weight:bold;
  margin-bottom:40px;
  padding-top:40px;
  color:inherit;
}

@media (max-width:767px) {
  .photo-gallery h2 {
    margin-bottom:25px;
    padding-top:25px;
    font-size:24px;
  }
}

.photo-gallery .intro {
  font-size:16px;
  max-width:500px;
  margin:0 auto 40px;
}

.photo-gallery .intro p {
  margin-bottom:0;
}

.photo-gallery .photos {
  padding-bottom:20px;
}

.photo-gallery .item {
  padding-bottom:30px;
}

/* 6.0 Footer */

#contact {
	background-color: #333;
	min-height: 400px;
}

/* 9.0 – All Slim Media */

@media only screen and (max-width: 1026px) {
	.navbar-brand {display: none;}
	#navbar-main { margin-right: 20%; }
}

/* 9.1 – Desktop Slim */

@media only screen and (min-width: 768px) and (max-width: 1026px) {

}

/* 9.2 - Common Mobile/Tablet */

@media only screen and (min-width: 10px) and (max-width: 797px) {

	#about-profile { 
		text-align: center;
		width: 400px;
		border-radius: 360px;
	    -webkit-border-radius: 360px;
	    -moz-border-radius: 360px;
	}
	.flex-container > div { min-width: 300px; }
}

/* 9.3 - Tablet Landscape */

@media only screen and (min-width: 600px) and (max-width: 797px) {
	.sectionblock { padding: 2em; }	
	#topnav { background-color: #595c5f; }
	#intromsg img { width: 50% !important; }
	#navbar-main { border: none; }
	.navbar-nav { margin-left: 16px;}
	.nav-link { color: #cececf; }
	#about-profile { 
		width: 420px;
	}
	#about-profile img {
		width: 400px;
	}
	.flex-container > div { min-width: 200px; }
}

/* 9.4 - Mobile Landscape */

@media only screen and (min-width: 510px) and (max-width: 629px) {
	.sectionblock { padding: 2em; }
	.videotag { 	padding-bottom: 18px; }
	#jtron { background: none;  }
	.parallax-window { background: none; }
	#intromsg img { width: 60% !important; }
	#topnav { background-color: #595c5f; }
	#navbar-main { border: none; }
	.navbar-nav { margin-left: 16px;}
	.nav-link { color: #cececf; }	
	#about-profile { 
		width: 420px;
	}
	#about-profile img {
		width: 400px;
	}
	.flex-container > div { min-width: 200px; }
}

/* 9.5 - Mobile Portrait */

@media only screen and (min-width: 0px) and (max-width: 509px) {
	.sectionblock { padding: 1em; }
	.videotag { 	padding-bottom: 18px; }
	#intromsg { margin: 20px 10px; width: 50%; height: 50%; }	
	#intromsg img { margin-right: -120px; width: 100% !important; }
	#jtron { min-height: 546px; margin-top: 19px; }
	.parallax-window { background: url('../images/banner-jeff.jpg') top no-repeat !important; }
	#topnav { background-color: #595c5f; margin-top: -19px; }
	#navbar-main { border: none; }
	.navbar-nav { margin-left: 16px;}
	.nav-link { color: #cececf; }	
	#about-profile { 
		width: 300px;
	}
	#about-profile img {
		width: 280px;
	}
	.flex-container > div { min-width: 300px; }
}