#sec-hero{
	position: relative;
	height: 100vh;
	padding-top: 55px;
	box-sizing: border-box;
	text-align: center;
	overflow: hidden;
}
	#sec-hero h1,
	#sec-hero p,
	#sec-hero #wr-btn-cta{
		position: relative;
		z-index: 3;
	}

	#sec-hero h1{
		width: 160px;
		margin: 78px auto 8px;
		color: #E0CA92;
		font-size: 40px;
		font-weight: 700;
		text-align: left;
	}

	#sec-hero p{
		width: 272px;
		margin: 0px auto;
		color: #524B39;
		font-size: 24px;
		font-weight: 400;
	}

	.wr-btn-cta{
		position: relative;
			z-index: 3;
		display: inline-block;
		padding: 6px;
		margin-top: 32px;
		background-color: #F7DFA1;
		box-shadow: 0px 8px 48px rgba(255, 213, 0, 0.35);
		cursor: pointer;
	}
		.btn-cta{
			padding: 4px 36px;
			border: 1px solid #FFF;
			background-color: transparent;

			color: #524B39;
			font-family: "Pattaya";
			font-size: 24px;
		}
		.cta-ornaments{
			position: absolute;
			top: -40%;
			left: 50%;
			transform: translateX(-50%);
		}

	#wr-hanging-rhombus{
		position: absolute;
			top: 0px;
			left: 0px;
			z-index: 1;
		width: 100%;
		height: 100%;
		overflow: hidden;
	}
		#wr-hanging-rhombus svg{
			position: absolute;
				top: 0px;
		}
		#wr-hanging-rhombus svg:nth-child(1){ top: -16px; left: 32px; }
		#wr-hanging-rhombus svg:nth-child(2){ left: 50%; transform: translateX(-50%); }
		#wr-hanging-rhombus svg:nth-child(3){ top: -16px; right: 32px; }

	#wr-pattern{
		position: absolute;
			top: 0px;
			left: 0px;
			z-index: 0;
		width: 100%;
		height: 100%;
		overflow: hidden;
	}
		#wr-pattern svg{
			position: absolute;
			opacity: 0.2;
		}
		#wr-pattern svg:nth-child(1){
			top: 192px;
			right: -16px;
		}
		#wr-pattern svg:nth-child(2){
			top: 128px;
			left: -32px;
		}
		#wr-pattern svg:nth-child(3),
		#wr-pattern svg:nth-child(4){
			display: none;
		}		

	#wr-triangle{
		display: none;
		position: absolute;
			top: 0px;
			left: 0px;
			z-index: 2;
		width: 100%;
		height: 100%;
	}
		#wr-triangle svg{
			position: absolute;
				top: 0px;
				left: 50%;
				transform: translateX(-50%);
		}

	#wr-wings{
		display: none;
		position: absolute;
			top: 0px;
			left: 0px;
			z-index: 0;
		width: 100%;
		height: 100%;
	}
		#wr-wings svg{
			position: absolute;
			top: 0px;
			left: 0px;
			width: 100%;
			height: auto;
		}


/* 	
	+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+

	*	[Hero Section - Tree-structural Pseudo-classes]

	+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
*/
#sec-hero :not(h1){
	text-align: center;
}