/*----------Projects---------*/
/*----------General---------*/
h2, h3, h4{margin-bottom: 0.5rem;}
img{overflow: hidden;}

.showcase-c{
	margin: 1.5rem auto 1.5rem auto;
	overflow: hidden;
	width: fit-content;
	border: 3px solid var(--cyan);
	position: relative;
}

.showcase-img, .showcase-vid{
	height: 100%;
	width: 100%;
	max-height: 75vh;
}

.showcase-img{margin: 0px;}

.showcase-hoverable{
	position: absolute;
	height: 100%;
	width: 100%;
	left: calc(100% - 1.7rem);
	transition: left 0.5s var(--curve-expo);
}

.showcase-arrow{
	background-color: var(--cyan);
	margin: 0;
	width: 2rem;
	height: 100%;
}

.showcase-txt-c{
	background-color: var(--transpblack);
	backdrop-filter: blur(10px);
	height: 100%;
	width: 100%;
	overflow-y: scroll;
}

.showcase-hoverable:hover{left: 0;}

.showcase-txt{
	margin: 2rem;
	flex-direction: column;
}


/*----------BoM---------*/
.bom-header{
	border-bottom: 3px solid var(--cyan);
	padding: 5px 10px 5px 10px;
}

.bom-qty, .bom-ppu, .bom-total{text-align: center;}


/*----------ToC---------*/
.toc{
	border-top: 3px solid var(--cyan);
	margin-top: 20px;
	padding-top: 20px;
}


/*----------Links---------*/
.project-link-c{
	border: 3px solid var(--cyan);
	width: fit-content;
	margin-bottom: 20px;
}

.project-link-txt{
	padding: 10px;
	margin-bottom: 0px;
	background-color: var(--cyan);
	color: black;
}

.project-link{margin: 0.5rem;}
.project-link:hover{margin: 0.375rem;}