update

src/scss/_feature-sunset.scss

@@ -0,0 +1,110 @@
+body.rwavw-custom {
+	.widget.rwavw-feature-sunset {
+		.pure-g {
+			> div:first-child {
+				padding: 20px 80px;
+			}
+		}
+
+		h2, h3, h4, h5, h6 {
+			position: relative;
+			margin-bottom: 44px;
+		}
+
+		.gallery-link {
+			display: flex;
+			align-items: center;
+			justify-content: center;
+		}
+
+		@media (max-width: 630px) {
+			.pure-g {
+				> div {
+					&:first-child {
+						padding: 11px 35px;
+					}
+				}
+			}
+
+			h2, h3, h4, h5, h6 {
+				font-size: 28px;
+				margin-bottom: 22px;
+			}
+
+			p {
+				font-size: 18px;
+			}
+		}
+
+		@media (max-width: 63.98em) {
+
+			.pure-g {
+
+				> div {
+					position: relative;
+					&:first-child {
+						position: absolute;
+						width: 100%;
+						max-width: 728px;
+						margin-left: auto;
+						margin-right: auto;
+						height: 100%;
+						top: 0;
+						left: 50%;
+						transform: translateX(-50%);
+
+						display: flex;
+						flex-direction: column;
+						justify-content: flex-end;
+						align-items: flex-start;
+					}
+				}
+			}
+
+			h2, h3, h4, h5, h6, p {
+				color: #fff;
+			}
+		}
+
+		@media (min-width: 64em) {
+			h2, h3, h4, h5, h6, p {
+				text-align: right !important;
+			}
+
+			h2, h3, h4, h5, h6 {
+
+				&::before {
+					$bg-color: rgb(3, 41, 109);
+					z-index: -1;
+					content: '';
+					display: block;
+					position: absolute;
+					width: 230%;
+					height: 300%;
+					top: 48px;
+					left: -22px;
+
+					border-radius: 3px;
+
+					background-image: linear-gradient(
+						140deg,
+						rgba($bg-color, 0.01),
+						rgba($bg-color, 0.05)
+					);
+				}
+			}
+
+			.pure-g {
+				> div:first-child {
+					z-index: 5;
+				}
+
+				> div:last-child {
+					z-index: 10;
+					max-width: 40em;
+				}
+			}
+		}
+	}
+}
+

src/scss/_featured.scss

@@ -39,7 +39,10 @@ body.rwavw-custom {
 			flex-direction: column;
 			justify-content: center;
 			align-items: stretch;
+		}
 
+		@media (min-width: 67.98em) {
+			.pure-g > div {
 				&:first-child {
 					padding-right: 44px;
 				}
@@ -48,6 +51,8 @@ body.rwavw-custom {
 					padding-left: 44px;
 				}
 			}
+
+		}
 	}
 
 	.widget.rwavw-feature-narrow {
@@ -97,23 +102,54 @@ body.rwavw-custom {
 	}
 
 	.widget.rwavw-feature-limits {
+		h2, h3, h4, h5, h6 {
+			margin-top: 44px;
+
+			@media (min-width: 64em) {
+				margin-top: 0;
+				text-align: left !important;
+			}
+		}
 	}
 
 	.widget.rwavw-feature-sunset {
 		.pure-g {
 			> div:first-child {
-				z-index: 5;
+				z-index: 10;
 			}
 
 			> div:last-child {
-				z-index: 10;
+				z-index: 5;
 			}
 		}
 
 		.h2, h3, h4, h5, h6 {
 			position: relative;
-			text-align: right !important;
 			margin-bottom: 44px;
+		}
+
+		@media (max-width: 63.98em) {
+			.pure-g {
+
+				> div {
+					position: relative;
+					&:first-child {
+						position: absolute;
+						width: 100%;
+						height: 100%;
+						top: 0;
+						left: 0;
+					}
+				}
+			}
+		}
+
+		@media (min-width: 64em) {
+			h2, h3, h4, h5, h6, p {
+				text-align: right !important;
+			}
+
+			h2, h3, h4, h5, h6 {
 
 				&::before {
 					$color: rgb(3, 41, 109);
@@ -136,8 +172,13 @@ body.rwavw-custom {
 				}
 			}
 
-		p {
+			> div:first-child {
-			text-align: right !important;
+				z-index: 10;
+			}
+
+			> div:last-child {
+				z-index: 5;
+			}
 		}
 	}
 

src/scss/style.scss

@@ -1,5 +1,6 @@
 @import "hero";
 @import "featured";
+@import "feature-sunset";
 @import "contact";
 @import "faq";
 @import "footer";