/*!
 * Start Bootstrap - 3 Col Portfolio HTML Template (http://startbootstrap.com)
 * Code licensed under the Apache License v2.0.
 * For details, see http://www.apache.org/licenses/LICENSE-2.0.
 */
 
@import url('https://fonts.googleapis.com/css?family=Roboto+Slab');
 
body {
    padding-top: 70px; /* Required padding for .navbar-fixed-top. Remove if using .navbar-static-top. Change if height of navigation changes. */
	font-family: 'Roboto Slab', serif;
	background-color: #224044; color: white;
}
a { color: #77CCAA; }
a:hover { color: #AAFFBB; }
h1 { line-height: 1.3em; margin-bottom: 32px; }
h2 { margin-bottom: 1em; }
h3 a { color: #FF8855;}
h3 a:hover { color: #FF9966; }

#bio { font-size: larger; }
#bio img { float: left; width: 38%; max-width: 128px; padding: 0px 32px 16px 0px; }

.page-header small {
	color: #ccc;
}
#filters { display: block; border: 1px solid #557766; padding: 8px 15px 8px 15px; float: right; margin-bottom: 8px; }
#filters input { width: 16px; height: 16px; }

/*
.game h3::before { content: "Game"; background-color: rgba(220, 32, 0, 0.5); text-transform: uppercase; font-size: small; display: inline; padding: 0px 6px 0px 6px; margin: -8px 4px 0 0; }
*/
.writing h3::before { content: "Writing"; background-color: rgba(255, 168, 0, 0.5); text-transform: uppercase; font-size: small; display: inline;  padding: 0px 4px 0px 4px; margin: -8px 2px 0 0; }
.talk h3::before { content: "Talk"; background-color: rgba(64, 168, 255, 0.5); text-transform: uppercase; font-size: small; display: inline;  padding: 0px 6px 0px 6px; margin: -8px 4px 0 0; }
/*
.tool h3::before { content: "Tool"; background-color: rgba(60, 220, 0, 0.5); text-transform: uppercase; font-size: small; display: inline;  padding: 0px 6px 0px 6px; margin: -8px 4px 0 0; }
*/


.bubble1 { background-color: rgba(220, 32, 0, 0.5) !important; text-transform: uppercase !important; font-size: small; display: inline; padding: 0px 6px 0px 6px; margin: -8px 4px 0 0; }
.bubble2 { background-color: rgba(255, 168, 0, 0.5) !important; text-transform: uppercase !important; font-size: small; display: inline;  padding: 0px 4px 0px 4px; margin: -16px 2px 0 0; }
.bubble3 { background-color: rgba(64, 168, 255, 0.5) !important; text-transform: uppercase !important; font-size: small; display: inline;  padding: 0px 6px 0px 6px; margin: -16px 4px 0 0; }
.bubble4 { background-color: rgba(60, 220, 0, 0.5) !important; text-transform: uppercase !important; font-size: small; display: inline;  padding: 0px 6px 0px 6px; margin: -16px 4px 0 0; }

.portfolio-item {
	padding: 8px 16px 32px 16px;
}

.portfolio-item h3 { height: 1.5em; }

footer {
    margin: 50px 0;
}