@charset "utf-8";
/* CSS Document */

 div,  span,  applet,  object,  iframe, 
h1,  h2,  h3,  h4,  h5,  h6,  p,  blockquote,  pre, 
a,  abbr,  acronym,  address,  big,  cite,  code, 
del,  dfn,  em,  img,  ins,  kbd,  q,  s,  samp, 
small,  strike,  strong,  sub,  sup,  tt,  var, 
b,  u,  i,  center, 
dl,  dt,  dd,  ol,  ul,  li, 
fieldset,  form,  label,  legend, 
table,  caption,  tbody,  tfoot,  thead,  tr,  th,  td, 
article,  aside,  canvas,  details,  embed,  
figure,  figcaption,  footer,  header,  hgroup,  
menu,  nav,  output,  ruby,  section,  summary, 
time,  mark,  audio,  video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
	position: relative;

}

/* apply a natural box layout model to all elements */

 *,  *:before, *:after {
  -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
 }
.pez-unselectable{
	-webkit-user-select: none; /* Chrome/Safari */        
	-moz-user-select: none; /* Firefox */
	-ms-user-select: none; /* IE10+ */
	
	/* Rules below not implemented in browsers yet */
	-o-user-select: none;
	user-select: none; 
 }


 /*FONTS  */
/*
@font-face {font-family:"SourceSansPro Black"; src:url("fonts/SourceSansPro-Black.otf") format("opentype");}
@font-face {font-family:"SourceSansPro BlackItalic"; src:url("fonts/SourceSansPro-BlackIt.otf") format("opentype");}
@font-face {font-family:"SourceSansPro Bold"; src:url("fonts/SourceSansPro-Bold.otf") format("opentype");}
@font-face {font-family:"SourceSansPro BoldItalic"; src:url("fonts/SourceSansPro-BoldIt.otf") format("opentype");}
@font-face {font-family:"SourceSansPro ExtraLight"; src:url("fonts/SourceSansPro-ExtraLight.otf") format("opentype");}
@font-face {font-family:"SourceSansPro ExtraLightItalic"; src:url("fonts/SourceSansPro-ExtraLightIt.otf") format("opentype");}
@font-face {font-family:"SourceSansPro Italic"; src:url("fonts/SourceSansPro-It.otf") format("opentype");}
@font-face {font-family:"SourceSansPro Light"; src:url("fonts/SourceSansPro-Light.otf") format("opentype");}
@font-face {font-family:"SourceSansPro LightItalic"; src:url("fonts/SourceSansPro-LightIt.otf") format("opentype");}
@font-face {font-family:"SourceSansPro Regular"; src:url("fonts/SourceSansPro-Regular.otf") format("opentype");}
@font-face {font-family:"SourceSansPro Semi"; src:url("fonts/SourceSansPro-Semibold.otf") format("opentype");}
@font-face {font-family:"SourceSansPro SemiItalic"; src:url("fonts/SourceSansPro-SemiboldIt.otf") format("opentype");}
@font-face {font-family:"Merriweather Black"; src:url("fonts/Merriweather-Black.ttf") format("truetype"); font-weight: normal;font-style: normal;}
@font-face {font-family:"Merriweather Bold"; src:url("fonts/Merriweather-Bold.ttf") format("truetype"); font-weight: normal;font-style: normal;}
@font-face {font-family:"Merriweather Light"; src:url("fonts/Merriweather-Light.ttf") format("truetype"); font-weight: normal;font-style: normal;}
@font-face {font-family:"Merriweather Regular"; src:url("fonts/Merriweather-Regular.ttf") format("truetype"); font-weight: normal;font-style: normal;}
@font-face {font-family:"Aachen Bold"; src:url("fonts/AachenBold-Plain.ttf.ttf") format("truetype"); font-weight: normal;font-style: normal;}
@font-face {font-family:"SourceSansPro Regular"; src:url("fonts/SourceSansPro-Regular.otf") format("opentype");}
@font-face {font-family:"SourceSansPro Black"; src:url("fonts/SourceSansPro-Black.otf") format("opentype");}
*/

@font-face {font-family:"Merriweather Regular"; src:url("fonts/Merriweather-Regular.ttf") format("truetype"); font-weight: normal;font-style: normal;}

/*@font-face {font-family:"Aachen Bold"; src:url("fonts/aachen.woff") format("woff"); font-weight: normal; font-style: normal;}*/
@font-face {font-family:"Aachen Bold"; src:url("fonts/Aachen_Bold_fg.otf") format("opentype");}

/*aachen.woff*/
@font-face {font-family:"SourceSansPro Light"; src:url("fonts/SourceSansPro-Light.otf") format("opentype");}
@font-face {font-family:"SourceSansPro Regular"; src:url("fonts/SourceSansPro-Regular.otf") format("opentype");}
@font-face {font-family:"SourceSansPro Bold"; src:url("fonts/SourceSansPro-Bold.otf") format("opentype");}

/*COLORS:

YELLOW: #ffcc00;
LIGHT GREY: #cecece;
DARK GREY: #322e2f;
*/
:root {
  --bg-yellow: #ffcc00;
  --bg-light-grey:#cecece;
  --bg-dark-grey:#322e2f;
}

/*Common bg*/
.white-text{
	color:#fff !important;
}
.yellow-text{
	color:#ffcc00 !important;
}
.light-grey-text{
	color:#cecece !important;
}
.dark-grey-text{
	color:#322e2f !important;
}
.black-text{
	color:#000 !important;
}

/*Common bg*/
.black-bg{
	background-color: #000;
}
.white-bg{
	background-color: #fff;
}
.yellow-bg{
	background-color: #ffcc00;
}
.light-grey-bg{
	background-color: #cecece;
}
.dark-grey-bg{
	background-color: #322e2f;
}

/*Common elements */

 body{
 	background: #cecece; margin: 0;
 	font-family: "Merriweather Regular";
 }
 h2{
 	font-family: "Aachen Bold";
 }
 p{
 	margin:0 30px 23px;
 	line-height: 27px;
 }
strong{
 	font-weight: bold;
 }
 a{
 	text-decoration: none;
 	color: inherit;
 }
 p a{
 	color:#BCBCBC;
 	background-color: none;
 	text-decoration: none;
 	padding:5px 0px;

 	border-bottom: 2px solid #ffcc00;
    box-shadow: inset 0 -3px 0 #ffcc00;
  
 	-webkit-transition: background-color ease-out 0.5s;
    -moz-transition: background-color ease-out 0.5s;
    -o-transition: background-color ease-out 0.5s;
    transition: background-color ease-out 0.5s;
    /*
    -webkit-transition: color 0.25s ease-out 0.5s;
    -moz-transition: color 0.25s ease-out 0.5s;
    -o-transition: color 0.25s ease-out 0.5s;
    transition: color 0.25s ease-out 0.5s;
    */
 }
 p a:hover{
 	background-color: #ffcc00;
 	color:#000;
 }
 em{
 	font-style:italic;
 }
 /* Text elements */

 .drop-cap {
    display: inline-block;
    float: left;
    margin: 2px 0px 0px;
    height: 99px;
    width: 122px;
    font-size: 107px;
    font-family: "Aachen Bold";
    line-height: 101px;
    text-indent: 27px;
    color: #ffcc00;
}
.thin-cap{
	width: 94px;
    text-indent: 40px;
}
.wide-cap{
	width: 135px;
}
 .middle-column{
 	max-width:700px; width: 100%; height: auto; display: block; position: relative;
 	margin: 0 auto;
 	background: #fff;
 	padding: 70px 20px 70px;
 	min-height: 100vh; height: auto;

 }
.fs-cover{
	width: 100%; display: block; 
	background: #000 center no-repeat;
	background-size: cover;
	border-top:10px #fff solid;
	border-bottom:10px #fff solid;
	margin-bottom:50px;
	top:0; left:0;
	position: relative;
	overflow: hidden;
}
.mobile-intro{

	width: 100%; position: absolute;
	bottom:0;
	left:0;
	font-family: "Aachen Bold";


    padding: 30px;
    font-size: 61px;
    line-height: 56px;

}

.mobile-intro div{
	margin-bottom:20px;
	opacity: 0;
}
.mobile-intro .big-text{
    font-size: 144px;
    line-height: 120px;
}
.name-text{
    font-size: 44px;
    margin-top: 10px;
    border-top: solid 4px #fff;
    padding-top: 5px;
}

 .intro-btn{
	font-family: "Aachen Bold"; font-size: 28px; color:#ffcc00;
	display: block;
	background: rgba(0, 0, 0, 0) none repeat scroll 0% 0%;
	cursor: pointer;
	width: 260px;	height: 62px;
	padding: 10px;
	text-align: center;
	position: absolute;
	margin: 0px auto;
	left: 0px;	right: 0px;	bottom: 20px;
	z-index: 90;
	text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.57);
	border-radius: 32px;
	-webkit-transition: background-color ease-out 0.5s;
    -moz-transition: background-color ease-out 0.5s;
    -o-transition: background-color ease-out 0.5s;
    transition: background-color ease-out 0.5s;
 }
.intro-video{
	position: absolute;
}
 .intro-btn:hover{
 	background: rgba(0,0,0,0.8);
 }
.top-bar{
	width: 100%; height: 35px; background: #fff;
	position: fixed; top:0; left:0; z-index: 100;
}
#preloader{
	height:110vh;
	width: 100%; position: fixed; z-index: 110;
	background: #cecece; top:0; left:0;
}
#preloader img{
	margin: auto; top:0; left:0; right:0;  bottom:0;
	position: absolute;
}
.end-par{
    margin: 50px 30px 100px;
    font-family: "Aachen Bold";
    font-size: 24px;
    line-height: 25px;

}
.info-box{
    margin: 0;
    font-size: 12.5px;
    line-height: 16px;
    background: #fff;
    padding: 20px 30px;
    margin: 0 0 0 -5%;
    width: 100%;
    max-width: 700px;
    margin: 0 auto;
    left: 0;
    right: 0;
}
.info-box a{
	box-shadow: none;
	text-decoration: none;
	font-style: italic;
	color:#000;
	padding: 0;
}
.info-box p{
	padding: 0;
	margin:0 0 10px;
	line-height: inherit;
}

@media screen and (max-width: 700px){
	p a{
		box-shadow: none;
    	padding: 0;
	}
	.drop-cap {
	  
	    margin: -3px 0px 0px;
	    height: 99px;
	    width: 92px;
	    font-size: 97px;
	    line-height: 101px;
	    text-indent: 3px;

	}
	.thin-cap{
		width: 55px !important;
	}
	.wide-cap{
		width: 103px !important;
	}
	p{
		margin: 0px 0px 23px;
		font-size: 15px;
    	line-height: 20px;
	}
	.middle-column{
		 	overflow: hidden;
	}
	.mobile-intro{
		padding:20px;
		font-size: 31px;
    	line-height: 32px;
	}
	.mobile-intro div{
		margin-bottom:5px;
	}
	.mobile-intro .big-text{
		font-size: 64px;
    	line-height: 50px;
	}
	.name-text{
		font-size: 24px;
	}
	.info-box{
		padding: 0;
	}

}

/*******************

	B U R G E R 

********************/
 .burger-bar{
 	width: 100%; height: 40px; background: #322e2f;
 	position: fixed; top:35px; left:0;
 	z-index: 100;
 }
.burger-holder{
	max-width: 500px; width: 100%;
	height: 40px;
	position: absolute;
	top: 0px;
	right: 0px;
	overflow: hidden;
	font-family: "Aachen Bold";
	font-size: 21px;
}
.burger-text{
	width: 460px; height:40px; position: absolute;
	left:0; top:0; text-align: right;
	overflow: hidden;
	color:#FFF;
}
.burger-text span{
	width: 100%; height: 40px; text-align: right;
	position: absolute; left:0; top:0;
	display: block;
	padding:5px;
	cursor: pointer;
}
.burger-icon{
	width: 40px; height: 40px;
	background: #ffcc00;
	cursor: pointer;
	position: absolute; right:0; top:0;
	overflow: hidden;
}
.burger-image{
	width: 40px; height: 40px;
	position: absolute; top:0; left:0;
	z-index: 10;
	background: url('./imgs/burger-icon.png') #ffcc00 no-repeat center;

}
.burger-num{
	width:40px; height:40px;
	position: absolute;
	left:0; text-align: center;
	color: #fff;
	padding: 6px;
	z-index: 5;
}
#burger_num_1{
	top:0;
}
#burger_num_2{
	top:40px;
}
.burger-item{
	max-width:480px; width:100%;
	height:60px; background: #fff; display: block;
	text-align: left;
	position: absolute;
	right:20px;
	top:30px;
	cursor: pointer;
	overflow: hidden;

	-webkit-box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.08);
	-moz-box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.08);
	box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.08);
}
.burger-holder .disabled{
	cursor: default;
	background: rgba(255,255,255,0.5);
	color:#CCCCCC;
}
.burger-holder .disabled:hover{
	background: rgba(255,255,255,0.9);
	color:#9B9B9B;
}
.burger-item span{
	position: absolute; left:0; width: 100%;
	z-index: 90;
	padding:11px;
}
.burger-color{
	position: absolute; left: 0; top:0; height:100%; background: #ffcc00;
	width: 100%;
	z-index: 0;
}
@media screen and (max-width: 700px){
	.burger-item{
		right: 0px; left:0;
		width: 90%;
		margin: 0 auto;
		font-size: 20px;
	}
	.burger-holder .disabled{
		background: rgba(255,255,255,0.9);
		color:#9B9B9B;
	}
	
	.burger-text span{
		text-align: left;
		font-size: 19px;
	}
	.burger-image{
		display: block !important;
		opacity: 1 !important;
	}

}

/****************************

	G R I D - I M A G E S

*****************************/
.grid-holder{
	width: 100%; height: auto;
	z-index: 10;
	float:left;
	margin-bottom: 10px;
}
.grid-image{
	opacity: 0;
	
	background-size: cover;
	margin-bottom:20px;
	overflow: hidden;
	position: relative;

	max-height: 620px;
}
p.grid-image, a.grid-image{
	margin-bottom:0px;
}
.text-holder{
	width: 100%; height: 100%;
}
.one-column{
	width:320px;
}
.two-column{
	width: 100%;
}
.grid-holder:after, .two-column{
	clear:both;
}
.one-row{
	height:320px;
}
.two-row{
	height: 568px;
}
.full-video{
	width: 100%;
	height: 371px;
}
.grid-image img{
	width: 100%;
	 height:100%;
	position: absolute; top:0; right:0;
	z-index: 10;
}
.video-text{
	padding:20px;
}
.video-text h2, .video-text h3, .video-cover-btn h2, .video-cover-btn h3, .video-text p, .video-cover-btn p{
    color: #fff;
    font-family: "Aachen Bold";
    text-align: left;
    text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.57);
    font-size: 30px;
    line-height: 36px;
}
.video-text h2, .video-text h2{
	position: relative;
}
.video-text p{
	position: absolute;
	bottom: 0; left:0;
	margin: 0;
}
.video-cover-btn{
	width: 100%; height:100%; background: #fff; position: absolute; top:0; left:0;
	padding:20px;
	cursor: pointer;
}
.video-cover-btn p{
    z-index: 20;
    position: absolute;
    width: 220px;
    right: 20px;
    margin: 0;
    text-align: right;
}
.small-video-text{
    font-size: 24px !important;
    line-height: 26px !important;
    letter-spacing: 0.5px;
}
.video-text p, .video-cover-btn p, .mobile-caption{
	text-transform: uppercase;
}
.video-cover-btn h2, .video-cover-btn h3{
    z-index: 50;
    position: relative;
    width: 90%;
}
.video-cover-btn .text-holder h2, .video-cover-btn .text-holder h3{
	position: relative;
}
.video-cover-btn .text-holder{
		display: none;
}
.video-text{
		display: block;
}
.play-btn{
	position: absolute;
	bottom: 20px;
	right: 0;
	left:0;
	margin: 0 auto;
	width: 220px;
	height: 50px;
	border-radius: 25px;
	background: #ffcc00;
	color: #000;
	z-index: 50;
	padding: 6px;
	text-align: center;
	font-family: "SourceSansPro Light";
	font-size: 28px;
}
.black-btn{
	color: #ffcc00;
	background: #000;
}

.float-left{
	float: left;
}
.float-right{
	float:right;
}
.float-middle{
	margin-left:auto; margin-right:auto;
	left:0; right:0;
}
.separator-image{
	display: block;
	background:#000 center no-repeat;
	background-size: cover;
	width: 1100px; 
	height: 800px;
	margin: 10px 0px 20px -200px;
	border:#cecece 20px solid;

}
.mobile-caption{
	font-family: "Aachen Bold";
    width: 100%;
    margin: 0 auto;
    display: none;
    text-align: left;
    padding: 0px 20px 20px;
    font-size: 18px;
    line-height: 20px;
}
.mobile-caption .yellow-text{
	text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.57);
}
.desktop-caption{
	position: absolute;
    z-index: 20;
    width: 100%;
    top: 0;
    left: 0;
}
.video-player-holder, .video-js{
	width: 100%; height: 100% !important;
}
.video-link{
    text-align: right;
    width: !00%;
    display: block;
    width: 100%;
    font-family: "Aachen Bold";
    /* color: #ffcc00; */
    background: #fff;
    margin-top: -20px;
    font-size: 21px;
    padding: 7px;
    color: #000;
    /* border-bottom: 1px solid #cecece; */
    background: #cecece;
    width: 362px;
    text-align: center;
    border-radius: 21px;
    height: 42px;
    margin: -8px auto 0px;
    font-family: "SourceSansPro Light";
    text-transform: uppercase;
}
a {
    text-decoration: none;
    color: inherit;
}
@media screen and (max-width: 700px){
	.grid-holder{
		width: 120%;  margin-left: -10%;
	    background: #cecece;
	    padding: 20px 0px;
	    margin-bottom: 20px;
	}
	.mobile-white{
		background: #fff !important;
	}
	.grid-image{
		margin: 0px auto 20px; left:0; right:0;

	}
	.float-right, .float-left{
		float:none;
	}
	.separator-image{
		margin: 10px 0px 30px -5%;
		border-width: 10px;
		width: 110%; height: 500px;
	}
	.video-cover-btn .text-holder{
		display: block;
	}
	.video-text{
		display: none;
	}
	.full-video{
		width: 90%;
	}
	.mobile-caption{
		display: block;

	}
	.desktop-caption{
		display: none;
	}
	.full-video .video-cover-btn h3, .full-video .video-cover-btn h2{
		font-size: 20px;
    	line-height: 22px;
	}
	.video-link{
		text-align: center;
		background: #000;
    	color: #fff;
	}

}
/*******************************

	F A c T
	B o X !

********************************/
.box-break{
	width: 120%; height:auto; margin-left:-10%;
	background:#cecece;
	padding: 20px;
	margin-bottom:20px;
}
.fact-hover{
	width: 300px;
	height: 300px;
	display: block;
	margin: 0px auto;
	left:0; right:0;
	cursor: pointer;
}
.fact-box{
    width: 300px;
    height: 300px;
    display: block;
    background: #322e2f;
    padding: 20px;
    overflow: hidden;
    font-family: "Aachen Bold";
    font-size:32px;
    line-height: 33px;

 }
 .flip-icon{
 	width: 60px; height: 60px;
 	position: absolute; bottom:0px; right:0px;
 	background: url("./imgs/flip.png")
 }
 .start-content{
 	 width: 100%; height:100%;
 }
.flip-content{
	-ms-transform: rotateY(180deg); /* IE 9 */
    -webkit-transform: rotateY(180deg); /* Chrome, Safari, Opera */
    transform: rotateY(180deg);
    display: none;
    width: 100%; height:100%;
}
.fact-subhead{
	width: 100%;
	text-align: left;
	position: absolute;
	bottom:0px;

}
.fact-subhead p{
    margin: 0 0 10px 0;
    line-height: 25px;
    font-size: 22px;
}
.fact-ani{
    position: absolute;
    width: 150px;
    height: 150px;
    bottom: 0;
    left: 0;
}
.small-fact-text{
	font-family: "SourceSansPro Bold";
    font-size: 15px !important;
    line-height: 15px !important;
    color: #fff;
}


/*************

Pull - quotes

**************/

.pull-quote{
	width: 100%;
	height: auto;
	font-size: 25px;
	font-family: "Aachen Bold";
	text-align: left;
	padding: 30px 30px 50px;
	line-height: 31px;
	opacity: 0;

}

.email-box{

	background: #cecece;     padding: 20px 30px 50px;
	font-family: "SourceSansPro Regular";
	margin:20px 0px;
}
.subject-line{
    width: 100%;
    height: 30px;
    background: url("./imgs/email-header.png") #fff left top no-repeat;
    position: relative;
    padding: 1px 0px 0px 41px;
    font-size: 20px;
    overflow: hidden;
    border-bottom: solid 1px #000;
}
.subject-line strong{
	font-family: "SourceSansPro Bold";
}
.email-quote{
	font-size: 28px;
	font-family: "Aachen Bold";
	border-bottom:1px solid #000;	
	padding: 20px 0px;
	margin-bottom:15px;
}
.email-quote .highlight{
	background: url('./imgs/yellow.png') no-repeat;
	background-position: 0px -500px;
	background-position-x: -1000px;
  	background-position-y: 0px;
}
.pdf-button{

    width: 224px;
    height: 33px;
    background: url('./imgs/pdf-icon-alpha.png') #ffcc00 93% center no-repeat;
    padding: 3px 19px 0 21px;
    text-align: left;
    font-family: "SourceSansPro Bold";
    margin-top: 4px;
    font-size: 18px;
    position: absolute;
    bottom: 20px;
    right: 30px;
    cursor: pointer;
    border-radius: 16px;
    border: 1px solid #ffcc00;
    -webkit-transition: all ease-out 0.5s;
    -moz-transition: all ease-out 0.5s;
    -o-transition: all ease-out 0.5s;
    transition: all ease-out 0.5s;


}
.pdf-button:hover{
	background-color:#cecece;
	border:1px solid #000;
}
.pdf-button a{
	color: #000;
	padding: 0px 5px;
	box-shadow: none; border:none;
}

@media screen and (max-width: 700px){
	.pull-quote{
		font-size: 19px;
    padding: 0 0 20px;
    line-height: 23px;

	}
	.subject-line{
		font-size: 15px;
		padding: 5px 0px 1px 37px;
		height: auto;
	}
	.email-box{
		padding: 10px 15px 50px;
		margin: 20px 0px;
	}
	.email-quote{
		font-size: 25px;
	}
	.pdf-button{
		width: 90%;
		bottom: 12px;
		left: 5%;
	}
}
/**************
	
	P D F ’ S
	
*************/
.pdf-lb{
	width: 100%;
	position: fixed;
	z-index: 80;
	top:0; left:0;

}
.pdf-lb iframe, .lb-iframe-bg{
	width: 90%; margin: 0 auto;
	position: absolute; left:0; right:0; top:100px;
}
.pdf-lb iframe{
	z-index: 10;
}
.lb-iframe-bg{
	background: rgba(255,255,255,0.8);
	z-index: 1;
}
.lb-bg{
	width: 100%; height: 100%;
	background-color: rgba(0,0,0,0.7);
	cursor: pointer;
}
.pdf-lb .close-btn{
	width:60px; height: 60px;
	background: url('./imgs/close-btn.png') no-repeat center;
	position: absolute;
	z-index: 20;
	cursor: pointer;
}

@media screen and (max-width: 700px){
	.burger-holder{
		max-width: 100%;
	}
	.burger-item{
		right: 0px; left:0;
		width: 90%;
		margin: 0 auto;
		font-size: 20px;
	}
	.burger-holder .disabled{
		background: rgba(255,255,255,0.9);
		color:#9B9B9B;
	}
	.drop-cap {
	    display: inline-block;
	    float: left;
	    margin: -3px 0px 0px;
	    height: 99px;
	    width: 92px;
	    font-size: 97px;
	    font-family: "Aachen Bold";
	    line-height: 101px;
	    text-indent: 3px;
	    color: #ffcc00;
	}
	.tin-cap{
		    width: 94px;
    font-size: 107px;
    font-family: "Aachen Bold";
    line-height: 101px;
    text-indent: 40px;
	}
	p{
		margin: 0px 0px 23px;
		font-size: 14px;
    	line-height: 20px;
	}

	.burger-text span{
		text-align: left;
	}

}

/************************

		E N D
		B I T

*************************/

.continue-btn, .coming-soon-strip{
    color: #fff;
    font-family: "Aachen Bold";
    font-size: 30px;
    text-align: center;
    cursor: pointer;
    text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.57);
    background: rgba(0,0,0,0);
    padding: 20px;
    -webkit-transition: background-color ease-out 0.5s;
    -moz-transition: background-color ease-out 0.5s;
    -o-transition: background-color ease-out 0.5s;
    transition: background-color ease-out 0.5s;
    background: #fc0;
    max-width: 700px;
    width:90%;
    margin: 60px auto 220px;
    border-radius: 100px;
}
.continue-btn.no-margin{
	margin:60px auto -30px;
}
.coming-soon-strip{
	cursor: default;
}
.continue-btn:hover{
	background: rgba(0,0,0,1);
}
.continue-btn .next-icon, .continue-btn .prev-icon{
    font-weight: bold;
    font-size: 90px;
    position: absolute;
    top: -31px;
}
.continue-btn .next-icon{
    right: 90px;
    -webkit-transition: right ease-out 0.5s;
    -moz-transition: right ease-out 0.5s;
    -o-transition: right ease-out 0.5s;
    transition: right ease-out 0.5s;
}

.continue-btn:hover .next-icon{
	right:60px;
}
.continue-btn .prev-icon{
	left: 90px;
    -webkit-transition: left ease-out 0.5s;
    -moz-transition: left ease-out 0.5s;
    -o-transition: left ease-out 0.5s;
    transition: left ease-out 0.5s;
}
.continue-btn:hover .prev-icon{
	left:60px;
}
.credits{
	width: 100%; max-width: 700px;
	padding:20px; background: #fff;
	margin: 0 auto; left:0; right:0;
	font-family: "Aachen Bold";
	font-size: 14px;
	height:56px;
	overflow: hidden;
	cursor: pointer;
}
p.credits{
	padding: 0;
    height: auto;
    text-align: right;
    margin-top: -21px;
    font-size: 12px;
    font-family: "SourceSansPro Bold";
}
.credits.expanded{
	height: auto;
}
.credits h2{
    text-align: left;
    margin-bottom: 14px;
    font-size: 18px;
    padding-bottom: 5px;
    background: url('./imgs/credit-arrow.png') no-repeat;
    background-position: 0px -4px;
    overflow: hidden;
    height:30px;
    padding-left:30px;

}.credits.expanded h2{
	background-position: 0px -33px;
	border-bottom: 1px solid #000;
}
.credits p{
	margin: 0;
}
.credits strong{
	color: #ffcc00;
    background: #000;
    padding: 2px 5px;
}
@media screen and (max-width: 700px){
	.continue-btn .next-icon, .continue-btn .prev-icon{
		/*
	    position: relative;
	    display: inline;
	    top: auto;
	    right: auto;
	    left:auto;
	    font-size: inherit;
	    padding: 0 10px;
	    */


	    display: none;
	}
	.continue-btn{
		border-radius: 0;
	}
	.continue-btn.prev-btn{
		background: url('./imgs/prev-arrow-icon.png') #ffcc00 left center no-repeat;
		padding:20px 20px 20px 70px;
		text-align: left;
	}
	.continue-btn.next-btn{
		background: url('./imgs/next-arrow-icon.png') #ffcc00 right center no-repeat;
		padding:20px 70px 20px 20px;
		text-align: center;
	}
	.continue-btn:hover .next-icon{
		right:auto;
		left:auto;
	}
	p.credits{
    	background: #cecece;
    	width: 80%;
    	margin: 0px auto;
    	text-align: center;
	}
}


/*******
SUB box-shadow: 

******/
.sub-holder{
	max-width: 700px;
    width: 100%;
    margin: 0 auto;
    left: 0;
    right: 0;
    background: #0089D0;
    padding: 20px;
    height: 121px;
}
.sub-message{
	width: 50%;
    text-align: right;
    color: #fff;
    font-weight: bold;
        float: right;
}
.sub-message p{
	margin: 0;
}
.sub-message strong{
	font-family: "SourceSansPro Bold";
}
.white-logo{
	float: left;
    width: 50%;
}

@media screen and (max-width: 700px){
	.sub-message, .white-logo{
		float:none;
		width: 100%;
		text-align: left;
		padding:10px;
	}
	.white-logo img{
		    width: 100%;
	}
	.sub-holder{
		height: auto;
	}
}



/*********************

	S O C I A L

*********************/
.bday-logo{
    left: 6px;
    position: absolute;
    top: 1px;
    border-right: #cecece 1px solid;
    padding-right: 11px
;}
.custom-social-buttons{
    position: fixed;
    top: 1px;
    right: 8px;
    z-index: 100;
    list-style: none;
    padding: 0;
    margin: 0;
}
.custom-social-buttons li{
	display:inline-block;
	margin-left:10px;
	vertical-align:top;
}
.custom-social-buttons li a{
	display:block;
	font-size:0;
	width:30px;
	height:30px;
	overflow:hidden;
	background:url(./imgs/share-icons.png) 0 0 no-repeat;
	background-size:220px auto;
	box-shadow: none; text-decoration: none; border:none;
}

.custom-social-buttons li a:hover{
	border:none;
	background-position-y:-30px
}
.custom-social-buttons li.google-plus-btn a{
	background-position:-61px 0
}
.custom-social-buttons li.google-plus-btn a:hover{
	background-position-y:-30px
}
.custom-social-buttons li.twitter-btn a{
	background-position:-126px 0
}
.custom-social-buttons li.twitter-btn a:hover{
	background-position-y:-30px
}
.custom-social-buttons li.reddit-btn a{
	background-position:-181px 0;
	margin-top:-1px
}
.custom-social-buttons li.reddit-btn a:hover{
	background-position-y:-30px
}

.section-header{
	box-shadow:0 3px 3px rgba(0,0,0,0.2);
	background-color:white
}
.section-header{
	position:fixed;
	top:0;
	left:0;
	right:0;
	height:60px;
	z-index:1000;
	width: 100%;
}
.header-panel.header-logo-panel{
    position: absolute;
    top: 0px;
    left: 154px;
    width: 259px;
    height: 35px;
}
.header-panel.header-logo-panel .header-logo{
	width:auto;
	height:35px
}
@media screen and (max-width: 700px){
	.header-panel.header-logo-panel{
		left:0;
	}
	.bday-logo{
		display:none;
	}
}