/* -------------------------------- 

Primary style

-------------------------------- */
*, *::after, *::before {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

html {
	font-size: 62.5%;
}

body {
	font-size: 1.6rem;
	font-family: "PT Sans", sans-serif;
	color: #333;
	background-color: rgba(240, 240, 240, 1);
	height:100%;
}
body::before {
	/* never visible - this is used in jQuery to check the current MQ */
	content: 'mobile';
	display: none;
}
@media only screen and (min-width: 1170px) {
	body::before {
		/* never visible - this is used in jQuery to check the current MQ */
		content: 'desktop';
	}
}

/*----------------------
		NAV BAR
------------------------*/
main:nth-of-type(1){
	margin-top:50px;
}
@media only screen and (min-width: 1024px) {
	main:nth-of-type(1) {
		margin-top:80px;
	}
}

/*----------------------
 COMMON HEADINGS 
------------------------*/
h3, h2{
	font-family: 'futura-pt', sans-serif;
	text-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;	
}
h3 {
	font-size: 1.5em;
	font-weight: bold;
	line-height: 1;
	margin: 16px 0;	
}
h2 {
	font-size: 24px;
	font-size: 2.25rem;
	margin-bottom: .6em;
	text-transform: uppercase;
	letter-spacing: .23em;
	line-height: 2;
}
@media only screen and (min-width: 1170px) {
	h2{
		font-size: 38px;
		font-size: 3.25rem;
	}
}
/*-----------------------
 LINKS
-------------------------*/
a {
	color: rgba(57, 72, 127, 1);
	text-decoration: none;
}
p a:hover {
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	background-clip: padding-box;
	color: rgba(77, 88, 129, 0.84);
	border-bottom: 1px solid rgba(57, 72, 127, .8);
}
p {
	font-size: 100%;
}

/*-----------------------
 DISCLAIMER
-------------------------*/
#disclaimer {
	z-index:20;
}
#page{
	height:100%;
}

#disclaimer {
	background-color: #333333;
	color:#ffffff;	
}
#disclaimer > div button {
	display:block;
	margin:0 auto;
	width: 25%;
	max-width: 300px;
}
#disclaimer > div button {
	margin-bottom: 10px;
}
#disclaimer > div p {
	padding: 0 10px 7px;
	font-family: 'futura-pt', sans-serif;
	letter-spacing: .15em;
	font-size: 1em;
	text-align: center;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing:greyscale;
}
#disclaimer p.small {
	font-size: 0.6em;
}
@media only screen and (min-width: 1170px){
	#disclaimer > div p {
		font-size: 1.6em;
	}
	#disclaimer p.small {
		font-size: 0.8em;
	}	
}
#disclaimer > div p:last-of-type {
	margin:10px;
}
#disclaimer > div p a {
	color:#DFDFDF;
	text-decoration: underline;
}
img#splashlogo {
    display: block;
    margin: 0;
    margin: 8px 0 0 13px;
    max-width: 100px;
}
img#splashtext {
    display: block;
    margin: 0px 0 0 16px;
    max-width: 100px;
}
#splashaction{
	margin-top: 5%;
}
@media only screen and (min-width: 1170px){
	#splashaction{
		margin-top: 12.5%;
		margin-bottom: 12.5%;
	}
}
img.bg {
  /* Set rules to fill background */
  min-height: 100%;
  min-width: 1024px;
	
  /* Set up proportionate scaling */
  width: 100%;
  height: auto;
	
  /* Set up positioning */
  position: fixed;
  top: 0;
  left: 0;
  z-index:19;
}
@media screen and (max-width: 1024px) { /* Specific to this particular image */
  img.bg {
    left: 50%;
    margin-left: -512px;   /* 50% */
  }
}
.invisible{visibility:hidden}



/*----------------------

leftovers
 
------------------------*/
@font-face {
    font-family: 'futura-pt';
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'myriad-pro-condensed';
    font-weight: normal;
    font-style: normal;
}
.futura-light{
	font-family: "futura-pt",sans-serif;
	font-style: normal;
	font-weight: 300;
}
.futura-book{
	font-family: "futura-pt",sans-serif;
	font-style: normal;
	font-weight: 400;
}
.futura-heavy{
	font-family: "futura-pt",sans-serif;
	font-style: normal;
	font-weight: 700;
}
span.b {
	font-weight: bold;
}
span.i {
	font-style: italic;
}
/* main page quick navigation */
@media only screen and (min-width: 768px){
	.qn-fixed-height {
		height: 150px;
	}
	.qn-fixed-height .btn {
		margin:0 0 20px 0;
	}
}
section#map {
	padding-top: 0px;
}
/*----------------------

content body
 
------------------------*/
main {
	overflow-x: hidden;/*if you show this, you get a second scroll bar on the page*/
}
.cd-sections {
	margin: 0 auto;
	padding: 2em 0;
}
.cd-sections h2 {
	font-size: 22px;
	font-size: 2.25rem;
	margin-bottom: .6em;
	font-family: 'futura-pt', sans-serif;
	text-transform: uppercase;
	letter-spacing: .15em;
	line-height: 2;
	text-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
@media only screen and (min-width: 768px){
	.cd-sections h2{
		font-size: 32px;
		font-size: 3.25rem;
		text-transform: uppercase;
		letter-spacing: .23em;
	}
}
.cd-sections p, .cd-sections ul li {
	line-height: 1.6;
}
.cd-sections p a{
	font-weight: bold;
}
#fairline img, #otherline img, #bellechasseline img{
	width:100%;
	display: block;
	margin:0 auto;
}

.subheader img {
	margin-bottom:40px;
	width:100%;
	max-width:465px;
}
#how-to-use h2, #awards h2, #go-jump h2, #go-partners h2, #fairline h2, #otherline h2, #bellechasseline h2 {
	color: #999;
	font-size: 24px;
	font-size: 1.5em;
	font-weight: 400;
	margin: 0 0 0 .6em;
	text-align:left;
}
#how-to-use li {
	font-size: .875em;
	list-style: none;
	margin-bottom: 32px;
	overflow: hidden;
}
.banner{
	width:100%;
	position:relative;
}
/*-----------------------
/*social media buttons 
-------------------------*/

.fa-facebook {
background:#3b5998
} 
.fa-linkedin {
background:#007bb6
}
.fa-twitter {
background:#00aced
}
.fa-google-plus {
background:#dd4b39
}
.fa-instagram {
background: #517fa4;
}
.fa-pinterest-p, .fa-pinterest, .fa-pinterest-square {
background: #cb2027;
}
.fa-vine {
background: #00bf8f;
}
/*-----------------------
 WRAPS and CLEARFIX 
-------------------------*/
@media screen and (min-width: 768px){
	.wrap {
		max-width: 1140px;
	}
}
.wrap {
	width: 90%;
	margin: 0 auto;
}
.clearfix:after, .clearfix:before {
	content: "";
	display: table;
	zoom: 1;
}
.clearfix:after {
	clear: both;
}

/*-----------------------
COLUMNS

used on divs to columize them 
sixcol is approx 50%
twelvecol is fill width.
-------------------------*/
@media screen and (min-width: 768px){
	.onecol{width:5.801104972%}
	.twocol{width:14.364640883%}
	.threecol{width:22.928176794%}
	.fourcol{width:31.491712705%}
	.fivecol{width:40.055248616%}
	.sixcol{width:48.618784527%}
	.sevencol{width:57.182320438000005%}
	.eightcol{width:65.74585634900001%}
	.ninecol{width:74.30939226%}
	.tencol{width:82.87292817100001%}
	.elevencol{width:91.436464082%}
	.twelvecol{width:99.999999993%}
	.onecol, .twocol,  .threecol, .fourcol, .fivecol, .sixcol, .sevencol, .eightcol, .ninecol, .tencol, .elevencol, .twelvecol {
		position: relative;
		float: left;
		margin-left: 2.762430939%;
	}
	.first {
		margin-left: 0;
	}
	.last {
		float: right;
	}
}
/*-----------------------

 social media block styles

-------------------------*/
.socials {
	font-size:1em;
	margin-top: 20px;
}
.socials ul {
	/*overflow: auto;*/
}
.socials ul li {
	list-style-type: none;
}
.socials ul li a i {
	color: #fff;
	width: 40px;
	height: 40px;
	-webkit-border-radius:20px;
	-moz-border-radius:20px;
	border-radius: 20px;
	font-size: 25px;
	text-align: center;
	margin-right: 10px;
	padding-top: 15%;
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
	opacity: .7;
}
.socials ul li a i:hover {
	opacity: 1;
}
.social-items {
	text-align: center;
}
.social-items li {
	display: inline-block;
}
.social-items a:hover{
	text-decoration: none;
	border-bottom: 0px solid rgba(0,0,0,0);
}
@media only screen and (min-width: 976px) {
	.socials{
		vertical-align: middle;
	}
}
/*-----------------------

 Common button styles

-------------------------*/
.btn {
	width: 75%;
	min-width: 150px;
	max-width: 250px;
	display: block;
	margin: 1.3em;
	padding: 1em 1em;
	border: none;
	background: #fff;
	color: rgba(0, 0, 0, 0.65);
	vertical-align: middle;
	position: relative;
	z-index: 1;
	-webkit-backface-visibility: hidden;
	-moz-osx-font-smoothing: grayscale;
}
.btn:focus {
	outline: none;
}
.btn > span {
	vertical-align: middle;
}
/* Text color adjustments (we could stick to the "inherit" but that does not work well in Safari) */
a .btn {
	font-family: 'futura-pt', sans-serif;
	letter-spacing: 2px;
	text-transform: uppercase;
	white-space: nowrap;
}
/* Typography and Roundedness */
.thick-text {
	font-weight: 600;
}
/* Borders */
.thin {
	border: 1px solid;
}
/* bay-pac (bp) */
.bp-btn {
	-webkit-transition: border-color 0.4s, color 0.4s;
	-moz-transition: border-color 0.4s, color 0.4s;
	-o-transition-duration: border-color 0.4s, color 0.4s;
	transition: border-color 0.4s, color 0.4s;
}
.bp-btn::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #333;
	z-index: -1;
	opacity: 0;
	-webkit-transform: scale3d(0.7, 1, 1);
	-moz-transform:scale3d(0.7, 1, 1); 
	-o-transform: scale3d(0.7, 1, 1);
	-ms-transform: scale3d(0.7, 1, 1);
	transform: scale3d(0.7, 1, 1);
	-webkit-transition: -webkit-transform 0.4s, opacity 0.4s;
	-moz-transition: -moz-transform 0.4s, opacity 0.4s;
	-o-transition: -moz-transform 0.4s, opacity 0.4s;
	transition: transform 0.4s, opacity 0.4s;
	-webkit-transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
	-moz-transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
	transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
}
.bp-btn.round::before {
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}
.bp-btn,
.bp-btn::before {
	-webkit-transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
	-moz-transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
	-o-transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
	transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
}
.bp-btn.red::before{
	background: #E73921;
}
.bp-btn.red:hover{
	color:#fff;
	border-color: #000;
}
.bp-btn.blue::before{
	background: #1977C6;;
}
.bp-btn.blue:hover{
	color: #fff;
	border-color: #000;
}

.bp-btn:hover {
	color: #fff;
	border-color: #37474f;
}
.bp-btn:hover::before {
	opacity: 1;
	-webkit-transform: translate3d(0, 0, 0);
	-moz-transform: translate3d(0, 0, 0);
	-o-transform: translate3d(0, 0, 0);
	-ms-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
}
/*-----------------------

Common form input styles 

-------------------------*/
.input {
	position: relative;
	z-index: 1;
	display: inline-block;
	margin: 1em;
	max-width: 400px;
	width: calc(100% - 2em);
	vertical-align: top;
}
.field {
  position: relative;
  display: block;
  float: right;
  padding: 0.8em;
  width: 60%;
  border: #ca8a81 solid 1px; /* outline color */
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px; /* rounded corners */
  /* background: #f0f0f0; */ /* background color */
  color: #aaa; /* text color */
  font-weight: bold;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  -webkit-appearance: none;
  -moz-appearance: none;
}
.field:focus {
	outline: none;
}
.label {
	display: inline-block;
	float: right;
	padding: 0 1em;
	width: 40%;
	color: #5C5C5C;
	font-weight: bold;
	font-size: 70.25%;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
.label-title{
	position: relative;
	display: block;
	padding: .5em 0;
	width: 100%;
}
/* input imagery we may use 
.graphic {
	position: absolute;
	top: 0;
	left: 0;
	fill: none;
}*/
.icon {
	color: #ddd;
	font-size: 150%;
}
.field {
	width: 100%;
	height: 44px;
	background: #fff;
	box-shadow: 0px 0px 0px 2px transparent;
	color: #ea8a81;
	-webkit-transition: box-shadow 0.3s;
	-moz-transition: box-shadow 0.3s;
	-o-transition: box-shadow 0.3s;
	transition: box-shadow 0.3s;
}
.field:focus {
	box-shadow: 0px 0px 0px 2px #ea8a81;
}
.field:focus + .label {
	pointer-events: none;
}
.field:focus + .label::after {
	-webkit-animation: anim-shadow 0.3s forwards;
	animation: anim-shadow 0.3s forwards;
}
.label {
	padding: 0;
	width: 100%;
	text-align: left;
}
.label::after {
	content: '';
	position: absolute;
	top: 0;
	z-index: -1;
	width: 100%;
	height: 4em;
	box-shadow: 0px 0px 0px 0px;
	color: rgba(199,152,157, 0.6);
}
/* input animation */
@-webkit-keyframes anim-shadow {
	to {
	box-shadow: 0px 0px 100px 50px;
	opacity: 0;
	}
}
@keyframes anim-shadow {
	to {
	box-shadow: 0px 0px 100px 50px;
	opacity: 0;
	}
}

/*---------------------
FAIR TM
-----------------------*/
.fs{
	font-family: "myriad-pro-condensed",sans-serif !important;
	font-style: normal !important;
	font-weight: 700 !important;
	background-color: rgba(0,0,0,0) !important;
	background-repeat: no-repeat !important;
	background-origin: border-box !important;
	background-size: contain !important;
	padding-left: .9em !important;
	letter-spacing: -0.05em !important;
}
.fs-blk{
	color:#000 !important;
	background-image: url('../img/FAIR-circle-f-blk.png') !important;
}
.fs-wht{
	color:#FFF !important;
	background-image: url('../img/FAIR-circle-f-wht.png') !important;
}

.reg:after{
	font-family: "futura-pt",sans-serif !important;
	font-size: 0.7em !important;
	vertical-align: top !important;
	content: "®";
}
.copy:after{
	font-family: "futura-pt",sans-serif !important;
	font-size: 0.7em !important;
	vertical-align: top !important;
	content: "©";
}
.tm:after{
	font-family: "futura-pt",sans-serif !important;
	content: "™";
}


.announce {
	margin-bottom: 3em;
}
.announce h2 {
	text-align: center;
	text-transform: none;
}

.round {
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	background-clip: padding-box;
}
.round ul {
	list-style-type: circle;
}
.round li {
	display: list-item;
}

.callout img{
	float: right;
}
.callout h2 {
	font-size: 16px;
	margin-bottom: 9px;
	line-height: normal;
}

.callout ul {
	margin-bottom: 1em;
	list-style: none;
	margin: 9px 0 18px 27px;
}
.callout li, .callout p.video-tag {
	font-size:0.8em;
}
.callout {
	font-size: 1em;
	line-height: normal;
}
.callout a.round {
	border: 0 none;
	background: #dfdfdf;
	font-size: 14px;
	margin: 18px -2em -2em;
	display: block;
}
.callout .round {
	background: #eee;
	padding: 1em;
	margin-bottom: 20px;
}
.callout > video {
	width: 100%;
}
.callout p{
	width:100%;
	font-size:0.8em;
}
.callout p > span, .callout h2 > span, .callout li > span{
	white-space: nowrap;
}
@media only screen and (min-width: 1024px){
	.callout p {
		font-size:1em;
	}
}	
.wrap p {
	line-height:normal;
	margin: 0 0 0 1em;
	padding: 1em 0;
}
hr {
	background: url(../img/separator.png) no-repeat center top;
	background-size: cover;
	border: 0;
	margin: 40px 0 -150px;
	padding: 105px;
}
.poweredWrapper {
	padding: 0;
	width:100%;
	max-width: 1170px;
	margin: 0 auto;
	text-align: right;
}
.poweredBy {
	display: inline-block;
}
.powertitle{
	display: inline-block;
	height: 20px;
	vertical-align: top;
	text-transform: uppercase;
	padding: 14px;
	color:rgb(183, 183, 183);
}
@media only screen and (min-width: 768px){
	section#shim{
		height:68px !important;
	}	
}