/* COSMIC DREAMS STYLESHEET */

body {
	background-color: #f8f9fa;
}

header {
	width: 100%;
    height: 100px;
    background: linear-gradient(27deg, rgba(22, 192, 233, 1) 0%, rgba(194, 114, 237, 1) 50%, rgba(244, 80, 93, 1) 100%);
}

.hide {
	display:none;
}

.navbar-brand {
	margin: auto;
}
.navbar-brand img {
    height: 40px;
    transform: scale(2.5) translateY(8px);
	filter: drop-shadow(0 .25rem .25rem #00000020);
}

.project-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	grid-gap: 1pc;
}
.project-grid > a {
	width: 100%;
	height: 100%;
	-webkit-box-shadow: inset 0px 0px 0px 1px #00000010;
	box-shadow: inset 0px 0px 0px 1px #00000010;
	border-radius: 1pc;
	outline: 3px solid transparent;
	background-color: #e9ecef;
	transition: .2s;
	overflow:hidden;
}
.project-grid > a:not(.nohover):hover {
    transform: scale(1.05);
    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15);
    transition: .2s;
    cursor: pointer;
    outline-color: #26afe7;
}
.project-grid > a > img {
	width: 100%;
	height: 100%;
}

.lead {
	margin: 1rem auto;
	text-align: center;
}

@media only screen and (max-width : 720px) {
	.project-grid {
		grid-template-columns: auto auto;
	}	
}

@media only screen and (max-width : 420px) {
	.project-grid {
		grid-template-columns: auto;
	}
	.project-grid > a:hover {
		transform: scale(1.03);
	}
}