.h3 {
	font-family: 'Poppins', cursive;
}

article.article-portfolio {
	padding: 0 5px;
}

/* Table 1 */

.table-1 {
	float: left;
	margin-right: 3em;
}

table#tbl_1 {
	width: 20vw;
	margin: 10px 0 30px 0;
	border-spacing: 0;
}

table#tbl_1 tr th,
table#tbl_1 tr td {
	background: #3b3b3b;
	color: #ffffff;
	padding: 7px 4px;
	text-align: left;
}

table#tbl_1 tr td {
	background: #e5e5db;
	color: #47433f;
	border-top: 1px solid #ffffff;
}

table#tbl_1 tr td:first-child:hover {
	background: #a531bc;
	color: #ffffff;
}

/* Table 2 */

table#tbl_2 {
	width: 50%;
	border-collapse: collapse;
	margin: 10px 0 3em 0;
	border: 1px solid #919191;
}

table#tbl_2 tr th,
table#tbl_2 tr td {
	text-align: center;
	padding: 0.5em 0.6em;
}

table#tbl_2 thead tr th {
	background-color: #a531bc;
	font-weight: bold;
	color: #fff;
	white-space: nowrap;
}

table#tbl_2 tbody tr:nth-child(2n-1) {
	background-color: #6e6e6e;
	color: #ffffff;
	transition: all 1.125s ease-in-out;
}

table#tbl_2 tbody tr:hover {
	background-color: rgba(208, 129, 207, 0.3);
	color: #47433f;
}

/* Examples */
.examples > .row {
	display: flex;
	flex-flow: row wrap;
	justify-content: space-around;
	padding: 5px;
}
.examples > .row .col-4 {
	margin: 20px;
}

.oval {
	width: 200px;
	height: 100px;
	background-color: grey;
	border-radius: 50%;
}

.heart {
	width: 200px;
	height: 100px;
	position: relative;
}
.heart::before,
.heart::after {
	position: absolute;
	content: '';
	top: 0;
	left: 50px;
	background-color: #a531bc;
	width: 50px;
	height: 80px;
	border-radius: 50px 50px 0 0;
	transform: rotate(315deg);
	transform-origin: 0 100%;
}
.heart::after {
	left: 0;
	transform: rotate(45deg);
	transform-origin: 100% 100%;
}

.infinity {
	position: relative;
	width: 188px;
	height: 100px;
}
.infinity::before,
.infinity::after {
	content: '';
	position: absolute;
	width: 80px;
	height: 80px;
	top: 0;
	left: 20px;
	border: 20px solid #a531bc;
	border-radius: 90px 90px 0 90px;
	transform: rotate(-45deg);
}
.infinity::after {
	left: auto;
	right: 0;
	border-radius: 90px 90px 0 90px;
	transform: rotate(135deg);
}