body{
	background-color: #fff;
	font-family: cardo, serif;
}

.title{
	width: 100%;
	padding-top: 42vh;
	text-align: center;
	font-family: cardo, serif;
	letter-spacing: 10px;
	font-size: 10px;
}

.project-list{
	padding-top: 100px;
	list-style-type: none;
	text-align: center;
	font-size: 15px;
	font-family: cardo;
	z-index: 10;
}

.project-list a{
	color: black;
	text-decoration: none;
}
.project-list a:hover{
		text-decoration: underline;
}

.lightbox{
	padding-top: 50px;
	width:100%;
	height:300px;
	z-index: -1;
}

.blobs{
	position: fixed;
	width: 100%;
	height: 100%;
	transform: translate(0%,0%);
	z-index: -10;
	opacity: 0.9;
	
}

#blob1{
	position: fixed;
	top: 110vh;
	left: 40vw;
	transform: translate(-50%,-50%);
	width: 80%;
}
#blob2{
	position: fixed;
	top: 20vh;
	left: 90vw;
	transform: translate(-50%,-50%) rotate(140deg);
	width: 70%;
}
#blob3{
	position: fixed;
	top: 20vh;
	left: 0;
	transform: translate(-50%,-50%);
	width: 60%;
}

.blobCont {
	width: 100%;
	height:100%;
}


#frameCount{
	font-size: 10px;
}

#p5canvas{
	z-index: -1;
}

canvas {
	position : fixed;
	width: 100%;
	top : 0px;
	left : 0px;
/*	display: none;*/
	-webkit-filter: url("#goo");
	filter: none;
	filter: url("#goo");
	z-index: -1;
	
  transform: translateZ(0); /*for older browsers*/
  will-change: transform;
}

@media (max-width : 600px) {
	canvas{
		filter: none;
		-webkit-filter: none;
	}
}