@import '../../default.less';
@import '../mixins.less';

div#site-holder.gift
{
	min-width: 940px;
	height: 100%;
	min-height: 750px;
	.hires('/img/v4/premium/bg-pattern');
	background-repeat: repeat;

	#site-main
	{
		.hires('/img/v4/premium/bg-pattern');
		background-repeat: repeat;
	}

	#site-header
	{
		background: white;
	}
}

html, body
{
	height: 100%;
	margin: 0;
}

#braintreeDataFrame
{
	display: none;
}

div#site-footer-copyright
{
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
}

#premium
{
	margin: auto;
	width: 910px;
	position: relative;
	z-index: 1;

	&.gift-complete
	{
		#card-top
		{
			margin-top: 110px;
		}
		#card-body
		{
			margin-top: 180px;
		}
	}

	#content-left
	{
		float: left;
		width: 450px;
	}

	#content-main
	{
		margin: auto;
		width: 910px;
	}

	#gift-complete
	{
		h1
		{
			padding-left: 20px;
			font: bold 30px @title-font;
			color: #000;
		}
		h2
		{
			padding-left: 20px;
			font: 16px @title-font;
			color: #000;
		}
	}

	#gift-box
	{
		.hires('/img/v4/premium/gift-box', @ext: 'jpg');
		background-repeat: no-repeat;
		position: relative;
		top: 0;
		left: 110px;
		width: 130px;
		height: 130px;
		margin-bottom: 10px;

		html[dir='rtl'] &
		{
			left: unset;
			right: 110px;
		}
	}

	#card-top
	{
		.hires('/img/v4/premium/gift');
		background-repeat: no-repeat;
		position: absolute;
		top: 24px;
		margin-left: 125px;
		html[dir='rtl'] &
		{
			margin-left: unset;
			margin-right: 105px;
		}
		width: 120px;
		height: 46px;
	}

	#card-body
	{
		float: right;
		margin-top: 70px;
		width: 350px;
		padding: 25px;
		background: #fff;
		border-radius: 3px;

		.credit-card
		{
			.plan.giveknowledge
			{
				display: none;
				margin-bottom: 7px;
			}
		}
	}

	#card-tag-price
	{
		.hires('/img/v4/premium/tag-price', @backgroundSize: 510px 90px);
		background-repeat: no-repeat;
		position: absolute;
		top: 400px;
		left: 100px;
		width: 410px;
		height: 90px;
		font-size: 0;

		h1
		{
			font: bold 26px @title-font;
			color: #ca0000;
			text-align: left;
			margin-left: 35px;
		}
	}

	#header
	{
		h1
		{
			font: bold 40px @title-font;
			color: #fff;
			margin-top: 0;
			margin-bottom: 5px;
			padding-top: 70px;
		}

		h2
		{
			font: 18px @title-font;
			color: #fff;
			margin-top: 0;
			margin-bottom: 0;
		}

		h3
		{
			font: bold 18px @title-font;
			color: #fff;
			margin-top: 0;
		}
	}

	#content
	{
		margin-top: 25px;
		h1
		{
			font: bold 18px @title-font;
			color: #fff;
		}
	}

	#features
	{
		font: 16px @title-font;
		list-style-image: url('/img/v4/premium/ico-bullet.png');
		padding-left: 25px;
		html[dir='rtl'] &
		{
			padding-left: initial;
			padding-right: 25px;
		}
		margin-top: 5px;

		li
		{
			color: #fff;
			margin-bottom: 7px;
			font-weight: bold;

			span
			{
				font-weight: normal;
				color: #fff;
			}
		}
	}

	#activate
	{
		font: bold 16px @title-font;
		padding: 8px;
	}
}

#santa-footer
{
	.hires('/img/v4/premium/santaknoema2');
	background-repeat: no-repeat;
	background-position-x: center;
	overflow: hidden;
	position: absolute;
	bottom: 60px;
	width: 100%;
	height: 406px;
}

#snow-footer
{
	background: #fff;
	position: absolute;
	bottom: 60px;
	left: 0;
	right: 0;
	height: 50px;
}

#gift-disclaimer
{
	background: #fff;
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	height: 100px;

	#gift-disclaimer-content
	{
		width: 910px;
		margin: auto;
		h1
		{
			font: 12px @title-font;
			color: #000;
		}
	}
}