



#sec-opportunity{
	padding: 32px 16px;
	background-image: url("../media/img/deco-opp-longroad-sm.png");
	background-repeat: no-repeat;
	background-position: top 64px center;
	background-clip: content-box;
}

	.co-opportunity{
	}

		.co-opportunity img{
			display: block;
			position: relative;
				z-index: 0;
			width: 288px;
			height: 288px;
			margin: 0px auto -160px;
			border-radius: 999px;
			object-fit: cover;
			object-position: center;

			/*
				*	@reason 	The reason of this declaration is for object fit
								polyfill.

								https://github.com/fregante/object-fit-images
			*/
			font-family: 'object-fit: cover; object-position: bottom;';
		}

		.wr-opp-content{
			position: relative;
				z-index: 1;
			width: 288px;
			height: 288px;
			padding: 81px 24px 16px;
			margin: 0px auto;
			border-radius: 999px;
			box-sizing: border-box;
			overflow: hidden;
			background: #FFF;
			box-shadow: 0px 0px 50px  0px rgba(0, 0, 0, 0.1), inset 2px -5px 0px 0px #F7C223;
			text-align: center;
		}
			.wr-opp-subheading{
				position: absolute;
					top: 0px;
					left: 0px;
				width: 100%;
				height: 81px;

				padding: 16px 0px;
				border-radius: 100px;
				box-sizing: border-box;
				background-image: url("../media/img/deco-opp-subheading-sm.png");
				background-repeat: no-repeat;
			}
			.wr-opp-subheading p{
				margin-top: 16px;
				color: #FFF;
				font-size: 20PX;
				font-weight: 500;
				letter-spacing: 0.1em;
				text-transform: uppercase;
			}

			.wr-opp-content > h2{
				margin: 16px 0px 8px;
				color: #382C08;
				font-size: 20px;
				font-weight: 600;
			}
			.wr-opp-content > p{
				color: #382C08;
				font-size: 14px;
				font-weight: 400;
			}





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

	*	[Opportunity Component - Tree-structural Pseudo-classes]

	+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
*/
.co-opportunity:not(:last-child){
	margin-bottom: 160px;
}