*, *:before, *:after {
    -webkit-box-sizing: border-box; 
    -moz-box-sizing: border-box; 
    box-sizing: border-box;
    padding:0;
    margin:0;
	font-family: "Open Sans", sans-serif;
}




body {
	background-color:#0d061a;
}

.flexgrid {
	display:flex;
	justify-content: center;
	flex-direction:row;
	flex-flow:wrap;
	width:100%;
	max-width:80rem;
	position:relative;
	padding: 1em;
	margin-left: auto;
	margin-right: auto;
}  

#content {
    width:100%;
}

.fade {
	opacity:0;
	transition: opacity 1s ease-in;
}

#slides {
	height:15em;
	overflow:hidden;
	position:relative;
	width:100%;
}

.slide {
	position:absolute;
}

#orisha{
	left:-8rem;
	top:-6rem;
	width:120%;
}

#virus-banner {
	width:100%;
	top:-13rem;
}

#filter {
	text-align: center;
	height:3rem;
	line-height:3rem;
	font-size: 1.2rem;
	color:#5B5B5B
}

#filter strong{
	color:#0E9F69
}

.project {

    width:20rem;
	height:20rem;
    
    margin:1.2rem;
}

.project:hover {
	transform: scale(1.03);
	transition: 0.2s;
/*	box-shadow: 0.5em 0.5em 5px #A5A5A5;*/
}

.project .media-frame{
	background-color:white;
	width:100%;
	height:80%;
	overflow:hidden;
}
.project {
	text-decoration:none;
}

.project:visited {
	color:white;
}

.project strong {
	color:#FFC127
}

.project p {
    height:20%;
    width:100%;
	display:block;
	color:white;
	vertical-align: bottom;
	padding:0.75em;
/*	background-color:#191919;*/
	background-color:#000000;
	font-size:0.92rem;
}


/*
@media screen and (min-width:100rem) {
	.flexgrid {
		width:80rem;
		margin-left: auto;
		margin-right: auto;
	}
	
	.project {
    	width:20rem;
		height:20rem;
    	margin:1.2rem;
	}	
}*/