/* Index Hero */

.hero-text {
	margin:64px 0 80px 0;
}

.hero-text h1 {
	margin:0;
}

.hero a {
	text-decoration:none;
	color:var(--color-coral);
}

@media (min-width:600px) and (max-width:899px) {
	.hero-text {
		margin:80px 0 96px 0;
	}
}

@media (min-width:900px) {
	.hero-text {
		margin:80px 0 96px 0;
	}
}










/* Portfolio Grid */

.project-yoga-app {
	background-color:var(--color-project-yoga-app);
}

.project-yoga-website {
	background-color:var(--color-project-yoga-web);
}

.project-soliday {
	background-color:var(--color-project-soliday);
}

.project-offerup {
	background-color:var(--color-project-offerup);
}

.project-greetd {
	background-color:var(--color-project-greetd);
}

.project-yuzuramen {
	background-color:var(--color-project-yuzuramen);
}

.project-pupdiary {
	background-color:var(--color-project-pupdiary);
}

.project-cjbeauty {
	background-color:var(--color-project-cjbeauty);
}

.project-image img {
	display:block;
	width:100%;
}

.project-info {
	display:none;
}

@media (min-width:900px) {
	.cover-image {
		opacity:1;
		transition:.5 ease;
		backface-visibility:hidden;
	}

	.project-info {
		transition:.5s ease;
		opacity:0;
		position:absolute;
		top:50%;
		left:50%;
		transform:translate(-50%,-50%);
		text-align:center;
		display:block;
	}

	.project-card:hover img {
		opacity:0.1;
	}

	.project-card {
		position:relative;
	}

	.project-card:hover .project-info {
		opacity:1;
	}

	.project-card:hover {
		background-color:rgba(0,0,0,1)
	}

	.project-info p,
	.project-info h2 {
		color:var(--color-black);
	}

	.project-info.dark p,
	.project-info.dark h2 {
		color:var(--color-white);
	}

	.sm-project-card {
		display:none;
	}
}

.sm-project-card {
	text-align:center;
}

.sm-project-card figcaption .project-title h2 {
	margin:-18px 0 0 0;
}

.sm-project-card figcaption .project-type p {
	margin:0 0 18px 0;
}

.project-info .project-type p {
	margin:0 0 8px 0;
}

.project-info .project-title h2 {
	margin:0;
}






/* About */

.about-me {
	margin:80px 0;
}

.profile-pic {
	height:400px;
	background-image:url(../img/judytseng.png);
	background-repeat:no-repeat;
	background-position:center;
	background-size:cover;
}

.about-bio h1 {
	margin:0 0 24px 0;
}

#about-heading a {
	text-decoration:none;
	color:var(--color-coral);
}

.about-bio p {
	margin:0 0 24px 0;
}

#about-email a {
	text-decoration:underline;
	color:var(--color-coral);
	margin:0 0 48px 0;
}

.process-info p {
	margin:32px 0 80px 0;
}

#about-footer {
	margin-top:0;
}

.design-process .empty-col {
	display:none;
}

@media (max-width:599px) {
	.profile-pic {
		height:330px;
	}

	.about-bio h1 {
		margin:2px 0 16px 0;
	}

	.about-bio p {
		margin:0 0 16px 0;
	}

	.process-icon,
	.process-info {
		text-align:center;
	}

	.process-info p {
		margin:8px 0 2px 0;
	}
}

@media (min-width:600px) and (max-width:900px) {
	.process-info p {
		margin:8px 0;
	}
}

@media (max-width:899px) {
	.about-me {
		margin:0 0 48px 0;
	}

	#about-email {
		margin:0 0 32px 0;
	}

	#last-process p {
		margin:8px 0 48px 0;
	}
}

@media (min-width:730px) and (max-width:820px) {
	#last-process p {
		margin:8px 0 78px 0;
	}
}

@media (min-width:900px) {
	.design-process .empty-col {
		display:block;
	}
}









/* Yoga app */

/* Final Design */

.yoga-app-mobile-final-design,
.yoga-app-final-empty-col {
	display:block;
}

.yoga-app-desktop-final-design {
	display:none;
}

@media (min-width:600px) {
	.yoga-app-mobile-final-design {
		display:none;
	}

	.yoga-app-desktop-final-design {
		display:block;
	}
}

.yoga-app-final-design-description {
	margin-top:-14px;
}









/* Yoga web */

/* Final Design */

.yoga-web-mobile-final-design {
	display:block;
}

.yoga-web-desktop-final-design {
	display:none;
}

@media (min-width:600px) {
	.yoga-web-mobile-final-design {
		display:none;
	}

	.yoga-web-desktop-final-design {
		display:block;
	}
}

.yoga-web-final-design-description {
	margin-top:-14px;
}









/* Soliday */

@media (min-width:400px) {
	.soliday-problem .section-body .large-img img {
		width:400px;
	}
}

.soliday-solution .section-body .solution-empty-col {
	display:none;
}

.soliday-solution .solution-phone img {
	height:3.5em;
}

@media (min-width:600px) {
	.soliday-solution .solution-phone img {
		height:4em;
	}
}

@media (min-width:900px) {
	.soliday-solution .section-body .solution-empty-col {
		display:block;
	}
}

.soliday-competitor img {
	width:20px;
	float:left;
}

.soliday-competitor h4 {
	margin-bottom:24px;
	padding-left:32px;
}

@media (min-width:600px) {
	.soliday-competitor-lg {
		padding-right:16px;
	}
}

.soliday-current-process .subsection-body p,
.soliday-solution .subsection-body p {
	margin:0;
}

.audience-intro h4 {
	margin:16px 0 12px 0;
}

.audience-intro .subsection-body ul,
.audience-about-list .subsection-body ul {
	margin-bottom:0;
}

.soliday-survey-results .section-body {
	text-align:center;
}

/*@media (min-width:600px) and (max-width:899px) {
	.soliday-survey-results .section-body .large-img img {
		width:60%;
	}
}*/

.learning-goals .subsection-intro h4 {
	margin:0 0 12px 0;
}

.survey-results .section-body p {
	margin:0 0 12px 0;
}

.insights-mobile {
	display:block;
}

.insights-large {
	display:none;
}

.insights-large ul {
	margin-bottom:0;
}

.insights-empty-col {
	display:none;
}

@media (min-width:600px) {
	.insights-mobile {
		display:none;
	}

	.insights-large {
		display:block;
	}

	.insights-empty-col {
		display:block;
	}
}

.project-soliday .insights-large .subsection-title,
.project-soliday .insights-large .subsection-body {
	background-color: var(--color-white);
    padding: 1em calc(2px + 1em);
    color: var(--color-black);
    position: relative;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
    border-radius: 12px;
}

@media (min-width:600px) and (max-width:899px) {
	.project-soliday .insights-large .subsection-body {
		height:216px;
	}

	.project-soliday .insights-large .insights-details {
		grid-column-start: 4;
	    grid-column-end: 6;
	    grid-row-start: 1;
	    grid-row-end: 8;
	}
}

@media (min-width:600px) and (max-width:899px) {
	.project-soliday .insights-large .insights-details {
		grid-column-start: 4;
	    grid-column-end: 6;
	    grid-row-start: 1;
	    grid-row-end: 8;
	}
}

.project-soliday .insights-large .subsection-title.planning {
	margin:0 1em 1em 1em;
}

.project-soliday .insights-large .subsection-title.behaviors {
	margin:0 1em 1em 1em;
}

.project-soliday .insights-large .subsection-title.experiences {
	margin:0 1em 1em 1em;
}


@media (min-width:600px) and (max-width:743px) {
	.project-soliday .insights-large .subsection-body {
		height:272px;
	}
}

@media (min-width:744px) and (max-width:772px) {
	.project-soliday .insights-large .subsection-body {
		height:248px;
	}
}

@media (min-width:773px) and (max-width:832px) {
	.project-soliday .insights-large .subsection-body {
		height:224px;
	}
}

@media (min-width:833px) and (max-width:899px) {
	.project-soliday .insights-large .subsection-body {
		height:200px;
	}
}

@media (min-width:900px) {
	.project-soliday .insights-large .subsection-body {
		height:206px;
	}

	.project-soliday .insights-large .insights-details {
		grid-column-start: 7;
	    grid-column-end: 11;
	    grid-row-start: 1;
	    grid-row-end: 8;
	}
}

.project-soliday .insights-large .subsection-title.active {
	background-color:var(--color-white);
	color:var(--color-project-soliday);
}

.project-soliday .insights-large .subsection-title:hover h4 {
	cursor:default;
}

.project-soliday .insights-large .subsection-title {
	background-color:#7f886d;
	color:var(--color-project-soliday);
}

.project-soliday .insights-large .subsection-title h4 {
	margin:0;
}

.project-soliday .key-insights .accordion dt {
	background-color:#7f886d;
	color:var(--color-project-soliday);
}

.project-soliday .key-insights dt h4,
.project-soliday .key-insights .accordion dt::after {
	color:var(--color-project-soliday);
}

.project-soliday .key-insights .accordion dt.active {
	background-color:var(--color-white);
}

/* Takeaways */

.takeaways-circle {
	background-color:var(--color-coral);
	text-align:center;
	padding:8px;
	border-radius:50%;
	width:100px;
	height:100px;
	margin:0 auto;
	color:var(--color-white);
}

.soliday-takeaways .section-body .subsection-body p {
	margin:12px 0 0 0;
}

@media (min-width:600px) and (max-width:899px) {
	.soliday-takeaways-md-last-item {
		margin:0 0 48px 0;
	}
}

@media (min-width:900px) {
	.soliday-takeaways .section-body .subsection-body p {
		margin:16px 0 0 0;
	}
}

/* Persona */

.target-audience img,
.persona img {
	width:50%;
}

.persona .subsection-body p {
	margin:0;
}

/* Concept Ideation */

.solidayConceptSlides {
	display:none;
	padding:2em;
	display:block;
	background-color:var(--color-white);
	border-radius:16px;
	box-shadow:0px 0px 10px rgba(0, 0, 0, 0.1);
}

.solidayConceptSlides .subsection-title h4:first-child {
	margin-top:24px;
}

.solidayConceptSlides .subsection-body ul {
	margin-bottom:0;
}

.solidayConceptSlides .slide-image img {
	width:100%;
}

@media (min-width:600px) {
	.solidayConceptSlides .slide-image img {
		width:85%;
	}

	.solidayConceptSlides .subsection-title h4:first-child {
		margin-top:0px;
	}
}

.solidayconceptdot {
	cursor:pointer;
	height:16px;
	width:16px;
	margin:24px 16px 48px 16px;
	background-color:var(--color-gray-medium);
	border-radius:50%;
	display:inline-block;
	transition:var(--color-coral) 0.6s ease;
}

@media (min-width:900px) {
	.solidayconceptdot {
		margin:24px 16px 80px 16px;
	}
}

.active, .solidayconceptdot:hover {
	background-color:var(--color-coral);
}

/* Learnings */

.solidayLearningSlides {
	display:none;
	padding:2em;
	display:block;
	background-color:var(--color-white);
	border-radius:16px;
	box-shadow:0px 0px 10px rgba(0, 0, 0, 0.1);
}

.solidayLearningSlides .subsection-title h4:first-child {
	margin-top:24px;
}

.solidayLearningSlides .subsection-body ul {
	margin-bottom:0;
}

.solidayLearningSlides .slide-image img {
	width:50%;
}

@media (min-width:600px) and (max-width:800px) {
	.solidayLearningSlides .slide-image img {
		width:70%;
	}
}

@media (min-width:600px) {
	.solidayLearningSlides .subsection-title h4:first-child {
		margin-top:0px;
	}
}

.solidaylearningdot {
	cursor:pointer;
	height:16px;
	width:16px;
	margin:24px 16px 48px 16px;
	background-color:var(--color-gray-medium);
	border-radius:50%;
	display:inline-block;
	transition:var(--color-coral) 0.6s ease;
}

@media (min-width:900px) {
	.solidaylearningdot {
		margin:24px 16px 80px 16px;
	}
}

.active, .solidaylearningdot:hover {
	background-color:var(--color-coral);
}

/* User Flows */

.soliday-user-flow-tab-group {
	height:70vh;
	overflow:hidden;
	position:relative;
	display:flex;
	flex-direction:column;
}

.tabs {
	display:flex;
}

.soliday-user-flow-tab {
	text-align:center;
	flex:1 1 auto;
	position:relative;
	color:var(--color-coral);
	border-radius:12px 12px 0 0;
}

.soliday-user-flow-tab h4:hover {
	cursor:default;
}

.soliday-user-flow-tab .subsection-title h4 {
	margin:8px 0;
}

.soliday-user-flow-tab::after {
	position:absolute;
	content:'';
	bottom:0;
	left:0;
	width:100%;
	height:0;
	background-color:var(--color-coral);
}

.soliday-user-flow-tab.active {
	background-color:var(--color-coral);
	color:var(--color-white);
}

.soliday-user-flow-tab.active::after {
	height:3px;
}

.tab-contents {
	flex:1 1 auto;
	position:relative;
	overflow:hidden;
	border:1px solid var(--color-coral);
}

.soliday-user-flow-tab-content {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	pointer-events:none;
	opacity:0;
	transition:0.3s;
	overflow:auto;
	background-color:var(--color-white);
}

.soliday-user-flow-tab-content.active {
	opacity:1;
	pointer-events:initial;
	background-color:var(--color-white);
}

.soliday-user-flow-tab-content h5 {
	text-align:left;
	margin:24px 24px 16px 24px;
}

.soliday-user-flow-1-img {
	background-image:url(../img/soliday_userflow_1_sm.png);
	background-repeat:no-repeat;
	background-position:center;
	background-size:contain;
	height:400px;
	margin:0 auto;
}

.soliday-user-flow-2-img {
	background-image:url(../img/soliday_userflow_2_sm.png);
	background-repeat:no-repeat;
	background-position:center;
	background-size:contain;
	height:400px;
	margin:0 auto;
}

.soliday-user-flow-3-img {
	background-image:url(../img/soliday_userflow_3_sm.png);
	background-repeat:no-repeat;
	background-position:center;
	background-size:contain;
	height:350px;
	margin:0 auto;
}

.soliday-user-flow-4-img {
	background-image:url(../img/soliday_userflow_4_sm.png);
	background-repeat:no-repeat;
	background-position:center;
	background-size:contain;
	height:240px;
	margin:0 auto;
}

@media (min-width:600px) {
	.soliday-user-flow-1-img {
		background-image:url(../img/soliday_userflow_1_lg.png);
		width:550px;
		height:110px;
	}

	.soliday-user-flow-2-img {
		background-image:url(../img/soliday_userflow_2_lg.png);
		width:550px;
		height:110px;
	}

	.soliday-user-flow-3-img {
		background-image:url(../img/soliday_userflow_3_lg.png);
		width:550px;
		height:110px;
	}

	.soliday-user-flow-4-img {
		background-image:url(../img/soliday_userflow_4_lg.png);
		width:550px;
		height:60px;
	}
}

@media (min-width:600px) and (max-width:899px) {
	.soliday-user-flow-tab-group {
		height:24vh;
	}
}

@media (min-width:900px) {
	.soliday-user-flow-tab-group {
		height:32vh;
	}
}

.soliday-user-flow-tab-content img {
	height:80%;
	margin:0 auto;
}

.soliday-user-flow-sm {
	display:block;
}

.soliday-user-flow-lg {
	display:none;
}

@media (min-width:600px) {
	.soliday-user-flow-sm {
		display:none;
	}

	.soliday-user-flow-lg {
		display:block;
	}
}

/* Wireframes */

.soliday-lofi .subsection-title p {
	margin:0;
}

/* Final Design */

.soliday-mobile-final-design,
.soliday-final-empty-col {
	display:block;
}

.soliday-desktop-final-design {
	display:none;
}

@media (min-width:600px) {
	.soliday-mobile-final-design {
		display:none;
	}

	.soliday-desktop-final-design {
		display:block;
	}
}

.soliday-final-design-description {
	margin-top:-14px;
}










/* OfferUp */

/* Introduction */

.offerup-introduction .section-body .offerup-introduction-empty-col,
.offerup-introduction .section-body .offerup-introduction-current-empty-col {
	display:none;
}

.offerup-introduction .subsection-title p {
	margin:0 0 8px 0;;
}

@media (min-width:600px) and (max-width:899px) {
	.offerup-introduction-current {
		margin-top:32px;
	}

	.offerup-introduction .section-body .offerup-introduction-current-empty-col {
		display:block;
	}
}

@media (min-width:900px) {
	.offerup-introduction-current {
		margin-top:24px;
	}

	.offerup-introduction .section-body .offerup-introduction-current-empty-col {
		display:block;
	}
}

.offerup-problem .section-body .problem-empty-col {
	display:none;
}

.offerup-problem .problem-price img,
.offerup-problem .problem-info img {
	height:3.5em;
}

@media (min-width:600px) {
	.offerup-problem .problem-price img,
	.offerup-problem .problem-info img {
		height:4em;
	}
}

@media (min-width:900px) {
	.offerup-introduction .section-body .offerup-introduction-empty-col,
	.offerup-problem .section-body .problem-empty-col {
		display:block;
	}
}

.offerup-introduction .subsection-body p,
.offerup-problem .subsection-body p{
	margin:0;
}

.offerup-current-design .last-large-item p {
	margin:0;
}

.offerup-current-design-empty-col {
	display:none;
}

@media (min-width:600px) {
	.offerup-current-design-empty-col {
		display:block;
	}
}

/* Statistics */

.stats-circle {
	background-color:var(--color-coral);
	text-align:center;
	padding:8px;
	border-radius:50%;
	width:100px;
	height:100px;
	margin:0 auto;
	color:var(--color-white);
}

.offerup-stats .section-body .subsection-body p {
	margin:12px 0 0 0;
	text-align:center;
}

@media (min-width:600px) and (max-width:899px) {
	.offerup-stats-md-last-item {
		margin:0 0 48px 0;
	}
}

@media (min-width:900px) {
	.offerup-stats .section-body .subsection-body p {
		margin:16px 0 0 0;
	}
}

/* Competitive Analysis */

.offerup-ca-tab-group {
	height:648px;
	overflow:hidden;
	position:relative;
	display:flex;
	flex-direction:column;
}

.offerup-ca-tab {
	text-align:center;
	flex:1 1 auto;
	position:relative;
	color:var(--color-coral);
	border-radius:12px 12px 0 0;
}

.offerup-ca-tab h4:hover {
	cursor:default;
}

.offerup-ca-tab .subsection-title h4 {
	margin:8px 0;
}

.offerup-ca-tab::after {
	position:absolute;
	content:'';
	bottom:0;
	left:0;
	width:100%;
	height:0;
	background-color:var(--color-coral);
}

.offerup-ca-tab.active {
	background-color:var(--color-coral);
	color:var(--color-white);
}

.offerup-ca-tab.active::after {
	height:3px;
}

.offerup-ca-tab-group .tab-contents {
	margin-bottom:48px;
}

.offerup-ca-tab-content {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	pointer-events:none;
	opacity:0;
	transition:0.3s;
	overflow:auto;
	background-color:var(--color-white);
}

.offerup-ca-tab-content.active {
	opacity:1;
	pointer-events:initial;
	background-color:var(--color-white);
}

.offerup-ca-tab-content img {
	width:30%;
	margin:0 auto;
}

@media (min-width:600px) and (max-width:899px) {
	.offerup-ca-tab-group {
		height:453px;
	}

	.offerup-ca-tab-content img {
		width:70%;
	}
}

.offerup-ca-empty-col {
	display:none;
}

@media (min-width:900px) {
	.offerup-ca-tab-group .tab-contents {
		margin-bottom:80px;
	}

	.offerup-ca-tab-group {
		height:474px;
	}

	.offerup-ca-tab-content img {
		width:80%;
	}

	.offerup-ca-empty-col {
		display:block;
	}
}

/* Target Audience Interview */

.offerup-ta-interview-tab-group {
	height:715px;
	overflow:hidden;
	position:relative;
	display:flex;
	flex-direction:column;
}

.offerup-ta-interview-tab {
	text-align:center;
	flex:1 1 auto;
	position:relative;
	color:var(--color-coral);
	border-radius:12px 12px 0 0;
}

.offerup-ta-interview-tab h4:hover {
	cursor:default;
}

.offerup-ta-interview-tab .subsection-title h4 {
	margin:8px 0;
}

.offerup-ta-interview-tab::after {
	position:absolute;
	content:'';
	bottom:0;
	left:0;
	width:100%;
	height:0;
	background-color:var(--color-coral);
}

.offerup-ta-interview-tab.active {
	background-color:var(--color-coral);
	color:var(--color-white);
}

.offerup-ta-interview-tab.active::after {
	height:3px;
}

.offerup-ta-interview-tab-group .tab-contents {
	margin-bottom:48px;
}

.offerup-ta-interview-tab-content {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	pointer-events:none;
	opacity:0;
	transition:0.3s;
	overflow:auto;
	background-color:var(--color-white);
}

.offerup-ta-interview-tab-content.active {
	opacity:1;
	pointer-events:initial;
	background-color:var(--color-white);
}

.offerup-ta-interview-tab-content img {
	width:70%;
	margin:0 auto;
	border-radius:50%;
}

.offerup-ta-interview-tab-content .subsection-body h5 {
	margin:0;
}

.offerup-ta-interview-tab-content .subsection-body ul {
	margin:0;
}

@media (min-width:600px) and (max-width:899px) {
	.offerup-ta-interview-tab-group {
		height:434px;
	}

	.offerup-ta-interview-tab-content img {
		width:90%;
		margin:48px auto 0 auto;
	}
}

.offerup-ta-interview-empty-col {
	display:none;
}

@media (min-width:900px) {
	.offerup-ta-interview-tab-group .tab-contents {
		margin-bottom:80px;
	}

	.offerup-ta-interview-tab-group {
		height:436px;
	}

	.offerup-ta-interview-tab-content img {
		width:100%;
		margin:24px auto 0 auto;
	}

	.offerup-ta-interview-empty-col {
		display:block;
	}
}

/* Design Opportunities */

.offerup-design-op .subsection-body p {
	margin:0;
}

.offerup-design-op-empty-col {
	display:none;
}

@media (min-width:900px) {
	.offerup-design-op-empty-col {
		display:block;
	}
}

.offerup-design-op-home,
.offerup-design-op-filter,
.offerup-design-op-create {
	margin-top:-14px;
}

.offerup-design-op-filter {
	margin-bottom:2px;
}

@media (min-width:600px) and (max-width:899px) {
	.offerup-design-op-home,
	.offerup-design-op-filter{
		margin:0 0 16px 0;
	}

	.offerup-design-op-create {
		margin-top:0;
	}
}

/* Personas */

.offerup-personas-tab-group {
	height:703px;
	overflow:hidden;
	position:relative;
	display:flex;
	flex-direction:column;
}

.offerup-personas-tab {
	text-align:center;
	flex:1 1 auto;
	position:relative;
	color:var(--color-coral);
	border-radius:12px 12px 0 0;
}

.offerup-personas-tab h4:hover {
	cursor:default;
}

.offerup-personas-tab .subsection-title h4 {
	margin:8px 0;
}

.offerup-personas-tab::after {
	position:absolute;
	content:'';
	bottom:0;
	left:0;
	width:100%;
	height:0;
	background-color:var(--color-coral);
}

.offerup-personas-tab.active {
	background-color:var(--color-coral);
	color:var(--color-white);
}

.offerup-personas-tab.active::after {
	height:3px;
}

.offerup-personas-tab-group .tab-contents {
	margin-bottom:48px;
}

.offerup-personas-tab-content {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	pointer-events:none;
	opacity:0;
	transition:0.3s;
	overflow:auto;
	background-color:var(--color-white);
}

.offerup-personas-tab-content.active {
	opacity:1;
	pointer-events:initial;
	background-color:var(--color-white);
}

.offerup-personas-tab-content img {
	width:70%;
	margin:0 auto;
	border-radius:50%;
}

.offerup-personas-tab-content .subsection-body h5 {
	margin:0;
}

.offerup-personas-tab-content .subsection-body ul {
	margin:0;
}

@media (min-width:600px) and (max-width:899px) {
	.offerup-personas-tab-group {
		height:398px;
	}

	.offerup-personas-tab-content img {
		width:90%;
		margin:32px auto 0 auto;
	}
}

.offerup-personas-empty-col {
	display:none;
}

@media (min-width:900px) {
	.offerup-personas-tab-group .tab-contents {
		margin-bottom:80px;
	}

	.offerup-personas-tab-group {
		height:436px;
	}

	.offerup-personas-tab-content img {
		width:100%;
		margin:24px auto 0 auto;
	}

	.offerup-personas-empty-col {
		display:block;
	}
}

/* Task Flows */

.offerup-task-flows-tab-group {
	height:545px;
	overflow:hidden;
	position:relative;
	display:flex;
	flex-direction:column;
}

.offerup-task-flows-tab {
	text-align:center;
	flex:1 1 auto;
	position:relative;
	color:var(--color-coral);
	border-radius:12px 12px 0 0;
}

.offerup-task-flows-tab h4:hover {
	cursor:default;
}

.offerup-task-flows-tab .subsection-title h4 {
	margin:8px 0;
}

.offerup-task-flows-tab::after {
	position:absolute;
	content:'';
	bottom:0;
	left:0;
	width:100%;
	height:0;
	background-color:var(--color-coral);
}

.offerup-task-flows-tab.active {
	background-color:var(--color-coral);
	color:var(--color-white);
}

.offerup-task-flows-tab.active::after {
	height:3px;
}

.offerup-task-flows-tab-content {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	pointer-events:none;
	opacity:0;
	transition:0.3s;
	overflow:auto;
	background-color:var(--color-white);
}

.offerup-task-flows-tab-content.active {
	opacity:1;
	pointer-events:initial;
	background-color:var(--color-white);
}

.offerup-task-flows-tab-content h5 {
	text-align:left;
	margin:24px 24px 0 24px;
}

.offerup-user-task-1-img {
	background-image:url(../img/offerup_task_1_sm.png);
	background-repeat:no-repeat;
	background-position:center;
	background-size:contain;
	height:420px;
	margin:0 auto;
}

.offerup-user-task-2-img {
	background-image:url(../img/offerup_task_2_sm.png);
	background-repeat:no-repeat;
	background-position:center;
	background-size:contain;
	height:325px;
	margin:0 auto;
}

.offerup-user-task-3-img {
	background-image:url(../img/offerup_task_3_sm.png);
	background-repeat:no-repeat;
	background-position:center;
	background-size:contain;
	height:400px;
	margin:0 auto;
}

@media (min-width:600px) and (max-width:899px) {
	.offerup-task-flows-tab-group {
		height:315px;
	}

	.offerup-user-task-1-img {
		background-image:url(../img/offerup_task_1_lg.png);
		height:161px;
	}

	.offerup-user-task-2-img {
		background-image:url(../img/offerup_task_2_lg.png);
		height:130px;
	}

	.offerup-user-task-3-img {
		background-image:url(../img/offerup_task_3_lg.png);
		height:130px;
	}
}

@media (min-width:900px) {
	.offerup-task-flows-tab-group {
		height:400px;
	}

	.offerup-user-task-1-img {
		background-image:url(../img/offerup_task_1_lg.png);
		height:246px;
	}

	.offerup-user-task-2-img {
		background-image:url(../img/offerup_task_2_lg.png);
		height:200px;
	}

	.offerup-user-task-3-img {
		background-image:url(../img/offerup_task_3_lg.png);
		height:200px;
	}
}

/* Wireframes */

.offerupWireframesSlides {
	display:none;
	padding:2em;
	display:block;
	background-color:var(--color-white);
	border-radius:16px;
	box-shadow:0px 0px 10px rgba(0, 0, 0, 0.1);
}

.offerupWireframesSlides .subsection-title h4:first-child {
	margin-top:24px;
}

.offerupWireframesSlides .subsection-body p {
	margin:0;
}

@media (min-width:600px) {
	.offerupWireframesSlides .subsection-title h4:first-child {
		margin-top:16px;
	}
}

.offerupWireframesdot {
	cursor:pointer;
	height:16px;
	width:16px;
	margin:24px 16px 48px 16px;
	background-color:var(--color-gray-medium);
	border-radius:50%;
	display:inline-block;
	transition:var(--color-coral) 0.6s ease;
}

@media (min-width:900px) {
	.offerupWireframesdot {
		margin:24px 16px 80px 16px;
	}
}

.active, .offerupWireframesdot:hover {
	background-color:var(--color-coral);
}

.offerup-wireframes-1 {
	background-image:url(../img/offerup_wireframes_1_sm.png);
	background-repeat:no-repeat;
	background-position:center;
	background-size:contain;
	height:350px;
	margin:0 auto;
}

.offerup-wireframes-2 {
	background-image:url(../img/offerup_wireframes_2_sm.png);
	background-repeat:no-repeat;
	background-position:center;
	background-size:contain;
	height:350px;
	margin:0 auto;
}

.offerup-wireframes-3 {
	background-image:url(../img/offerup_wireframes_3_sm.png);
	background-repeat:no-repeat;
	background-position:center;
	background-size:contain;
	height:350px;
	margin:0 auto;
}

.offerup-wireframes-empty-col {
	display:none;
}

@media (min-width:600px) {
	.offerup-wireframes-1 {
		background-image:url(../img/offerup_wireframes_1_lg.png);
		height:220px;
	}

	.offerup-wireframes-2 {
		background-image:url(../img/offerup_wireframes_2_lg.png);
		height:220px;
	}

	.offerup-wireframes-3 {
		background-image:url(../img/offerup_wireframes_3_lg.png);
		height:220px;
	}
}

@media (min-width:900px) {
	.offerup-wireframes-empty-col {
		display:block;
	}
}

/* User Testing */

.offerup-user-testing .section-body .subsection-body p,
.offerup-user-testing .section-body .subsection-body ul {
	margin-bottom:0;
}

.offerup-user-testing-empty-col {
	display:none;
}

@media (min-width:900px) {
	.offerup-user-testing-empty-col {
		display:block;
	}
}

/* Design Decisions */

.offerupDecisionsSlides {
	display:none;
	padding:2em;
	display:block;
	background-color:var(--color-white);
	border-radius:16px;
	box-shadow:0px 0px 10px rgba(0, 0, 0, 0.1);
}

.offerupDecisionsSlides .subsection-title h4:first-child {
	margin-top:0;
}

.offerupDecisionsSlides .subsection-body p {
	margin:0;
}

@media (min-width:600px) {
	.offerupDecisionsSlides .subsection-title h4:first-child {
		margin-top:0;
	}
}

.offerupDecisionsdot {
	cursor:pointer;
	height:16px;
	width:16px;
	margin:24px 16px 48px 16px;
	background-color:var(--color-gray-medium);
	border-radius:50%;
	display:inline-block;
	transition:var(--color-coral) 0.6s ease;
}

.active, .offerupDecisionsdot:hover {
	background-color:var(--color-coral);
}

@media (min-width:900px) {
	.offerupDecisionsdot {
		margin:24px 16px 80px 16px;
	}
}

.offerup-design-decisions .subsection-title p {
    margin:-24px 0 0 0;
}

/* Final Design */

.offerup-mobile-final-design,
.offerup-final-empty-col {
	display:block;
}

.offerup-desktop-final-design {
	display:none;
}

@media (min-width:600px) {
	.offerup-mobile-final-design {
		display:none;
	}

	.offerup-desktop-final-design {
		display:block;
	}
}

.offerup-final-design-description {
	margin-top:-14px;
}

/*@media (min-width:600px) and (max-width:899px) {
	.offerup-final-lg-last-item {
		margin:0 0 48px 0;
	}
}

@media (min-width:900px) {
	.offerup-final-lg-last-item {
		margin:0 0 80px 0;
	}
}*/










/* Greetd */

/* Findings */

.greetd-interview .subsection-body p {
	margin-bottom:0;
}

/* Competitive Analysis */

.greetd-ca-tab-group {
	height:741px;
	overflow:hidden;
	position:relative;
	display:flex;
	flex-direction:column;
}

.greetd-ca-tab {
	text-align:center;
	flex:1 1 auto;
	position:relative;
	color:var(--color-coral);
	border-radius:12px 12px 0 0;
}

.greetd-ca-tab .subsection-title h4 {
	margin:8px 0;
}

.greetd-ca-tab h4:hover {
	cursor:default;
}

.greetd-ca-tab::after {
	position:absolute;
	content:'';
	bottom:0;
	left:0;
	width:100%;
	height:0;
	background-color:var(--color-coral);
}

.greetd-ca-tab.active {
	background-color:var(--color-coral);
	color:var(--color-white);
}

.greetd-ca-tab.active::after {
	height:3px;
}

.greetd-ca-tab-content {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	pointer-events:none;
	opacity:0;
	transition:0.3s;
	overflow:auto;
	background-color:var(--color-white);
}

.greetd-ca-tab-content.active {
	opacity:1;
	pointer-events:initial;
	background-color:var(--color-white);
}

.greetd-ca-tab-content h5 {
	text-align:left;
	margin:0 0 12px 0;
}

@media (min-width:600px) and (max-width:899px) {
	.greetd-ca-tab-group {
		height:410px;
	}
}

@media (min-width:900px) {
	.greetd-ca-tab-group {
		height:420px;
	}

	.greetd-ca-tab-content h5 {
		margin:0 0 16px 0;
	}
}

@media (min-width:600px) and (max-width:899px) {
	.greetd-ca-md-last-item {
		margin:0 0 48px 0;
	}
}

/* Solutions */

.feature-circle {
	background-color:var(--color-coral);
	text-align:center;
	padding:8px;
	border-radius:50%;
	width:100px;
	height:100px;
	margin:0 auto;
	color:var(--color-white);
}

.greetd-solutions .section-body .subsection-body p {
	margin:12px 0 0 0;
}

@media (min-width:600px) and (max-width:899px) {
	.greetd-solutions-md-last-item {
		margin:0 0 48px 0;
	}
}

@media (min-width:900px) {
	.greetd-solutions .section-body .subsection-body p {
		margin:16px 0 0 0;
	}
}

/* Personas */

.greetd-personas-tab-group {
	height:710px;
	overflow:hidden;
	position:relative;
	display:flex;
	flex-direction:column;
}

.greetd-personas-tab {
	text-align:center;
	flex:1 1 auto;
	position:relative;
	color:var(--color-coral);
	border-radius:12px 12px 0 0;
}

.greetd-personas-tab h4:hover {
	cursor:default;
}

.greetd-personas-tab .subsection-title h4 {
	margin:8px 0;
}

.greetd-personas-tab::after {
	position:absolute;
	content:'';
	bottom:0;
	left:0;
	width:100%;
	height:0;
	background-color:var(--color-coral);
}

.greetd-personas-tab.active {
	background-color:var(--color-coral);
	color:var(--color-white);
}

.greetd-personas-tab.active::after {
	height:3px;
}

.greetd-personas-tab-group .tab-contents {
	margin-bottom:48px;
}

.greetd-personas-tab-content {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	pointer-events:none;
	opacity:0;
	transition:0.3s;
	overflow:auto;
	background-color:var(--color-white);
}

.greetd-personas-tab-content.active {
	opacity:1;
	pointer-events:initial;
	background-color:var(--color-white);
}

.greetd-personas-tab-content img {
	width:50%;
	margin:0 auto;
}

.greetd-personas-tab-content .subsection-body h5 {
	margin:0;
}

.greetd-personas-tab-content .subsection-body ul {
	margin:0;
}

@media (min-width:600px) and (max-width:899px) {
	.greetd-personas-tab-group {
		height:485px;
	}

	.greetd-personas-tab-content img {
		width:80%;
		margin:32px auto 0 auto;
	}
}

.greetd-personas-empty-col {
	display:none;
}

@media (min-width:900px) {
	.greetd-personas-tab-group .tab-contents {
		margin-bottom:80px;
	}

	.greetd-personas-tab-group {
		height:517px;
	}

	.greetd-personas-tab-content img {
		width:100%;
		margin:24px auto 0 auto;
	}

	.greetd-personas-empty-col {
		display:block;
	}
}

/* User Flows */

.greetd-flows-tab-group {
	height:600px;
	overflow:hidden;
	position:relative;
	display:flex;
	flex-direction:column;
}

.greetd-flows-tab {
	text-align:center;
	flex:1 1 auto;
	position:relative;
	color:var(--color-coral);
	border-radius:12px 12px 0 0;
}

.greetd-flows-tab h4:hover {
	cursor:default;
}

.greetd-flows-tab .subsection-title h4 {
	margin:8px 0;
}

.greetd-flows-tab::after {
	position:absolute;
	content:'';
	bottom:0;
	left:0;
	width:100%;
	height:0;
	background-color:var(--color-coral);
}

.greetd-flows-tab.active {
	background-color:var(--color-coral);
	color:var(--color-white);
}

.greetd-flows-tab.active::after {
	height:3px;
}

.greetd-flows-tab-content {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	pointer-events:none;
	opacity:0;
	transition:0.3s;
	overflow:auto;
	background-color:var(--color-white);
}

.greetd-flows-tab-content.active {
	opacity:1;
	pointer-events:initial;
	background-color:var(--color-white);
}

.greetd-flows-tab-content h5 {
	text-align:left;
	margin:24px 24px 16px 24px;
}

.greetd-flows-tab-group .tab-contents {
    margin-bottom:48px;
}

.greetd-task-1-img {
	background-image:url(../img/greetd_task_1_sm.png);
	background-repeat:no-repeat;
	background-position:center;
	background-size:contain;
	height:380px;
	margin:0 auto;
}

.greetd-task-2-img {
	background-image:url(../img/greetd_task_2_sm.png);
	background-repeat:no-repeat;
	background-position:center;
	background-size:contain;
	height:330px;
	margin:0 auto;
}

.greetd-task-3-img {
	background-image:url(../img/greetd_task_3_sm.png);
	background-repeat:no-repeat;
	background-position:center;
	background-size:contain;
	height:420px;
	margin:0 auto;
}

@media (min-width:600px) and (max-width:899px) {
	.greetd-flows-tab-group {
		height:300px;
	}

	.greetd-task-1-img {
		background-image:url(../img/greetd_task_1_lg.png);
		height:115px;
	}

	.greetd-task-2-img {
		background-image:url(../img/greetd_task_2_lg.png);
		height:115px;
	}

	.greetd-task-3-img {
		background-image:url(../img/greetd_task_3_lg.png);
		height:110px;
	}
}

@media (min-width:900px) {
	.greetd-flows-tab-group {
		height:380px;
	}

	.greetd-task-1-img {
		background-image:url(../img/greetd_task_1_lg.png);
		height:160px;
	}

	.greetd-task-2-img {
		background-image:url(../img/greetd_task_2_lg.png);
		height:160px;
	}

	.greetd-task-3-img {
		background-image:url(../img/greetd_task_3_lg.png);
		height:150px;
	}

	.greetd-flows-tab-group .tab-contents {
	    margin-bottom:80px;
	}
}

/* Wireframes */

.greetd-lofi .subsection-title p {
	margin:0;
}

/* Final Design */

.greetd-mobile-final-design,
.greetd-final-empty-col {
	display:block;
}

.greetd-desktop-final-design {
	display:none;
}

@media (min-width:600px) {
	.greetd-mobile-final-design {
		display:none;
	}

	.greetd-desktop-final-design {
		display:block;
	}
}

.greetd-final-design-description {
	margin-top:-14px;
}

/* Campaigns */

.greetd-campaigns .subsection-title h4 {
	margin-top:-14px;
}

.greetd-campaigns .subsection-body p {
	margin-bottom:0;
}

.greetd-campaigns-md-left {
	margin:0 0 48px 0;
}

@media (min-width:600px) and (max-width:899px) {
	.greetd-campaigns .subsection-title h4 {
		margin-top:0;
	}

	.greetd-campaigns .subsection-body p {
		margin-bottom:0;
	}

	.greetd-campaigns-md-right {
		grid-column:4/7;
		margin:0 0 48px 0;
	}

	.greetd-campaigns-md-left {
		grid-column:1/4;
		grid-row:2;
		margin:0;
	}
}

@media (min-width:900px) {
	.greetd-campaigns-md-right {
		grid-column:7/13;
		margin:0 0 80px 0;
	}

	.greetd-campaigns-md-left {
		grid-column:1/7;
		grid-row:2;
		margin:0;
	}
}

/* Final Design 

.greetd-final-design-description .subsection-body p {
	margin-bottom:0;
}

.greetd-mobile-final-design,
.greetd-final-empty-col {
	display:block;
}

.greetd-desktop-final-design {
	display:none;
}

@media (min-width:600px) {
	.greetd-mobile-final-design {
		display:none;
	}

	.greetd-desktop-final-design {
		display:block;
	}
}

.greetd-final-design-description {
	margin-top:-14px;
} */











/* Yuzu Ramen /*

/* About */

.yuzu-about .subsection-body p {
	margin:-18px 0 0 0;
}

.yuzu-about-empty-col {
	display:none;
}

@media (min-width:600px) {
	.yuzu-about .subsection-body p {
		margin:0;
	}
}

@media (min-width:900px) {
	.yuzu-about-empty-col {
		display:block;
	}
}

/* Potentials */

.yuzu-potentials .subsection-body p {
	margin:8px 0 0 0;
}

.yuzu-potentials img {
	border-radius:50%;
	width:70%;
}

/* Target Market */


/*@media (min-width:600px) {
	.yuzu-target .subsection-body p {
		margin:0;
	}
}

.yuzu-target .subsection-body ul {
	margin:0;
}*/

/* Yuzu Competitors */

.yuzu-ca-sm {
	display:block;
}

.yuzu-ca-lg {
	display:none;
}

.yuzu-competitors .subsection-title h4 {
	margin:12px 0 8px 0;
}

@media (min-width:600px) {
	.yuzu-competitors .yuzu-ca-des h4 {
		margin-top:0;
	}
}

@media (min-width:900px) {
	.yuzu-ca-sm {
		display:none;
	}

	.yuzu-ca-lg {
		display:block;
	}

	.yuzu-competitors .subsection-title h4 {
		margin:16px 0 8px 0;
	}
}

/* Branding */

.branding-empty-col {
	display:none;
}

.yuzu-branding .subsection-body p {
	margin-bottom:0;
}

@media (min-width:900px) {
	.branding-empty-col {
		display:block;
	}

	.yuzu-branding.subsection-body p {
		margin:0 0 24px 0;
	}
}

/* Collateral */

.yuzu-collateral .collateral-img img {
	margin-top:-18px;
}

@media (min-width:600px) and (max-width:899px) {
	.yuzu-collateral .collateral-img img {
		margin-top:-4px;
	}
}

@media (min-width:900px) {
	.yuzu-collateral .collateral-img img {
		margin-top:0;
	}
}

.yuzu-ad .subsection-body p {
	margin-bottom:0;
}

/* Final Design */

.yuzu-final .subsection-body p {
	margin:-18px 0 0 0;
}

@media (min-width:600px) {
	.yuzu-final .subsection-body p {
		margin:0;
	}
}

/*.yuzu-menu-empty-col,
.yuzu-website-empty-col {
	display:none;
}

@media (min-width:900px) {
	.yuzu-menu-empty-col,
	.yuzu-website-empty-col {
		display:block;
	}
}

.yuzu-menu .subsection-body p {
	margin:-18px 0 0 0;
}

@media (min-width:900px) {
	.yuzu-menu .subsection-body p {
		margin:0;
	}
}*/














/* Pup Diary */

.pup-lofi-wireframes .subsection-title p {
	margin:0;
}

@media (min-width:600px) and (max-width:899px) {
	.pup-persona .section-body .audience-intro .subsection-body {
		margin-bottom:48px;
	}
}

.pup-mobile-final-design,
.pup-final-empty-col {
	display:block;
}

.pup-desktop-final-design {
	display:none;
}

@media (min-width:600px) {
	.pup-mobile-final-design {
		display:none;
	}

	.pup-desktop-final-design {
		display:block;
	}
}

.pup-final-design-description {
	margin-top:-14px;
}















/* CJ Beauty */

.cj-sitemap .sitemap-img img {
	width:100%;
}

.cj-moodboard .moodboard-img img {
	width:100%;
	margin-bottom:48px;
}

@media (min-width:900px) {
	.cj-moodboard .moodboard-img img {
		margin-bottom:80px;
	}
}

.cj-lofi-wireframes .subsection-title p,
.cj-hifi-wireframes .subsection-title p {
	margin:0;
}

@media (max-width:900px) {
	.cj-wireframe-sm-right {
		grid-column:4/7;
	}

	.cj-wireframe-sm-left {
		grid-column:1/4;
		grid-row:2;
	}

	.gray-bg .cj-wireframe-sm-right .subsection-title p {
		margin:0 0 48px 0;
	}
}

@media (min-width:900px) {
	.gray-bg .cj-hifi-lg-last .subsection-title p {
		margin:0 0 80px 0;
	}
}