/* JSON-ish Header */
@media (min-width: 768px) {
	.navbar-brand:after{
		content:" :"
	}
	.navbar .navbar-nav:first-child .nav-item:first-child a:before{
		content:"[ "
	}
	.navbar .navbar-nav:first-child .nav-item a:after {
		content:","
	}
	.navbar .navbar-nav:first-child .nav-item:last-child a:after {
		content:" ]"
	}
}

/* Adjust header font size based on viewport */
@media (max-width: 768px) {
	h1.display-4 {
		font-size:2rem;
	}
}

/* lowercase for many items */
nav,
section h1,
#stats,
#education dt {
	text-transform:lowercase;
}
#stats a {
	text-transform:capitalize;
}

/* top image */
figure {
	margin-bottom:2rem;
}
figure,
section {
	box-shadow:0px 0px 4px -1px;
}

.figure-img {
	margin-bottom:0;
}

.jumbotron,
figure {
	border-radius:0;
	position:relative;
}
section:nth-child(odd) {
	background-color:rgba(0,0,0,0.1);
}
section:nth-child(even) {
	background-color:rgba(0,0,0,0.3);
}
section:before,
figure:before {
	content: "";
    display: block;
    position: absolute;
    border: 25px solid transparent;
    border-top: 25px solid #fcfcfc;
    top: -35px;
    left: -35px;
    box-shadow: 0px -7px 6px -7px black;
    transform: rotate(135deg);
}
section:after,
figure:after {
	content: "";
    display: block;
    position: absolute;
    border: 25px solid transparent;
    border-bottom: 25px solid #fcfcfc;
    bottom: -35px;
    right: -35px;
    box-shadow: 0px 7px 6px -7px black;
    transform: rotate(135deg);
}

/* add profile pic to bio header */
#bio h1 {
	background-image: url(../images/people/tony-restuccia.jpg);
    background-position: left;
    background-repeat: no-repeat;
	background-size: contain;
	padding-left: 2ex;
}
@media (max-width: 576px) {
	#bio h1 {
		padding-left:4ex;
	}
}

.card {
	border:none;
	border-radius:0;
}
.card-header h4 {
	margin:0;
}
.card-header h4 a {
	color:inherit;
	display:flex;
	font-size:1.5rem;
}
.card-header h4 a span:first-of-type {
	text-align:left;
}
.card-header h4 a span:last-of-type {
	flex:1;
	text-align:right;
}
.card-body li {
	margin-bottom:1rem;
}

/* stats */
#stats ul li strong {
	background-color:#fefefe;
	border:5px solid #333;
	border-radius:10px;
	margin-right:0.5rem;
	padding:5px 15px;
	text-align:center;
	width:60px;
}
#stats ul li p {
	line-height:3;
	padding-left:5px;
}

/* recommendations */
#recommendations img {
	filter:grayscale(1);
    width:75px;
}
#recommendations .blockquote-footer {
	color:#222;
}
#recommendations .blockquote-footer::before {
	content:"/*";
}
#recommendations .blockquote-footer::after {
	content:"*/";
}

.carousel-control-prev,
.carousel-control-next {
	width:20px;
	top:inherit;
}