h3 {
	line-height: 1.42;
}

.main-panel {
	background: #7BAAF7;
	width: 100%;
}

.img-giftcard {
	display: block;
	margin: 0 auto;
}

.text-giant {
	font-size: 450%;
}

.text-big {
	font-size: 250%;
}

.text-shadow,
.btn-gift-card {
	text-shadow: 1px 1px 3px rgba(0,0,0,0.3);
}

.main-copy {
	color: #366FB1;
	text-shadow: 0 1px 0 rgba(255,255,255,0.3);
}

.btn-gift-card {
	font-size: 250%;
	color: #fff;
	display: block;
	margin: 0 auto;
	text-transform: uppercase;
	border-radius: 4px;
	border: none;
	background: #5492EA;
	background-image: -o-linear-gradient(-89deg, #5492EA 0%, #4173B9 100%);
	background-image: -moz-linear-gradient(-89deg, #5492EA 0%, #4173B9 100%);
	background-image: -ms-linear-gradient(-89deg, #5492EA 0%, #4173B9 100%);
	background-image: linear-gradient(-179deg, #5492EA 0%, #4173B9 100%);
	
	-webkit-transition: all .2s ease;
	-moz-transition: all .2s ease;
	transition: all .2s ease;
}

.btn-gift-card:hover,
.btn-gift-card:focus {
	color: #fff;
	box-shadow: 0 1px 2px rgba(0,0,0,0.4);
}

.gc-how {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
}

.gc-how .one {
	background: #EF8C8C;
}

.gc-how .two {
	background: #EC7676;
}

.gc-how .three {
	background: #EF6666;
}

.gc-how .one,
.gc-how .two,
.gc-how .three {
	padding: 50px 25px;
	position: relative;
}

.gc-how .one:before,
.gc-how .two:before,
.gc-how .three:before {
	content: '';
	position: absolute;
	width: 50px;
	height: 50px;
	background: #f1f1f1;
	color: #555;
	border: #999;
	border-radius: 50%;
	top: -25px;
	left: 50%;
	margin-left: -25px;
	font-size: 25px;
	padding-left: 20px;
	padding-top: 10px;
	-moz-box-shadow: 1px 1px 1px rgba(0,0,0,0.3);
	box-shadow: 1px 1px 1px rgba(0,0,0,0.3);
}

.gc-how .one:before {
	content: '1';
}

.gc-how .two:before {
	content: '2';
	padding-left: 18px;
}
.gc-how .three:before {
	content: '3';
	padding-left: 18px;
}

.gc-how p {
	color: #fff;
	font-size: 150%;
}

.gc-how a {
	text-decoration: underline;
	color: #FFFFFF;
}

.gift-card-vp {
	background: url("../img/happy-peeps.jpg") no-repeat center center fixed;
	-webkit-background-size: cover;
  	-moz-background-size: cover;
  	-o-background-size: cover;
  	background-size: cover;
  	padding: 50px 10%;
}

.gift-card-vp h2 {
	font-family: 'GothamRounded-Bold', "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 400%;
	color: #FFFFFF;
	text-shadow: 1px 1px 1px rgba(0,0,0,0.5);
}

.gift-card-vp h3,
.gift-card-vp h4 {
	color: #F1F1F1;
	text-shadow: 1px 1px 1px rgba(0,0,0,0.5);
	font-size: 250%;
}

.gift-card-vp p {
	font-size: 150%;
	color: #FFFFFF;
}

.gc-purchase-info {
	padding: 50px 10%;
	background: #F1F1F1;
}

.gc-purchase-info h4,
.gc-purchase-info h3 {
	position: relative;
	margin-bottom: 30px;
}

.gc-purchase-info h4:after {
	position: absolute;
	content: "";
	background: #CCCCCC;
	height: 10px;
	width: 50px;
	left: 50%;
	bottom: -15px;
	margin-left: -25px;
}

.gc-purchase-info h3 {
	color: #888888;
	font-family: 'GothamRounded-Light', Helvetica, Arial, sans-serif;
	text-transform: uppercase;
}

.gc-purchase-info button {
	display: block;
	margin: 0 auto;
	padding: 20px;
	border-radius: 4px;
	font-size: 2rem;
	text-transform: uppercase;
	background: #E84C53;
	color: #FFFFFF;
	text-shadow: 1px 1px 1px rgba(0,0,0,0.3);
	transition: all .2s ease;
}

.gc-purchase-info button:hover,
.gc-purchase-info button:focus {
	box-shadow: 0px 3px 8px rgba(0,0,0,0.2);
	opacity: 0.9;
	outline: none;
}

.gc-purchase-form {
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-gap: 20px;
}

.gc-purchase-form-cc {
	display: grid;
	grid-template-columns: 3fr 1fr 1fr 1fr;
	grid-gap: 20px;
}

.gc-purchase-form,
.gc-purchase-form-cc {
	background: #FFFFFF;
	padding: 15px;
	margin-bottom: 30px;
	border-radius: 4px;
	box-shadow: 0px 2px 3px rgba(0,0,0,0.3);
	transition: all .2s linear;
}

.gc-purchase-form:hover,
.gc-purchase-form-cc:hover {
	box-shadow: 0px 5px 12px rgba(0,0,0,0.2);
}

.gc-purchase-form label,
.gc-purchase-form-cc label,
.gc-purchase-form select {
	display: block;
}

.gc-purchase-form input,
.gc-purchase-form-cc input,
.gc-purchase-form select {
	width: 100%;
	text-transform: uppercase;
	padding: 10px;
	border-radius: 4px;
	border: 1px solid #F1F1F1;
}

.gc-purchase-form input:focus,
.gc-purchase-form-cc input:focus {
	border: 1px solid #FFA647;
	outline: none;
}

.gc-purchase-form input::placeholder,
.gc-purchase-form-cc input::placeholder {
	color: #CCCCCC;
}

.gc-faq {
	display: grid;
	grid-gap: 20px;
	grid-template-columns: 1fr;
	padding: 50px 10%;
}

.gc-faq-title {
	grid-column-start: 1;
	grid-column-end: -1;
	text-align: center;
	text-transform: uppercase;
	color: #444444;
	font-family: 'GothamRounded-Light', Helvetica, Arial, sans-serif;
}

.gc-faq-box {
	position: relative;
	background: #8BD1E0;
	padding: 15px;
	border-radius: 4px;
}

.gc-faq-question {
	font-size: 1.5rem;
	text-transform: uppercase;
	color: #FFFFFF;
	cursor: pointer;
	margin-bottom: 0px;
}

.gc-faq-answer {
	display: none;
	margin: 15px 0;
	color: #127C94;
	font-size: 1.75rem;
}

.gc-faq-indicator {
	position: absolute;
	content: "";
	height: 30px;
	width: 30px;
	color: #FFFFFF;
	font-size: 2rem;
	padding: 3px 6px;
	border-radius: 50%;
	background: #127C94;
	top: -15px;
	left: -15px;
	transition: all .2s ease;
}

.gc-faq-indicator-active {
	-webkit-transform: rotate(180deg);
	-moz-transform: rotate(180deg);
	transform: rotate(180deg);
}

.gc-faq-indicator-inactive {
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	transform: rotate(0deg);
}

.js-hide-form {
	display: none;
}

@media (min-width: 768px) {
	.img-giftcard {
		padding-top: 0;
	}
}

@media (max-width: 768px) {
	.gc-how {
		grid-template-columns: 1fr;
	}

	.gc-purchase-form-cc {
		grid-template-columns: 1fr 1fr 1fr;
	}

	.cc-number {
		grid-column-start: 1;
		grid-column-end: -1;
	}
}

@media (max-width: 476px) {
	.gc-purchase-form-cc,
	.gc-purchase-form {
		grid-template-columns: 1fr;
	}
}

/*following css for easter promo -- delete or comment-out after*/

/*.easter {
	position: relative;
}

.img-easter {
	position: absolute;
	right: 90px;
	cursor: pointer;
	animation-name: shake;
	animation-duration: 0.82s;
	animation-timing-function: cubic-bezier(.36,.07,.19,.97);
	animation-delay: 3s;
	animation-iteration-count: infinite;
	animation-direction: both;
}

.easter-instructions {
	position: absolute;
	display: none;
	right: 25px;
	top: -275px;
	width: 300px;
	padding: 30px;
	background: #FFFFFF;
	border-radius: 4px;
	box-shadow: 0 3px 4px rgba(0,0,0,0.4);
}

#easter-closer {
	cursor: pointer;
}

.easter-question {
	color: #507BFF;
}

@keyframes shake {
  10%, 90% {
    transform: translate3d(-1px, 0, 0);
  }
  
  20%, 80% {
    transform: translate3d(2px, 0, 0);
  }

  30%, 50%, 70% {
    transform: translate3d(-4px, 0, 0);
  }

  40%, 60% {
    transform: translate3d(4px, 0, 0);
  }
}*/

/*easter css finished*/