@charset "UTF-8";
/* CSS Document */

*, *::before, *::after {
  box-sizing: inherit;
}

body {
  background: #fff;
  color: #000;
  font-family: Helvetica,Arial,sans-serif;
  height: 100%;
	padding: 0;
	margin: 0;
	line-height: 1.4em;
}

a {
  color: #000;
  font-weight: bold;
  text-decoration: none;
}

.iframe-container {
  margin: 0 auto;
  max-width: 800px;
  padding: 1em 4em;
}

.iframe-header {
  background-color: #000;
	padding-top: 10px;
}

.iframe-header .header h1 {display: none;}

.iframe-header .header {
  background-image: url("../images/p5-rewards-logo.jpg");
  background-repeat: no-repeat;
  background-size: contain;
  height: 75px;
  margin: 0 auto;
  width: 300px;
}

.navbar-div {
  background-color: #fff;
  padding-top: 20px;
  text-align: center;
}

.navbar-div .popup, input[type="submit"] {
  background-color: #ed3125;
  border: 3px solid #ed3125;
  border-radius: 5px;
  color: #fff;
  display: inline-block;
  font-family: Helvetica,Arial,sans-serif;
  font-size: 20px;
  font-weight: bold;
  padding: 20px 36px 15px;
  text-decoration: none;
	cursor: pointer;
}

.navbar-div .popup:hover, input[type="submit"]:hover {
  background-color: #fff;
  color: #ed3125;
}

.navbar-div span + span::before {
  background-color: #e7ebeb;
  border-radius: 50%;
  color: #929292;
  content: none;
  display: inline-block;
  font-size: 13px;
  line-height: 3px;
  margin: 0 20px 0 10px;
  padding: 15px 9px;
  vertical-align: middle;
}


/** SIGN UP **/


.signup-form {
	margin-top: -3em;
}

.signup-div {
	color: #888;
}

.signup-div label {
	font-size: 14px;
}

.signup-password-hint {
	font-size: 12px;
}

select {
	display: block;
}

label[for="user_unsubscribed"] {
	display: inline-block;
	margin-left: .5em;
}

/** Sign Up Form **/


label {
	display: block;
	margin: 1em 0 .3em 0;
	color: #000;
	font-size: 14px;
	font-weight: bold;
}

input[type="text"], input[type="password"], input[type="email"] {
  border: 1px solid #ccc;
  box-sizing: border-box;
  color: #000;
  display: block;
  font-size: 14px;
  margin-bottom: 20px;
  min-width: 200px;
  padding: 10px;
  width: 100%;
	border-radius: 5px;
}

.error-messages, .alert-message {
	font-size: 14px;
	margin-left: 2em;
	margin-top: 1.5em;
	color: #888;
	text-align: center;
}

.signup-form {
	margin-top: 0 !important;
}

.signup-div {
	color: #888;
}

.signup-div label {
	font-size: 14px;
}

.signup-password-hint {
	font-size: 12px;
}

select {
  display: block;
  font-size: 14px;
  padding: 10px;
}

label[for="user_unsubscribed"] {
	display: inline-block;
	margin-left: .5em;
}

.membership-card-hint {
  display: block;
  font-size: 11px;
  margin-bottom: 20px;
  margin-top: -10px;
}

.birthday > select {
  display: inline-block;
  vertical-align: top;
}

.captcha-div > a {
  display: block;
  font-size: 11px;
  margin-bottom: 20px;
  margin-top: -10px;
}

.submit-div {
  text-align: center;
}

.facebook-login-div {
  text-align: center;
}

.facebook-link a {
  background-color: #3664a2;
	border:3px solid #3664a2;
  border-radius: 8px;
  color: #ffffff;
  display: inline-block;
  font-weight: 700;
  letter-spacing: 0.04em;
  padding: 20px 36px 15px;
  text-align: center;
  text-decoration: none;
	font-size: 20px;
}

.facebook-link a:hover {
  background-color: #fff;
  color: #3664a2;
}

.facebook-label {
  display: block;
  font-weight: bold;
	margin: 15px 0 10px;
	color: #999;
}

.forgot-div {
  font-size: 12px;
  margin-top: 10px;
  text-align: center;
}

/** LOGGED IN **/

.account-link a, .checkin-link a, .redemption-link a, .setting-link a, .signout-link a {
	font-size: 16px;
	padding: .5em .7em;
	text-transform: capitalize;
}

/** account **/

.account {
	margin-top: 1em;
	font-size: 18px;
}

.account div {
	margin-bottom: .3em;
}

/** checkin **/

.checkin-form {
	font-size: 14px;
}

#checkin_bar_code {
	margin-bottom: .5em;
}

.checkin-form label {
	display: inline-block;
	font-size: 18px;
	width: 24em;
}

.checkin-form textarea {
	width: 100%;
	height: 3em;

}

.info-div {
	margin-top: 2em;
	display: block;
}

.checkin-form .submit-div {
	margin-top: 1em;
}

/** redemption **/

.redemption-div {
	font-size: 14px;
}

#redemption_redeemed_points {
	margin-bottom: .5em;
}

.redemption-div label {
	display: inline-block;
	font-size: 18px;
	width: 24em;
}

.expiry-warning {
	margin-top: 20px;
}