/* general */
@media (max-width:480px){
	p{
		padding:.5em 0;
		font-size:.9em;
	}
	a{
		font-size:1.1em;
	}
	.email-plane{
		display:none;
		top:2%;left:4%;
	}
	.email-plane a{
		padding:.9em 0 0 1.1em;
		font-size:1em;
	}
	.paperplane{
		margin:0 .5em 0 0;
		width:3em;
	}
	.email-plane:hover .email-field{
		width:230px;
	}
}

/* header */
@media (max-width:880px){
	.larasportfolio{
		width:100%;height:90%;
		background:url(/gfx/larasportfolio-medium.svg)no-repeat center center;
		background-size:77%;
	}
}
@media (max-width:790px){
	.larasportfolio{
		background-size:90%;
	}
}
@media (min-width:400px) and (max-width:600px){
	.larasportfolio{
		width:100%;height:90%;
		background:url(/gfx/larasportfolio.svg)no-repeat center center;
		background-size:85%;
	}
}
@media (max-width:420px){
	.larasportfolio{
		width:100%;height:90%;
		background:url(/gfx/larasportfolio-medium.svg)no-repeat center center;
		background-size:88%;
	}
	header a{
		bottom:7%;
		max-width:210px;

	}
}

/* skills */
@media (max-width:800px){
	#skills{
		height:64em;
	}
	h2{
		font-size:2.5em;
	}
	.step{
		min-height:28em;
	}
	.step:last-child{
		top:-35em;
	}
	.content{
		height:28em;
	}
	.workthing{
		min-height:28em;
	}
	.design .illustration{
		bottom:37%;
	}
	.design .illustration-canvas{
		padding:2.2em 0 0 1.2em;
	}
	.illustration{
		bottom:15%;
		height:15em;
	}
	.step h2.buildtitle{
		bottom:10%;
	}
	.step h2.designtitle{
		bottom:75%;
	}
	.head-image{
		width:13em;
	}
	.design-image{
		width:10em;
	}
	.sublime-image{
		width:13.9em;
	}
}

@media (max-width:410px){
	#skills{
		height:39em;
	}
	h2{
		font-size:1.5em;
	}
	.step{
		min-height:19em;
	}
	.step:last-child{
		top:-42em;
	}
	.content{
		height:19em;
	}
	.workthing{
		min-height:19em;
	}
	.illustration{
		bottom:23%;
		height:8em;
	}
	.design .illustration{
		bottom:43%;
	}
	.design .illustration-canvas{
		padding:1.5em 0 0 .6em;
	}
	.build .illustration{
		bottom:47%;
	}
	.step h2.buildtitle{
		bottom:5%;
	}
	.step h2.designtitle{
		bottom:87%;
	}
	.lightbar{
		height:10%;width:2.3%;
	}
	.head-image{
		width:7em;
	}
	.design-image{
		width:5.9em;
	}
	.sublime-image{
		width:7.5em;
	}
	
}

/* work */
@media (max-width:880px){
	.workitem{
		width:50%;height:33.5vw;
	}
	.workitem:nth-child(2n+2){
		background:#fff;
	}
	.workitem:nth-child(1), .workitem:nth-child(4), .workitem:nth-child(5){
		background:#f4ede7;
	}
}
@media (max-width:480px){
	.workitem{
		width:100%;height:66.5vw;
	}
	.workitem:nth-child(1), .workitem:nth-child(4), .workitem:nth-child(5){
		background:#fff;
	}
	.workitem:nth-child(2n+2){
		background:#f4ede7;
	}
}

/* contact */
@media (max-width:880px){
	.knowmore{
		width:75%;
	}
	.morelara-content{
		width:80%;
	}
	.morelara-content-img{
		width:13em;height:13em;
	}
	.socialbar img{
		max-height:12%;
	}
	.socialbar1 img{
		max-height:10%;
	}
}
@media (max-width:480px){
	.knowmore{
		width:90%;
		font-size:1.05em;
	}
	.morelara{
		height:auto;min-height:100%;
	}
	.morelara-content{
		width:90%;
	}
	.morelara-content-img{
		width:10em;height:10em;
	}
	.close{
		top:3%;right:3.5%;
		width:1.2em;height:1.2em;
	}
	.socialbar img{
		bottom:30%;
		max-height:22%;
		transform:rotate(0deg);-ms-transform:rotate(0deg); -webkit-transform:rotate(0deg);
	}
	.socialbar1 img{
		max-height:18%;
	}
	.socialbar3 img, .socialbar4 img{
		bottom:42%;
	}
	.socialbar{
		display:inline-block;
		top:-3%;
		width:50%;height:55%;
		transform:rotate(0deg);-ms-transform:rotate(0deg); -webkit-transform:rotate(0deg);
	}
	.socialbar:hover img{
		bottom:30%;
	}
	.socialbar3:hover img, .socialbar4:hover img{
		bottom:42%;
	}
	.socialbar3{
		background:#0bb9b3;
	}
	.socialbar4{
		background:#ec1c24;
	}
}

/* work-detail */
@media (max-width:1024px){
	.work-text-canvas{
		padding:1.5em 2em;
		width:40%;
	}
	.work-text-canvas p{
		font-size:1em;
	}
	.work-image-canvas{
		width:60%;
	}
	.work-image-canvas img{
		width:86%;
	}
}
@media (max-width:920px){
	.work-detail{
		overflow:auto;
	}
	.work-text-canvas{
		position:static;
		padding:2em 2.5em;
		width:100%;height:auto;
	}
	.work-image-canvas{
		position:static;
		width:100%;height:auto;
	}
	.work-image-canvas img{
		width:90%;
	}
	.work-image-canvas img:last-child{
		padding-bottom:1em;
	}
	.close2{
		top:3.5%;right:2.3%;
	}
	.work-image-canvas .work-mobile{
		width:60%;
	}
	.work-image-canvas .werk-logo{
		width:60%;
		padding:0 0 4em 0;
	}
}

@media (max-width:500px){
	.work-text-canvas{
		padding:2em 1.5em;
	}
	.work-image-canvas{
		padding:1.5em 0;
	}
	.work-text-canvas p{
		width:100%;
	}
	.work-image-canvas img:last-child{
		padding-bottom:0;
	}
	.work-image-canvas .work-mobile, .work-image-canvas .werk-logo{
		width:90%;
	}
	.work-image-canvas .werk-logo{
		padding:0 0 3.5em 0;
	}
}