.project.cover 
{
	opacity: 0.5;
}

#entry img, #entry video, #entry svg 
{
	width: 20rem;
}

#entry .framed.primary
{
	transform: rotate(-5deg);
}

#entry .framed.mid
{
	transform: translate(16rem, 0rem) rotate(2deg);
}

#entry .framed.low
{
	transform: translate(33rem, 2rem) rotate(6deg);
}

#entry .collage
{
	margin: 0rem 33rem 1rem 1rem;
}

#problem .challenges .foreground
{
	width: 38rem;
}

#problem .challenges .framed
{
	transform: rotate(-2deg);
}

.challenges .descriptions 
{
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto;
}

#homework .project.framed .foreground
{
	width: 30rem;
}

#homework .project.framed.one .foreground,
#homework .project.framed.two .foreground 
{
    width: 24rem;
}

#homework .project.framed.one
{
	left: 18rem;
    top: -6rem;
    transform: rotate(-2deg);
}

#homework .project.framed.two
{
	left: -8rem;
    top: -7rem;
	transform: rotate(1deg);
}

#homework .project.framed.primary
{
	transform: rotate(9deg);
}

#homework .collage
{
	margin: 7rem 12rem 2rem 8rem;
}

#activitysystem .project.framed .foreground
{
	width: 40rem;
}

#activitysystem .project.framed
{
	transform: rotate(2deg);
}

#activitysystem
{
	position: relative;
}

#activitysystem .collage
{
	margin: 8rem 0;
}

#activitysystem .backdrop
{
	width: 152rem;
    transform: translate(-50%, -50%) rotate(-3deg);
    left: 50%;
	top: 50%;
	opacity: 0.25;
}

#mechanics
{
	position: relative;
}

#mechanics video
{
	height: 48rem;
	clip-path: inset(2px);
	margin-bottom: -2rem;
}

#flows
{
	position: relative;
	margin: 3rem 0rem 28rem 0;
}

#flows .framed .foreground
{
	width: 40rem;
}

#flows .framed.primary
{
	transform: rotate(1deg);
}

#flows .framed.two
{
	left: 30rem;
    top: 2rem;
    transform: rotate(-6deg);
}

#flows .backdrop
{
	width: 100rem;
    transform: translate(11%, -5%) rotate(2deg);
    opacity: 0.5;
}

#flows .collage
{
	margin: 0rem 30rem 0rem 0rem;
}

#loop
{
	margin-top: -20rem;
}

.framed.wireframe .foreground
{
	height: 36rem;
	border-width: 1rem;
}

#activities .inspiration
{
	height: 32rem;
    left: -24rem;
    position: absolute;
    top: 5rem;
	opacity: 0.65;
}

#activities .framed.three
{
	left: 12rem;
    transform: rotate(4deg);
    top: 1rem;
}

#activities .framed.two
{
    left: -12rem;
    transform: rotate(-6deg);
    top: 1rem;
}

#activities .framed.one
{
	left: 25rem;
    transform: rotate(-6deg);
}

#activities .framed.framed.primary
{
	transform: rotate(1deg);
}

#activities .collage
{
	margin: 0rem 25rem 1rem 24rem;
}

#memories .inspiration
{
	height: 32rem;
    left: -13rem;
    position: absolute;
    top: 3rem;
	opacity: 0.6;
}

#memories .framed.low
{    
	left: 15rem;
    transform: rotate(10deg);
    top: 2rem;
}

#memories .framed.primary
{
	transform: rotate(3deg);
}

#memories .collage
{
	margin: 0rem 16rem 1rem 13rem;
}

#streaks .inspiration 
{
    height: 32rem;
    left: 28rem;
    position: absolute;
    top: 4rem;
	opacity: 0.6;
}

#streaks .framed.one
{
    left: -14rem;
    top: 2rem;
    transform: rotate(-8deg);
}

#streaks .framed.two
{
	left: 14rem;
    transform: rotate(6deg);
    top: 1rem;
}

#streaks .framed.primary
{
	transform: rotate(-1deg);
}

#streaks .collage
{
	margin: 0rem 25rem 2rem 15rem;
}

#home .inspiration
{
    height: 100%;
    position: absolute;
	left: 16rem;
}

#home .framed.one
{    
	transform: rotate(-6deg);
    top: -1rem;
}

#home .framed.two
{
	left: 16rem;
	top: 2rem;
    transform: rotate(4deg);
}

#home .collage
{
	margin: 1rem 16rem 2rem 1rem;
}

#camping .inspiration
{
	height: 32rem;
    position: absolute;
    left: 32rem;
    top: 3rem;
	opacity: 0.65;
}

#camping .framed.one
{    
	transform: rotate(2deg);
    top: 0rem;
    left: -47rem;
}

#camping .framed.two
{
	left: -32rem;
    top: 1rem;
    transform: rotate(-2deg);
}

#camping .framed.three
{    
	left: -16rem;
    transform: rotate(-4deg);
    top: -1rem;
}

#camping .framed.four
{
    transform: rotate(-1deg);
}

#camping .framed.five
{
	left: 16rem;
    top: -1rem;
    transform: rotate(4deg);
}

#camping .collage
{
	margin: 1rem 29rem 1rem 47rem;
}

#resources .framed.one 
{
    transform: rotate(-8deg);
    top: 2rem;
    left: -16rem;
}

#resources .framed.two 
{
    left: 16rem;
    top: 1rem;
    transform: rotate(2deg);
}

#resources .framed.primary
{    
    transform: rotate(-3deg);
}

#resources .inspiration
{
	position: absolute;
	height: 100%;
}

#resources .inspiration.one 
{
    left: -34rem;
    top: 3rem;
}

#resources .inspiration.two 
{
    left: 33rem;
    top: 1.35em;
}

#resources .collage
{
	margin: 0rem 37rem 2rem 34rem
}

#result .inspiration
{
    left: -24rem;
    top: -5rem;
	height: 48rem;
	position: absolute;
	opacity: 1;
}

#result .collage 
{
    margin: 9rem 0rem 14rem 36rem;
}

#result .framed.one
{
    left: -39rem;
    top: -8rem;
    transform: rotate(-5deg);
}

#result .framed.two
{
    left: -31rem;
    top: 14rem;
    transform: rotate(2deg);
}

#result .framed.three
{
    transform: rotate(5deg);
}

#result .description span
{
	color: var(--accentGreenTxt);
	text-transform: uppercase;
	letter-spacing: -0.025rem;
	font-weight: 400;
}

#result .h4 span
{
	color: var(--accentGreenTxt);
}

@media (max-width: 1920px)
{
	#flows .framed .foreground 
	{
    	width: 30rem;
	}
	
	#flows .framed.two 
	{
		left: 22rem;
	}

	#flows .collage 
	{
 	   margin: 0rem 20rem 0rem 0rem;
	}

	#flows .backdrop 
	{
		width: 80rem;
		transform: translate(20%, -2%) rotate(2deg);
	}

	#flows 
	{
		position: relative;
		margin: 0rem 0rem 25rem 0;
	}
}

@media (max-width: 1600px), (max-height: 1080px)
{
	#entry img, #entry video, #entry svg 
	{
    	width: 16rem;
		border-width: 1rem;
	}

	#entry .framed.mid 
	{
    	transform: translate(13.5rem, 0rem) rotate(2deg);
	}

	#entry .framed.low 
	{
    	transform: translate(27.5rem, 2rem) rotate(6deg);
	}

	#entry .collage 
	{
    	margin: 0rem 26rem 1rem 1rem;
	}

	#problem .challenges .foreground 
	{
    	width: 32rem;
	}

	#homework .project.framed .foreground 
	{
    	width: 24rem;
	}

	#homework .project.framed.one .foreground, 
	#homework .project.framed.two .foreground 
	{
    	width: 20rem;
	}

	#homework .project.framed.one 
	{
		left: 15rem;
		top: -5rem;
	}

	#homework .project.framed.two 
	{
    	left: -7rem;
    	top: -7rem;
	}

	#homework .collage 
	{
    	margin: 7rem 11rem 1rem 7rem;
	}

	#activitysystem .project.framed .foreground 
	{
    	width: 34rem;
	}

	#activitysystem .backdrop 
	{
    	width: 132rem;
	}

	#mechanics video 
	{
    	height: 38rem;
	}

	.framed.wireframe .foreground 
	{
    	height: 30rem;
	}
	
	#activities .inspiration 
	{
		height: 28rem;
		left: -20rem;
		top: 3.5rem;
	}

	#activities .framed.one 
	{
		left: 21rem;
	}
	
	#activities .framed.three 
	{
		left: 10rem;
		top: 0rem;
	}
	
	#activities .framed.two 
	{
		left: -10.5rem;
		top: 0.5rem;
	}

	#activities .collage 
	{
    	margin: 0rem 21rem 1rem 20rem;
	}

	#streaks .inspiration 
	{
		height: 28rem;
		left: 24rem;
		top: 4rem;
	}

	#streaks .framed.one 
	{
		left: -11rem;
		top: 2rem;
	}
	
	#streaks .framed.two 
	{
		left: 12rem;
		transform: rotate(6deg);
		top: 1rem;
	}

	#streaks .collage 
	{
    	margin: 0rem 22rem 2rem 11rem;
	}

	#memories .inspiration 
	{
		height: 28rem;
		left: -11rem;
		top: 2rem;
	}

	#memories .framed.low 
	{
		left: 12rem;
	}
	
	#home .framed.two 
	{
		left: 14rem;
	}
	
	#memories .collage 
	{
    	margin: 0rem 14rem 1rem 11rem;
	}

	#home .inspiration 
	{
    	left: 13rem;
	}
	
	#home .collage 
	{
    	margin: 1rem 14rem 2rem 0rem;
	}

	#camping .framed.five 
	{
		left: 13rem;
	}

	#camping .framed.three 
	{
    	left: -13rem;
	}

	#camping .framed.two 
	{
    	left: -26rem;
	}

	#camping .framed.one 
	{
    	left: -38rem;
	}

	#camping .inspiration 
	{
		height: 28rem;
		left: 26rem;
		top: 2rem;
	}

	#camping .collage 
	{
    	margin: 1rem 24rem 1rem 38rem;
	}

	#resources .framed.one 
	{
    	left: -12rem;
	}

	#resources .framed.two 
	{
    	left: 13rem;
	}

	#resources .inspiration.one 
	{
    	left: -27rem;
	}

	#resources .inspiration.two 
	{
    	left: 27rem;
	}

	#result .inspiration 
	{
		left: -19rem;
		top: -5rem;
		height: 40rem;
	}

	#result .framed.one 
	{
    	left: -30rem;
	}

	#result .framed.two 
	{
		left: -25rem;
		top: 11rem;
	}

	#result .collage 
	{
    	margin: 8rem 0rem 11rem 30rem;
	}
}

@media (max-width: 1360px)
{
	#activitysystem .collage 
	{
    	margin: 2rem 0;
	}

	#mechanics video 
	{
    	height: 30rem;
	}

	#camping .inspiration 
	{
		display: none;
	}

	#camping .collage 
	{
    	margin: 1rem 12rem 1rem 38rem;
	}

	#flows .backdrop 
	{
    	transform: translate(-20%, -6%) rotate(2deg);
	}

	#flows 
	{
    	margin: 0rem 0rem 13rem 0;
	}

	#loop 
	{
    	margin-top: -10rem;
	}
}

@media (max-width: 1024px)
{
	#entry .framed.mid 
	{
    	display: none;
	}
	
	#entry .framed.low 
	{
    	transform: translate(14.5rem, 1rem) rotate(2deg);
	}

	#entry .framed.primary 
	{
    	transform: rotate(-3deg);
	}

	#entry .collage 
	{
    	margin: 0rem 14rem 1rem 0rem;
	}
		
	#homework .project.framed.two,
	#homework .project.framed.one
	{
		display: none;
	}
		
	#homework .project.framed.primary
	{
		transform: rotate(5deg);
	}

	#homework .collage 
	{
    	margin: 1rem 0rem 0rem 0rem;
	}

	#activitysystem .backdrop 
	{
    	width: 90rem;
	}

	#activitysystem .collage 
	{
    	margin: 0;
	}

	#flows .framed.two 
	{
    	display: none;
	}

	#flows .framed.primary 
	{
    	transform: rotate(4deg);
	}

	#flows .collage 
	{
    	margin: 0;
	}

	#activities .inspiration 
	{
		display: none;
	}

	#activities .collage 
	{
	    margin: 0rem 21rem 1rem 10rem;
	}

	#streaks .inspiration 
	{
        left: 11rem;
        top: 2rem;
	}

	#streaks .framed.two 
	{
		display: none;
	}

	#streaks .collage 
	{
    	margin: 0rem 9rem 2rem 13rem;
	}

	#memories .inspiration 
	{
        left: -8rem;
        top: 2rem;
	}
	
	#memories .collage 
	{
    	margin: 0rem 14.5rem 1rem 8rem;
	}

	#home .framed.one 
	{
		display: none;
	}

	#home .framed.two 
	{
    	left: 14rem;
	}	

	#home .inspiration 
	{
    	left: -3rem;
	}

	#home .collage 
	{
    	margin: 1rem 15rem 2rem 3rem;
	}

	#camping .framed.one,
	#camping .framed.five 
	{
    	display: none;
	}

	#resources .inspiration
	{
	    display: none;
	}

	#resources .framed.two 
	{
    	left: 11rem;
	}

	#resources .framed.one 
	{
    	left: -10rem;
	}

	#resources .collage 
	{
    	margin: 0rem 11rem 2rem 11rem;
	}

	#result .inspiration 
	{
		left: -18rem;
		top: -3rem;
	}

	#result .framed.one 
	{
    	left: 0rem;
    	top: 0rem;
	}

	#result .framed.two 
	{
		left: 13.5rem;
		top: 0rem;
	}

	#result .framed.three 
	{
		display: none;
	}

	#result .collage 
	{
    	margin: 1rem 15rem 0rem 9rem;
	}
}

@media (max-width: 640px), (max-height: 800px) and (max-width: 1360px)
{
	#entry img, 
	#entry video, 
	#entry svg 
	{
    	width: 12rem;
	}

	#entry .framed.low 
	{
    	transform: translate(10.75rem, 1rem) rotate(2deg);
	}

	#entry .collage 
	{
	    margin: 0rem 10rem 0rem 0rem;
	}

	#problem .challenges .foreground 
	{
	    width: 22rem;
	}
	
	#homework .project.framed .foreground 
	{
    	width: 19rem;
	}

	#activitysystem .project.framed .foreground 
	{
    	width: 26rem;
	}

	#activitysystem .backdrop 
	{
		width: 80rem;
		top: 0;
		transform: translate(-50%, -14%) rotate(-3deg);
	}

	#activitysystem
	{
		margin-top: 2rem;
	}

	#mechanics video 
	{
    	height: 18rem;
	}

	#flows .framed .foreground 
	{
    	width: 19rem;
	}

	#flows .backdrop 
	{
		transform: translate(-20%, -15%) rotate(-5deg);
		width: 55rem;
	}

	#flows 
	{
    	margin: 5rem 0rem 10rem 0;
	}

	.framed.wireframe .foreground 
	{
    	height: 20rem;
	}

	#activities .framed.three 
	{
		left: 7rem;
		top: 0rem;
	}

	#activities .framed.two 
	{
		left: -7.5rem;
		top: 0.5rem;
	}

	#activities .framed.one 
	{
    	left: 14rem;
	}

	#activities .collage 
	{
    	margin: 0rem 14rem 1rem 8rem;
	}

	#streaks .framed.one 
	{
    	left: -7.5rem;
    	top: 1rem;
	}

	#streaks .inspiration 
	{
		display: none;
	}

	#streaks .collage 
	{
    	margin: 0rem 0rem 1rem 8rem;
	}

	#memories .inspiration 
	{
		display: none;
	}

	#memories .framed.low 
	{
		left: 8rem;
		top: 1rem;
	}

	#memories .collage 
	{
    	margin: 0rem 9rem 1rem 0rem;
	}
	
	#home .inspiration 
	{
    	left: 2rem;
	}

	#home .collage 
	{
    	margin: 0rem 18rem 1rem 0rem;
	}

	#camping .framed.two 
	{
    	left: -21rem;
	}

	#camping .framed.two 
	{
		left: -17rem;
	}

	#camping .framed.three 
	{
    	left: -8.5rem;
	}

	#camping .collage 
	{
    	margin: 1rem 0rem 1rem 17rem;
	}

	#resources .framed.one 
	{
    	left: -9rem;
	}

	#resources .framed.two 
	{
    	display: none;
	}

	#resources .collage 
	{
    	margin: 0rem 1rem 2rem 10rem;
	}

	#result .inspiration 
	{
		left: -13rem;
		top: -5rem;
		height: 30rem;
	}

	#result .framed.one 
	{
    	left: 0;
    	top: 0;
	}

	#result .framed.two 
	{
    	left: 9rem;
    	top: 0;
	}

	#result .collage 
	{
    	margin: 0rem 8.5rem 0rem 1rem;
	}
}