/* - DOCUMENT INFORMATION
------------------------------------------------- 
	Website Name: Henry Brown	
	Website URL: http://www.henry.brown.name
	Author: Henry Brown
	Author URI: http://www.henry.brown.name
	Version: 3.0
/*


/* - 0.0. - SECTIONS
---------------------------------------------- */
.instagram-button{
	background:url(../../img/lifegram/icon-instagram.png) no-repeat center center #bbca16;
	display:block;
	width:35px;
	height:35px;
	position:fixed;
	bottom:0px;
	right:0px;
	z-index:6999;
	border-radius:3px 0px 0px 0px;
	-moz-border-radius:3px 0px 0px 0px;
	-webkit-border-radius:8px 0px 0px 0px;
	opacity:0.4;
	filter:alpha(opacity=40);
	transition:all 0.2s;
	-moz-transition:all 0.2s;
	-webkit-transition:all 0.2s;
}
.instagram-button:hover{
	opacity:1;
	filter:alpha(opacity=100);
}
.instagram-button.open{
	opacity:1;
	filter:alpha(opacity=100);
	background:url(../../img/lifegram/icon-exit.png) no-repeat center center #bbca16;
}
.instagram{
	background:#333;
	background:rgba(0,0,0,0.8);
	position:fixed;
	bottom:0px;
	right:0px;
	z-index:99998;
	height:150px;
	width:0px;
	overflow:hidden;
	padding:0px;
}
.instagram ul.feed{
	overflow:hidden;
	margin:25px;
	position:relative;
	left:0px;
}
.instagram ul.feed li{
	list-style:none;
	margin:0 10px 0 0;
	float:left;
	width:100px;
	height:100px;
	border-radius:3px; 
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border:2px solid #555;
	opacity:0.4;
	filter:alpha(opacity=40);
	transition:all 0.2s;
	-moz-transition:all 0.2s;
	-webkit-transition:all 0.2s;
}
.instagram ul.feed li.last{
	background:#fff;
}
.instagram ul.feed li:hover{
	opacity:1;
	filter:alpha(opacity=100);
}
.instagram ul.feed li img{
	border-radius:3px; 
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	width:100%;
}
.instagram.open .instagram-button{

}


#about{
	padding:7em 0;
	padding-top: 60px !important;
	font-family:"Open Sans","Helvetica","Arial";
	font-weight:300;
	font-size:62.5%;
	color:#555;
}
	
	
	/* - 0.0. - ABOUT
	------------------------------------------ */
	#about h2.title{
		margin-top:45px;
	}
	.about-me-description{
		text-align:left;
		margin:0 0 120px 0;
		overflow:hidden;
	}
	.about-me-description p{
		line-height:1.8em;
		color:#666;
	}
	
	#about #progress-bar-container{
		clear:both;
		position:relative;
		margin:0 auto 50px auto;
		padding-bottom:1px;
		width:100%;
	}
	#about #progress-bar-container .birth,
	#about #progress-bar-container .present{
		width:60px;
		height:60px;
		border:8px solid #ccc;
		border-radius:1000px;
		-moz-border-radius:1000px;
		-webkit-border-radius:1000px;
		position:absolute;
		top:-33px;
		font-weight:700;
		font-size:1.6em;
		color:#aaa;
		text-indent:-9999px;
		overflow:hidden;
		line-height:60px;
		z-index:500;
	}
	#about #progress-bar-container .birth:hover,
	#about #progress-bar-container .present:hover{
		background:#fff;
		text-indent:0px;
	}
	#about #progress-bar-container .birth{
		left:0px;
		background:url(../../img/lifegram/icon-baby.png) no-repeat center center #fff;
	}
	#about #progress-bar-container .present{
		right:0px;
		background:url(../../img/lifegram/icon-present.png) no-repeat center center #fff;
	}
	#about .progress-bar{
		position:relative;
		width:0px;
		height:15px;
		border-radius:100px;
		-moz-border-radius:100px;
		-webkit-border-radius:100px;
		background:#CCC;
		margin:0 auto;
		overflow:visible;
		z-index:600;
	}
	#about .progress{
		/*background:#cf0000;*/
		width:100%;
		height:10px;
		border-radius:100px;
		-moz-border-radius:100px;
		-webkit-border-radius:100px;
	}
	#about .progress-bar .notes{
		position:absolute;
		width:0px;
		height:100%;
		top:0px;
		left:0px;
		margin:0px;
		padding:0px;
		z-index:1100;
	}
	#about .progress-bar .notes li{
		position:absolute;
		width:27px;
		height:39px;
		overflow:visible;
		padding:20px 2px 2px 2px;
		margin:0px;
		list-style:none;

	}
	#about .progress-bar .notes li:hover{

	}
	#about .progress-bar .knotch.top,
	#about .progress-bar .knotch.bottom{
		position:absolute;
		width:16px;
		height:8px;
		text-indent:-9999px;
	}
	#about .progress-bar .knotch.top{
		background:url(../../img/lifegram/icon-knotch-top.png) no-repeat;
		top:-8px;
	}
	#about .progress-bar .knotch.bottom{
		background:url(../../img/lifegram/icon-knotch-bottom.png) no-repeat;
		top:15px;
	}
	#about .progress-bar .notes li.top{
		background:url(../../img/lifegram/icon-pin-down.png) no-repeat center top;
		top:-55px;
	}
	#about .progress-bar .notes li.bottom{
		top:30px;
		background:url(../../img/lifegram/icon-pin-up.png) no-repeat center top;
	}
	#about .progress-bar .notes li .caption{
		padding:10px;
		width:200px;
		background:#333;
		position:absolute;
		z-index:500;
		display:none;
		border-radius:4px;
		-moz-border-radius:4px;
		-webkit-border-radius:4px;
		box-shadow:0px 2px 2px rgba(0,0,0,0.07);
		-moz-box-shadow:0px 2px 2px rgba(0,0,0,0.07);
		-webkit-box-shadow:0px 2px 2px rgba(0,0,0,0.07);
		text-align:left;
	}
	#about .progress-bar .notes li .caption h4{
		font-weight:600;
		margin:0 0 5px 0;
		font-size:14px !important;
		text-align:left;
		color:#fff;
		font-style:normal !important;
		padding-left:0px !important;
		padding-top: 3px !important;
		padding-bottom: 0px !important;
		line-height: 16px !important;
	}
	#about .progress-bar .notes li .caption p{
		font-size:12px !important;
		color:#fff;
		text-shadow:none;
		margin:0px;
		padding-bottom: 0px !important;
		
	}
	#about .progress-bar .notes li.bottom .caption .arrow{
		border-color:transparent transparent #333 transparent;
		border-style:solid;
		border-width:5px;
		height:0;
		width:0;
		position:absolute;
		top:-10px;
		left:17px;
	}
	#about .progress-bar .notes li.top .caption .arrow{
		border-color:#333 transparent transparent transparent;
		border-style:solid;
		border-width:5px;
		height:0;
		width:0;
		position:absolute;
		bottom:-10px;
		left:17px;
	}
	#about .progress-bar .notes li.top .caption{
		top:-30px;
		left:-7px;
		padding-bottom:10px;
	}
	#about .progress-bar .notes li.bottom .caption{
		top:50px;
		left:-7px;
		padding-top:10px;
		
	}
	#about .progress-bar .notes li .caption .date{
		display:none;
	}
	#about .progress-bar .notes li .caption h4 span{
		color:#999;
	}

	
	

/* - 0.0. - GLOBAL
---------------------------------------------- */

.constraint{
	width:100%;
	margin:0 auto;
}


	/* - 0.0. - TYPOGRAPHY
	------------------------------------------ */
	


	
	/* - 0.0. - PAGINATION
	------------------------------------------ */


	/* - 0.0. - PRINT
	---------------------------------------------- */
	@media print {
		* { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important;
		-ms-filter: none !important; } /* Black prints faster: sanbeiji.com/archives/953 */
		a, a:visited { color: #444 !important; text-decoration: underline; }
		a[href]:after { content: " (" attr(href) ")"; }
		abbr[title]:after { content: " (" attr(title) ")"; }
		.ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }  /* Don't show links for images, or javascript/internal links */
		pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
		thead { display: table-header-group; } /* css-discuss.incutio.com/wiki/Printing_Tables */
		tr, img { page-break-inside: avoid; }
		@page { margin: 0.5cm; }
		p, h2, h3 { orphans: 3; widows: 3; }
		h2, h3{ page-break-after: avoid; }
	}
	
	
#sb-title-inner,#sb-info-inner,#sb-loading-inner,div.sb-message{font-family:"HelveticaNeue-Light","Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:200;color:#fff;}
#sb-container{position:fixed;margin:0;padding:0;top:0;left:0;z-index:999999;text-align:left;visibility:hidden;display:none;}
#sb-overlay{position:relative;height:100%;width:100%;}
#sb-wrapper{position:absolute;visibility:hidden;width:100px;}
#sb-wrapper-inner{position:relative;border:1px solid #303030;overflow:hidden;height:100px;}
#sb-body{position:relative;height:100%;}
#sb-body-inner{position:absolute;height:100%;width:100%;}
#sb-player.html{height:100%;overflow:auto;}
#sb-body img{border:none;}
#sb-loading{position:relative;height:100%;}
#sb-loading-inner{position:absolute;font-size:14px;line-height:24px;height:24px;top:50%;margin-top:-12px;width:100%;text-align:center;}
#sb-loading-inner span{background:url(../../img/lifegram/loading.gif) no-repeat;padding-left:34px;display:inline-block;}
#sb-body,#sb-loading{background-color:#060606;}
#sb-title,#sb-info{position:relative;margin:0;padding:0;overflow:hidden;}
#sb-title,#sb-title-inner{height:26px;line-height:26px;}
#sb-title-inner{font-size:16px;}
#sb-info,#sb-info-inner{height:20px;line-height:20px;}
#sb-info-inner{font-size:12px;}
#sb-nav{float:right;height:16px;padding:2px 0;width:45%;}
#sb-nav a{display:block;float:right;height:16px;width:16px;margin-left:3px;cursor:pointer;background-repeat:no-repeat;}
#sb-nav-close{background-image:url(../../img/lifegram/close.png);}
#sb-nav-next{background-image:url(../../img/lifegram/next.png);}
#sb-nav-previous{background-image:url(../../img/lifegram/previous.png);}
#sb-nav-play{background-image:url(../../img/lifegram/play.png);}
#sb-nav-pause{background-image:url(../../img/lifegram/pause.png);}
#sb-counter{float:left;width:45%;}
#sb-counter a{padding:0 4px 0 0;text-decoration:none;cursor:pointer;color:#fff;}
#sb-counter a.sb-counter-current{text-decoration:underline;}
div.sb-message{font-size:12px;padding:10px;text-align:center;}
div.sb-message a:link,div.sb-message a:visited{color:#fff;text-decoration:underline;}