.heading-icon {
    	font-size: 64px;
    	margin-right: 16px;
    	margin-bottom: 16px;
    }

	.clipped {
		padding: 2rem 2rem 4rem 4rem;
		-webkit-clip-path: none;
		clip-path: none;
	}

	.story-slant-foreground {
		background-image: url(https://www.clemson.edu/_images/academics/experiential-learning/foreground-film-strip.jpg);
		background-repeat: no-repeat;
		background-size: cover;
		padding: 2rem;

		p {
			font-family: 'Tiempos Text Regular';
			max-width: 600px;
		}
	}

	.story-slant-quote {
		padding: 2rem;

		p {
			font-family: 'trade-gothic-next-condensed';
			font-weight: 600;
			font-size: 25.8px;
			line-height: 1.75rem;
			text-align: right;

			&.name {
				font-family: 'trade-gothic-next-condensed';
				font-weight: 600;
				font-size: 0.975rem;
				line-height: 1rem;
			}
		}

		blockquote {
			border-left-color: #fff;
			color: #fff;
		}
	}


	/* Static Content */


    @media print,
    screen and (min-width: 64em) {
    	.clipped {
    		padding: 4rem 7rem 4rem 6rem;
    		-webkit-clip-path: polygon(0 0, 100% 0%, 80% 100%, 0% 100%);
    		clip-path: polygon(0 0, 100% 0%, 80% 100%, 0% 100%);
    	}

    	.story-slant-background {
    		background-image: url(https://www.clemson.edu/_images/academics/experiential-learning/trillith-students.jpg);
    		background-size: cover;
    		background-repeat: no-repeat;
    		background-position: right bottom;
    	}

    	.story-slant-quote {
    		padding-right: 6rem;
    	}

    	.story-slant-quote p {
    		font-family: 'trade-gothic-next-condensed';
    		font-weight: 600;
    		font-size: 31.2px;
    		line-height: 2.25rem;
    		text-align: right;
    	}

    	.story-slant-quote p.name {
    		font-family: 'trade-gothic-next-condensed';
    		font-weight: 600;
    		font-size: 1.125rem;
    		line-height: 1.25rem;
    	}
    }

    @media print,
    screen and (min-width: 80em) {
    	.clipped {
    		padding: 5rem 16rem 5rem 6rem;
    	}

    	.story-slant-background {
    		background-size: contain;
    	}
    }