.home{
	height           : 100vh;
	background-color : white;
	.top{
		.fadeInTop(1s);
		.delay(0.5);
		margin-bottom : 100px;
		padding-top   : 100px;
		text-align    : center;
		.logo{
			font-size : 4em;
			color     : black;
			svg{
				fill : black;
			}
		}
		p{
			margin-top : 10px;
			font-size  : 1.3em;
			font-style : italic;
			color      : @grey;
		}
	}
	.tools{
		width      : 100%;
		text-align : center;
		.toolContainer{
			.sequentialDelay(0.5s, 1s);
			.fadeInDown(1s);
			.keep();
			opacity      : 0;
			display      : inline-block;


			cursor       : pointer;

			text-align   : center;
			border-right : 5px solid @silver;
			&:last-child{
				border : none;
			}
			.content{
				.addSketch(360px);
				.animate(background-color, 0.5s);
				padding      : 40px;
				width        : 500px;

				&:hover{
					background-color: fade(@red, 20%);
					svg, h2{
						.transform(scale(1.3));
					}
				}

				h2{
					font-family : 'CodeBold';
					font-size   : 2em;
					.animateAll(0.5s);
				}
				p{
					max-width : 300px;
					margin    : 20px auto;
				}
				svg{
					.animateAll(0.5s);
					height : 10em;
				}

			}

		}
	}
}
.addSketch(@length, @color : black){
	&:hover{
		path, line, polyline, circle, rect, polygon{
			.sketch(@length, @color, 2s)
		}
	}
	path, line, polyline, circle, rect, polygon {
		stroke-dasharray  : @length;
		stroke-dashoffset : 0px;
		stroke            : @color;
		stroke-width      : 0.5px;
		fill              : @color;
		//.animateAll(3s);
	}
}
.sketch(@length, @color : black, @duration : 3s, @easing : @defaultEasing){
	.createAnimation(bounce, @duration, @easing);
	.sketchKeyFrames(){
		0% { stroke-dashoffset : 0px; fill:@color;}
		15% { stroke-dashoffset : 0px; fill : transparent}
		50% { stroke-dashoffset : @length; fill: transparent}
		85% { stroke-dashoffset : 0px; fill:transparent;}
		100% { stroke-dashoffset : 0px; fill:@color;}
	}
	@-webkit-keyframes bounce {.sketchKeyFrames();}
	@-moz-keyframes bounce {.sketchKeyFrames();}
	@-ms-keyframes bounce {.sketchKeyFrames();}
	@-o-keyframes bounce {.sketchKeyFrames();}
	@keyframes bounce {.sketchKeyFrames();}
}