/*  
Theme Name: Speaker Theme
Theme URI: http://www.J16Media.com/
Description: A WordPress Theme for professional speakers
Version: 0.1
Author: Alexander Quinonez
Author URI: http://www.J16Media.com
*/

@import url('http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css');
@import url(http://fonts.googleapis.com/css?family=Source+Sans+Pro:200,400,700,200italic,300italic,700italic);
@import url(css/animate.min.css);

html, html a {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
body{
	font-family: 'Source Sans Pro', sans-serif;
	font-weight: 400;
	color: #777;
	font-size: 16px;
	line-height: 1.75em;
}
strong{
	font-weight: 700;
}
p{
	margin-bottom: 20px;
}
a{
	-webkit-transition: all 0.4s ease-in-out;
	-moz-transition: all 0.4s ease-in-out;
	-o-transition: all 0.4s ease-in-out;
	transition: all 0.4s ease-in-out;
}
a.btn{
	border: 5px solid;
	border-radius: 0px;
}
.full-header{
	position: relative;
	height: auto;
	margin: -20px -20px 0;
	padding: 55px 0;
}
.full-header h2{
  	text-align: center;
  	margin: 0;
  	color: #fff;
  	font-weight: 200;
  	font-style: italic;
  	text-transform: uppercase;
  	font-size: 9em;
  	line-height: .7em;
  	letter-spacing: -.07em;
}
.full-header h2 strong{
	font-weight: 700;
	font-style: normal;
	letter-spacing: 0em;
}
/** NAV **/
.navbar-wrapper{
	position: absolute;
	height: auto;
	top: 10px;
	right: 0;
	left: 0;
	z-index: 2000;
	-webkit-animation-duration: .5s;
	-webkit-animation-delay: .5s;
}
a.navbar-brand{
	height: auto;
	width: auto;
	padding: 5px;
	font-size: 1.125em;
	text-align: center;
	text-transform: uppercase;
	font-style: italic;
}
a.navbar-brand span{
	width: auto;
	color: #fff;
	white-space: nowrap;
}
.navbar-inverse{
	background: none;
	border: none;
}
#navbar{
	float: right;
}
#navbar ul {
	margin-top: 30px;
	float: left;
}
#navbar ul li a{
	line-height: 50px;
	padding: 0 7px;
}
.navbar-inverse .navbar-nav>li>a{
	color: #fff;
	font-weight: 400;
	padding-left: 7px;
	padding-right: 7px;
	letter-spacing: .04em;
	font-size: 1em;
}
ul.navbar-nav:hover a,
ul.sm:hover a{
	opacity: 0.5;
}
ul.navbar-nav:hover a:hover,
ul.sm:hover a:hover{
	opacity: 1;
}
ul.sm{
	padding-left: 0px;
}
ul.sm li{
	list-style: none;
	float: left;
}
ul.sm li a{
	color: #fff;
	padding: 15px 7px;
	font-size: 1.25em;
}
.navbar-wrapper.affix{
	position: fixed;
	top: 0;
	background: #03285b;
	padding-top: 10px;
	-webkit-transition: background-color 0.2s ease-in-out;
	-moz-transition: background-color 0.2s ease-in-out;
	-o-transition: background-color 0.2s ease-in-out;
	transition: background-color 0.2s ease-in-out;
}
.navbar-wrapper.affix-top{
	-webkit-transition: background-color 0.2s ease-in-out;
	-moz-transition: background-color 0.2s ease-in-out;
	-o-transition: background-color 0.2s ease-in-out;
	transition: background-color 0.2s ease-in-out;
}
.navbar-wrapper.affix .navbar{
	margin-bottom: 0px;
}
.navbar-wrapper.affix .navbar-brand{
	padding: 0;
}
.navbar-wrapper.affix  a.navbar-brand img{
	width: 160px;
}
.navbar-wrapper.affix .navbar-brand span{
  	display: none;
}
.navbar-wrapper.affix #navbar ul {
  margin-top: 10px;
}
.st-anchor {
  width: 0px;
  height: 0px;
  position: relative;
  display: block;
  overflow: hidden;
  visibility: hidden;
  top: -100px;
}
section{
	padding: 20px;
}
section h2{
	font-size: 4em;
	line-height: 1em;
	color: #03285b;
	text-align: center;
	text-transform: uppercase;
	font-weight: 700;
	letter-spacing: -.05em;
	margin-bottom: 30px;
}
/** NAV **/
/** VIDEO PLAYER **/
#video-player{
	position: fixed;
	top: 0px;
	left: 0px;
	bottom: 0px;
	right: 0px;
	background-color: rgba(0,0,0,.8);
	z-index: 2500;
	display: none;
}
.video-play{
	left: 0;
	right: 0;
	position: absolute;
	height: auto;
	max-width: 87%;
	margin: 25px auto;
}
.embedvid{
	position: relative; 
	padding-bottom: 56.25%; 
	height: 0; 
	overflow: hidden; 
	max-width: 100%;
}
.video-play iframe{
	position: absolute; 
	top: 0; 
	left: 0; 
	width: 100%; 
	height: 100%; 
}
.video-play a.close{
	font-size: 20px;
	z-index: 3000;
	position: absolute;
	left: -10px;
	top: -10px;
	opacity: 1;
	text-shadow: none;
	background: #03285b;
	line-height: 28px;
	width: 30px;
	height: 30px;
	text-align: center;
	border: 1px solid #fff;
	color: #fff;
	display: block;
}
.video-play a.close:hover{
	background: #fff;
	border: 1px solid #03285b;
}
.video-play a.close:hover{
	color: #03285b;
}
/** VIDEO PLAYER **/
/** HERO **/
#hero{
	height: 100vh;
	background: url(images/hero-bg.jpg);
	background-size: cover;
	padding-top: 150px;
	padding-bottom: 0;
	overflow: hidden;
	padding-left: 0;
	padding-right: 0;
	max-height: 800px;
}
.video-thumb{
	position: relative;
    margin: 50px 0 0 0;
    border: 10px solid #fff;
    width: 550px;
    height: 300px;
    overflow: hidden;
    z-index: 2;
    float: left;
    -webkit-box-shadow: 0px 0px 10px 5px rgba(0,0,0,0.24);
    -moz-box-shadow: 0px 0px 10px 5px rgba(0,0,0,0.24);
    box-shadow: 0px 0px 10px 5px rgba(0,0,0,0.24); 
    -webkit-animation-duration: .5s;
	-webkit-animation-delay: 1s;  
}
.video-thumb a .play-btn{
	position: relative;
	z-index: 1000;
	width: 100%;
	height: 200px;
	margin-top: 40px;
	-webkit-transition: all 0.1s ease-in-out;
	-moz-transition: all 0.1s ease-in-out;
	-o-transition: all 0.1s ease-in-out;
	transition: all 0.1s ease-in-out;
}
.video-thumb a .play-btn img{
	margin: auto;
	max-height: 100%;
}
.video-thumb a:hover .play-btn{
	height: 220px;
	margin-top: 30px;
}
.video-thumb a .play-thumb{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 100;
}
.video-thumb a .play-thumb img{
	opacity: 1;	
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}
.video-thumb a:hover .play-thumb img{
	opacity: .0;
}
.video-thumb iframe{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
}
.motto{
	float: left;
	clear: both;
	margin-top: 25px;
	width: 550px;
	-webkit-animation-duration: .5s;
	-webkit-animation-delay: 1s;
	z-index: 100;
	position: relative;
}
.motto p{
	color: #fff;
	text-align: center;
	font-size: 2em;
	line-height: 1.25em;
	font-weight: 400;
	font-style: italic;
	margin-bottom: 25px;
	text-transform: uppercase;
}
.motto a.btn{
	margin: auto;
	text-align: center;
	color: #fff;
	border-color: #fff;
	font-size: 35px;
	text-transform: uppercase;
	font-weight: 200;
	padding-left: 25px;
	padding-right: 25px;
}
.motto a.btn:hover{
	color: #03285b;
	background: #fff;
}
.reggie-thumb{
	position: absolute;
	width: 425px;
	right: 0;
	-webkit-animation-duration: .5s;
	-webkit-animation-delay: 1s;
}
#book-ad{
	background: url(images/book-ad-bg.jpg);
	background-position: center center;
	height: 300px;
	padding-top: 25px;
	padding-bottom: 25px;
	border-top: 10px solid #b59771;
	border-bottom: 10px solid #b59771;
}
#book-ad img{
	margin: auto;
}
#book-ad a.book-btn{
	width: 225px;
	margin: 15px auto;
	display: block;
	-webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
    color: #b59771;
    border: 5px solid #b59771;
    text-align: center;
    text-transform: uppercase;
    font-size: 25px;
    padding: 10px;
}
#book-ad a.book-btn:hover{
	border-color: #fff;
	color: #fff;
	text-decoration: none;
}
/** HERO **/
/** STORY **/
#story{
	background: #fff;
	height: auto;
}
#story .container{
	margin-top: 50px;
	margin-bottom: 50px;
}
/** STORY **/
/** MISSION **/
#mission{
	height: auto;
}
#mission h2,
#schedule-reggie-dabbs h2{
	text-align: right;
	font-size: 6em;
	line-height: 0.75em;;
	color: #fff;
	margin: 0;
	font-weight: 200;
	font-style: italic;
	text-transform: uppercase;
	letter-spacing: -.07em;
	margin-top: 160px;
}
#mission h2 strong,
#schedule-reggie-dabbs h2 strong{
	font-weight: 700;
	font-style: normal;
	letter-spacing: 0em;
}
#mission h3,
#endorsements h3{
	font-weight: 700;
	font-style: italic;
	font-size: 32px;
	margin-top: 0px;
	line-height: 30px;
	color: #03285b;
	text-transform: uppercase;
}
#mission .content{
	color: #03285b;
}
/** MISSION **/
/** ENDORSEMENTS **/
#endorsements{
	background: #fff;
	height: auto;
}

/** ENDORSEMENTS **/
/** SCHEDULE **/
#schedule-reggie-dabbs{
	color: #fff;
}
#schedule-reggie-dabbs a{
	color: #fff;
	opacity: 1;
}
#schedule-reggie-dabbs a:hover{
	opacity: .5;
	text-decoration: none;
}
#schedule-reggie-dabbs p{
	font-size: 1.75em;
}
#schedule-reggie-dabbs .content{
	padding:100px 0;
}
/** SCHEDULE **/
/** PRESS **/
#press-kit{
	background: #eeeeee;
}
#press-kit a.btn{
	font-size: 1.25em;
	line-height: 1;
	color: #03285b;
	border-color: #03285b;
	font-weight: 700;
	text-transform: uppercase;
}
#press-kit a.btn:hover{
	color: #fff;
	background: #03285b;
}
/** PRESS **/
/** FOOTER **/
#footer{
	background: #fff;
	color: #03285b;
}
#footer .copyright{
	font-style: italic;
	font-weight: 400;
	line-height: 50px;
}
#footer .credits{
	float: right;
}
#footer .site-credit{
	text-align: right;
	float: left;
	line-height: 1em;
	margin-top: 10px;
}
#footer .site-credit a{
	color: #03285b;
}
#footer .j16-logo{
	float: left;
	height: 50px;
	margin-left: 10px;
}
#footer .j16-logo img{
	max-height: 100%;
}
/** FOOTER **/
@media  (min-width: 768px) and (max-width: 991px) {
	.navbar-header{
		width: 310px;
		float: none;
		margin: auto !important;	
	}
	.navbar-brand>img{
		margin: auto;
	}
	#navbar {
		float: none;
  		text-align: center;
	}
	#navbar ul{
		margin-top: 0;
		margin-bottom: 0;
		display: inline-block;
		float: none;
	}
	.container{
		width: auto;
	}
	.navbar-wrapper.affix .navbar .container{
		padding: 0;
	}
	.navbar-wrapper.affix .navbar>.container .navbar-brand{
		margin-left: 0px;
	}
	.navbar-wrapper.affix .container{
		width: 100%;
	}
	.navbar-wrapper.affix .navbar-header{
		width: auto;
		float: left;
	}
	.navbar-wrapper.affix #navbar{
		float: right;
		padding: 0;
	}
	.navbar-wrapper.affix #navbar ul li a{
		padding: 0 4px;
	}
	#hero{
		padding-top: 190px;
	}
	#hero .container{
		width: 90%;
	}
	.video-thumb{
		width: 60%;
		height: 225px;
	}
	.video-thumb a .play-btn {
		height: 160px;
		margin-top: 20px;
  	}
  	.video-thumb a:hover .play-btn {
		height: 180px;
		margin-top: 10px;
  	}
  	.motto{
	  	width: 60%;
	  	margin-top: 10px;
  	}
  	.motto p{	
	  	font-size: 1.5em;
  	}
}
@media (max-width: 767px) {
	#navbar{
		float: none;
	}
	#navbar ul{
		float: none;
		margin-top: 0;
	}
	.navbar-nav{
		margin: 0;
	}
	.nav>li {
		position: relative;
  		display: block;
  		text-align: center;
  		font-size: 1.25em;
	}
	ul.sm{
		text-align: center;
	}
	ul.sm li {
  		float: none;
  		display: inline-block;
	}
	.navbar-wrapper{
		top: 0;
	}
	.navbar{
		margin-bottom: 0px;
	}
	a.navbar-brand{
		width: 150px;
		height: 60px;
		font-size: 1em;
	}
	a.navbar-brand span{
		position: absolute;
		width: 100%;
		margin-top: 5px;
		left: 0;
	}
	.navbar-toggle{
		margin-right: 0;
		margin-top: 14px;
		border-radius: 0px;
	}
	.navbar-inverse .navbar-toggle{
		border-color: #fff;		
	}
	.navbar-inverse .navbar-collapse{
		border-color: #121F5E;
	}
	.navbar-collapse{
		background: #03285b;
		margin-top: 25px;
	}
	.container>.navbar-collapse{
		margin-left: -30px;
		margin-right: -30px;
	}
	.navbar-inverse .navbar-toggle:focus, 
	.navbar-inverse .navbar-toggle:hover{
		background: #03285b;
	}
	.navbar-wrapper.affix{
		padding-bottom: 10px;
	}
	.navbar-wrapper.affix a.navbar-brand img {
		height: auto;
	}
	.navbar-wrapper.affix .navbar-collapse{
		margin-top: 15px;
	}
	section h2{
		font-size: 2em;
	}
	#hero{
		height: auto;
		padding-top: 100px;
	}
	#hero .container{
		padding-left: 0;
		padding-right: 0;
	}
	#book-ad{
		height: auto;
	}
	.st-anchor{
		top: -90px;
	}
	.reggie-thumb{
		width: 350px;
	}
	.full-header h2{
		font-size: 7em;
	}
	#mission {
		background-position: left top !important;
	}
	#mission h2,
	#schedule-reggie-dabbs h2{
		text-align: center;
		margin-top: 0px;
	}
	#mission h3{
		font-weight: 700;
		font-style: italic;
		font-size: 25px;
		line-height: 25px;
		text-align: center;
		color: #fff;
	}
	#mission .content{
		color: #fff;
	}
	#press-kit img{
		margin: auto;
	}
	#schedule-reggie-dabbs{
		text-align: center;
	}
	#schedule-reggie-dabbs .content{
		padding-top: 20px;
		padding-bottom: 20px;
	}
	#schedule-reggie-dabbs p{
		font-size: 1em;
	}
	#footer{
		height: auto;
		padding: 0;
	}
	#footer .copyright {
	  font-style: italic;
	  line-height: 1em;
	  padding: 20px;
	  text-align: center;
	}
	#footer .credits{
		float: none;
	}
	#footer .site-credit,
	#footer .j16-logo{
		text-align: center;
		float: none;
		margin-top: 0px;
	}
	#footer .j16-logo img{
		margin: auto;
		padding: 10px 0 20px 0;
		box-sizing: content-box;
	}
}
@media (min-width: 601px) and (max-width: 991px) {
	.video-thumb{
		width: 60%;
		height: 225px;
		margin-left: 20px;
	}
	.video-thumb a .play-btn {
		height: 160px;
		margin-top: 20px;
  	}
  	.video-thumb a:hover .play-btn {
		height: 180px;
		margin-top: 10px;
  	}
  	.motto{
	  	width: 60%;
	  	margin-top: 10px;
	  	  margin-left: 20px;
  	}
  	.motto p{	
	  	font-size: 1.5em;
  	}
}
@media (min-width: 601px) and (max-width: 667px) {
	.video-thumb{
		height: 200px;
	}
	.video-thumb a .play-btn{
		height: 140px;
	}
	.video-thumb a:hover .play-btn{
		height: 150px;
	}
}
@media (max-width: 600px){
	.video-thumb{
		margin-top: 250px;
		width: 100%;
		height: 150px;
		border: 0px;
	}
	.video-thumb a .play-btn,
	.video-thumb a:hover .play-btn{
		height: 100px;
		margin-top: 25px;
	}
	.video-thumb a:hover .play-thumb img{
		opacity: 1;
	}
	.reggie-thumb{
		width: 95%;
		left: 0;
		right: 0;
		margin: auto;
		top: -10px;
	}
	.reggie-thumb img{
		margin: auto;
	}
	.motto{
		width: 100%;
		padding: 15px 15px 0;
		background: #03285b;
		margin-top: 0px;
	}
	.motto p{
		font-size: 1.5em;
		line-height: 1em;
		margin-bottom: 15px;
	}
	.full-header h2{
		font-size: 4em;
	}
	#mission{
		background-position: -250px top !important;
	}
	#mission h2, 
	#schedule-reggie-dabbs h2{
		font-size: 4em;	
	}
}