* {
    box-sizing: border-box;
}

body {
	font-family: sans-serif;
    font-size: 12px;
}

a {
	text-decoration: inherit;
	color: inherit;
}

/* Icons -------------------------------------------------------------------- */

.icon16 {background-image:url('images/icons.png'); display:inline-block; vertical-align:bottom;}
.icon16 span {display: none;}
.icon16 {width: 16px; height: 16px; display: inline-block; margin: 0px 1px;}

/* http://www.IconDrawer.com*/
.icon16.i_paypal {background-position: -576px -0px;}
.icon16.i_robotframework {background-position: -560px -0px;}
.icon16.i_docker {background-position: -544px -0px;}
.icon16.i_appium {background-position: -528px -0px;}
.icon16.i_kickstarter {background-position: -512px -0px;}
.icon16.i_build {background-position: -496px -0px;}
.icon16.i_django {background-position: -480px -0px;}
.icon16.i_drums {background-position: -464px -0px;}
.icon16.i_bass {background-position: -448px -0px;}
.icon16.i_bootstrap {background-position: -432px -0px;}
.icon16.i_jenkins {background-position:  -416px -0px;}
.icon16.i_pygame {background-position:  -400px -0px;}
.icon16.i_jquerymobile {background-position:  -384px -0px;}
.icon16.i_android {background-position:  -368px -0px;}
.icon16.i_html5 {background-position:  -352px -0px;}
.icon16.i_pyramid {background-position: -336px -0px;}
.icon16.i_postgresql {background-position: -320px -0px;}
.icon16.i_piano {background-position: -304px -0px;}
.icon16.i_mysql {background-position: -288px -0px;}
.icon16.i_elasticsearch {background-position: -272px -0px;}
.icon16.i_rc {background-position: -256px -0px;}
.icon16.i_group {background-position: -240px -0px;}
.icon16.i_solo {background-position: -224px -0px;}
.icon16.i_ubuntu {background-position: -208px -0px;}
.icon16.i_twitter {background-position: -192px -0px;}
.icon16.i_linkedin {background-position: -176px -0px;}
.icon16.i_googleplus {background-position: -160px -0px;}
.icon16.i_github {background-position: -144px -0px;}
.icon16.i_facebook {background-position: -128px -0px;}
.icon16.i_amazon {background-position: -112px -0px;}
.icon16.i_perl {background-position: -96px -0px;}
.icon16.i_pascal {background-position: -80px -0px;}
.icon16.i_java {background-position: -64px -0px;}
.icon16.i_php  {background-position: -48px -0px;}
.icon16.i_python {background-position: -32px -0px;}
.icon16.i_vb {background-position: -16px -0px;}

.icon16.i_github_superlimitbreak {background-position: -144px -0px;}


/*
.icon16.i_solo {background-position:  -222px -0px;}
.icon16.i_group{background-position:  -240px -0px;}
*/


/* Header ------------------------------------------------------------------- */


/* Title */

.item_identity {

}

.item_identity .wrapper {
	padding: 1em;
}

.item_identity .wrapper > img {
	margin-right: 0.5em;
	height: 120px;
	float: left;
	border: 1px solid black;
	border-radius: 4px;
}

.item_identity h1 {
	font-weight: bold;
	font-size: 20px;
	display: block;
	margin-bottom: 0.5em;
}

.item_identity .quote {
	margin-bottom: 0.5em;
}


.header .email {
	margin-bottom: 0.5em;
}

/* Links */

#profile_links {
	display: block;
}

#profile_links li {
    display: inline;
}




/* Masonry ------------------------------------------------------------------ */

#masonry {
    width: 100%;
	clear: both;
}

li.item {
    width: 150px;
    height: 150px;
    float: left;
    padding: 0.5em;
}

.item .item_wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    border: 1px solid;
    border-radius: 1em;
    /* background-color: white; */
    background-repeat:no-repeat;
    /* background-attachment:fixed; */
    /* background-position:center; */
    background-size: auto 100%;
    overflow: hidden;
}

.item .item_wrapper p {
	margin-bottom: 0.5em;
}

.item .overlay {
    position: absolute;
    left:0;
    top: 0;
    bottom: 0;
    right: 0;
    background-color: white;
}

.item .background {
	/*
    position: absolute;
    left:0;
    top: 0;
    height: 100%;
    opacity: 0.2;
    z-index: -1;
    */
	width: 100%;
}
.item.horizontal .background {
	width: 50%;
	/*height: 100%;*/
	float: left;
	margin-right: 0.5em;
}
.item.horizontal_right .background {
	width: 50%;
	float: right;
	margin-left: 0.5em;
}
.item.float .background {
	/*height: 100%;*/
	float: right;
	margin-left: 0.5em;
	width: auto;
}



.item .content {
}

.item .content .titlebar {
    width: 100%;
    padding: 0.5em;
    color: white;
}
.titlebar {background-color: #000000;}
.category_build .titlebar,
.category_costume .titlebar  {background-color: #600000;}
.category_employer .titlebar {background-color: #000000;}
.category_code .titlebar     {background-color: #000060;}
.category_music .titlebar    {background-color: #004000;}
.category_other .titlebar    {background-color: #606000;}



.item .content .titlebar .title {
	font-weight: bold;
}

.item .content .titlebar .year {
	float: right;
}


.item .content .description {
	padding: 0.5em;
}

.item .content .footer {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	padding: 0.5em;
}

.item .content .footer .team {
	position: absolute;
	left: 0;
	bottom: 0;
	padding: 0.5em;
}

.item .content .footer .icons {
	position: absolute;
	right: 0;
	bottom: 0;
	padding: 0.5em;
}

.item .content .footer .team a {
	text-decoration: none;
	color: inherit;
}


/* Masonry ------------------------------------------------------------------ */

.item.w2 { width: 300px; }
.item.w3 { width: 450px; }
.item.w4 { width: 600px; }

.item.h2 { height: 300px; }
.item.h3 { height: 450px; }
.item.h4 { height: 600px; }
.item.h5 { height: 500px; }