@charset "UTF-8";
/* Sample CSS Document */
.mainContainer,
header{
	left:0;
	width:100%;	
}
.filterWrap{
	left:-50%;
	width:50%;	
}

#main-content{
	background-repeat:no-repeat;
	background-size:cover;
	background-attachment:local;
	background-position:center;	
	min-height:660px;
	height:auto; /* must be auto to allow error messages on form to be displayed.*/
}
#main-content:before{
	position:absolute;
	background-color:rgba(0,0,0,.4);
	top:0;
	bottom:0;
	left:0;right:0;
	margin:auto;
	content:'';
	z-index:0;	
	float:left;
}
#main-content .container{
	color:#ffffff;
	padding-top:10%;
	z-index:1;
	position:relative;
}
.dupSignup{
	color:white;	
}
span.error {
	display: block;
	margin: 5px auto;
	float: none;
	max-width: 300px;
	text-align: center;
	background-color: rgba(0,0,0,.5);
	padding: 10px;
	border-radius: 2px;
	color:white !important;
}
span.codeRed {
	color: #00b798; /* this is teal */
	cursor: text;
	background-color: rgba(0,0,0,.5);
	padding: 2px;
	border-radius: 2px;
}
p{
	display:inline-block;
	color:white;	
	text-align:center;
	max-width:300px;
	letter-spacing:1px;
	line-height:1.5;
	margin-bottom:16px;
}
.socialShareWrap{
	position:relative;
	z-index:1;	
}
div.fb-share-button.fb_iframe_widget{
	top:-4px;	
}
#main-content h1{
	font-family:'Permanent Marker', cursive;	
}
#main-content h1 span.break{
	font-size:30px;
	font-size:2.5rem;
}
#main-content h1, 
#main-content h2{
	width:100%;
	max-width:750px;
	display:block;
	margin:5px auto 0;
	letter-spacing:1px;
}
#main-content h2{
	font-size:30px;
	font-size:1.875rem;	
}
#main-content h2 span.break{
	font-size:25px;
	font-size:1.7rem;
}
.container input,
.container .button{
	width:100%;
	max-width:300px;
	display:block;
	margin:0 auto;
	height:55px;
	text-align:center;
	font-size:24px;
	font-size:1.5rem;
	line-height:33px;
}
.container input[type="email"]{
	border-radius:2px 2px 0 0;
	border:0;
}
.container input[type="password"]{
	border:0;
	border-top:1px solid #efefef;
	border-radius:0;
	
}
.container .button{
	border-radius:0 0 2px 2px;	
}

.ghost{
	color:#222;
	float:right;  
	margin-top: 16px;
	margin-right: 16px;	
}
.ghost:active,
.ghost:focus{
		color:red;
		border-color:red;
	}
.createAccountCTA {
  display: inline-block;
  width: 100%;
  text-align: center;
  margin-top: 20px;
  color:white;
  border-top:white solid 1px;
  max-width:250px;
  padding-top:20px;
}
.createAccountCTA span:active,
.createAccountCTA span:focus{
		color:red;
	}
.break{
	display:block;	
	font-weight:inherit;
}
span.fauxH6 {
	display: block;
	font-size: 36px;
	font-size:2.25rem;
	margin-top: 25px;
}

#discountInfo .clickable, #discountInfo p {
    color:white;
}
.register.modal {
       width: 100%;
    max-width: 300px;
    display: block;
    margin: 0 auto;
    text-align: center;
    font-size: 24px;
    font-size: 1rem;
    line-height: 33px;
}

@media screen and (min-width:1024px) and (min-height:768px){
	
	#main-content{
		min-height:760px;	
	}	
}

@media screen and (min-width:768px){
	.filterWrap {
		left:-25%;
		width:25%;	
	}
	form#newsletterform span.buttonGray{
		margin-top:16px;
	}
	#main-content{
		min-height:870px;	
	}
}



@media screen and (min-width:1025px){
	#main-content .container{
		padding-top:60px;
	}
	.filterWrap{
		left:-15%;
		width:15%;	
	}
	.ghost:hover{
		opacity:.5;
	}
	.createAccountCTA span:hover,
	.dupSignup:hover{
		opacity:.5;
		cursor:pointer;
		
	}
	.dupSignup:hover{
		color:white;	
	}
	.container input,
	.container .button{
		font-size:18px;
		font-size:1.125rem;
	}
}