Full-bleed media

sass/_media.scss

@@ -11,6 +11,14 @@ video {
 		width: 100%;
 	}
 
+	&.full-bleed,
+	&[src*="#full-bleed"] {
+		margin-right: calc((-100vw + 100%) / 2);
+		margin-left: calc((-100vw + 100%) / 2);
+		width: 100vw;
+		max-width: 100vw;
+	}
+
 	&.start,
 	&.end,
 	&[src*="#start"],
@@ -56,7 +64,9 @@ video {
 	}
 
 	&.transparent,
-	&[src*="#transparent"] {
+	&.full-bleed,
+	&[src*="#transparent"],
+	&[src*="#full-bleed"] {
 		box-shadow: none;
 		border-radius: 0;
 	}
@@ -65,7 +75,7 @@ video {
 img {
 	transition: var(--transition-longer);
 
-	&:not(.no-hover, &[src*="#no-hover"]) {
+	&:not(.no-hover, .full-bleed, &[src*="#no-hover"], &[src*="#full-bleed"]) {
 		cursor: zoom-in;
 
 		&:hover {
@@ -90,12 +100,5 @@ img {
 				}
 			}
 		}
-
-		&.transparent,
-		&[src*="#transparent"] {
-			&:hover {
-				box-shadow: none;
-			}
-		}
 	}
 }