/* General layout */
.container{
	width:960px;
	padding:0 5px;
	margin:0 auto;
	border-left:1px solid #999;
	border-right:1px solid #999;	
}


/* HEADER */
#header{
	padding-top:20px;
	padding-bottom:25px;
	border-top:1px solid #000;
	border-bottom:1px solid #eee;
	margin-top:20px;
}


/* Logo */
#logo{
	position:relative;
	left:50%;
	margin-left:-85px;
}
	#logo, #logo a{
		width:200px;
		height:33px;
	}
	#logo a, #logo a:visited{
		display:block;
		padding:0;
		background:transparent url(../images/fredrikohlin_logo_sprite.png) no-repeat top;
	}
		#logo a:hover, #logo a:focus{
			background-position:bottom;
		}

/* Navigation */
ul#navigation{
	margin:-45px 0 0 0;
	padding:0;
	list-style-type:none;
	font-size:1.3em;
	text-align:center;
}
	ul#navigation li{
		display:inline;
		margin-right:10px;
	}
		ul#navigation li.center-1{
			margin-right:0;
		}
		ul#navigation li.center-2{
			margin-left:275px;	
		}
		ul#navigation li.home a{
			color:#888;	
		}
	ul#navigation a{
		color:#222;	
	}
	ul#navigation a:hover, ul#navigation a:focus{
		color:#fff;
		background-color:#2361ac;	
	}
		

/* MAIN CONTENT AREA */
#content{
	padding-top:20px;
	padding-bottom:40px;
}

#content h2{
	font-size:3em;
	margin-top:0em;
	text-align:center;
}


/*Index*/
#index-greeting{
	width:778px;
	height:110px;
	margin:0 auto 50px;
	background-image:url(../images/index-greating.png);
}

#index h2{
	font-size:1.5em;
	text-align:left;
	color:#999;	
}

#main-photo{
	float:left;
	margin:0 20px 20px 0;
	min-height:420px;
	/*padding:10px 10px 5px;
	border:1px solid #999;*/
}
	#main-photo a{
		background-color:transparent;
		padding:0;
	}

#index .links{
	/*float:right;
	max-width:600px;*/
}
	#index .links ul{
		margin:0;
		list-style-type:none;	
	}
	#index .links li{
		margin-bottom:1em;	
	}
	#index .links p{
		margin:0;
	}
	#index .links p.description{
		font-style:italic;	
	}


#latest-status{
	clear:left;
	padding-top:2em;
}
	#latest-status h2{
		margin-bottom:0;
		/*padding-bottom:0.75em;	*/
	}
	#latest-status ul{
		margin:0;
		list-style-type:none;
		font-size:1.5em;
		color:#444;
	}
	#latest-status li{
		float:left;
		width:308px;
		margin:0 10px 0 0;
		overflow-x:hidden;
	}
	#latest-status strong{
		font-size:0.75em;
		color:#111;
		display:block;
	}


#latest-photos{
	margin-top:3em;
	line-height:0.8;
}
	#latest-photos ul{
		list-style-type:none;	
	}
	#latest-photos ul, #latest-photos li, #latest-photos a{
		margin:0;
		padding:0;
	}
	#latest-photos li{
		width:75px;
		float:left;
		margin-right:5px;
	}
	#latest-photos a{
		display:block;
		background-color:transparent;
		margin-bottom:5px;
	}
	#latest-photos a:hover{
		margin-top:-4px;
		margin-bottom:1px;
		padding-bottom:8px
	}


#more-links, #more-status{
	margin-top:3em;
	width:470px;
}

#more-links{
	float:left;
}
	/*#index #more-links p.description{
		font-style:normal;	
	}*/

#more-status{
	float:right;	
}
	#more-status li{
		color:#000;
		margin-bottom:1em;
	}
	#more-status strong{
		display:block;
		color:#444;
	}





/* TIMELINE */

.stream{
	list-style-type:none;
	/*padding-top:2em;*/
	margin:0;
}
	.stream h3{
		font-size:1.60em;	
		-moz-border-radius:3px;
		-webkit-border-radius:3px;		
	}
		.stream h3, .stream h3 a{
			background-color:#f6f6f6;
			color:#888;
		}
		.stream h3 a{
			text-transform:none;
			text-decoration:none;
			padding:0;
		}
			.stream h3 a:hover{
				text-decoration:underline;	
			}
		.stream li.date-group:hover h3 a{
			color:#444;
		}
	.stream h3, .stream div.meta{
		width:175px;
		float:left;
		clear:left;
		text-align:right;
		padding:2px 5px 2px 0;
		margin:0;
	}
	.stream h4{
		margin:3px 0 0.5em;
		/*color:#000;*/
		text-transform:uppercase;
	}
	.stream p{
		margin:0;	
	}
	.stream ul{
		margin:0;	
	}
	.stream li{
		margin-top:0;	
	}
	.stream li.date-group{
		margin-top:2em;
		border-bottom:1px solid #f3f3f3;
	}
	
		.stream ul.content-type-grouper{
			width:760px;
			float:right;
			clear:right;
			list-style-type:none;
		}
	
			.stream li.content-type-group{
				margin-bottom:1.5em;
			}
			
				#stream .stream ul.item-list, #status .stream ul.item-list{
					width:600px;
					list-style-type:circle;
				}
				#status .stream ul.item-list{
					float:left;
					margin-left:15px;
				}
	
	#links ul.item-list li{
		margin-bottom:1.5em;	
	}
	
	
	
	/*list items for different content types */
					.stream ul.item-list li{
						margin:0 0 1em 1.5em;
					}
	li.status{
		list-style-type:circle;
	}
		li.status a{
			text-transform:none;	
		}
	.stream li.status{
		
	}	
		.stream li.status:hover strong{
			color:#999;	
		}
		.stream li.status strong{
			font-size:0.85em;
			margin-top:0.15em;
			color:#ccc;
			display:block;
			float:right;
			width:150px;
			margin-right:-155px;
			text-align:right;
		}
	a.user{
		padding-left:0;	
	}
	
	
	.stream li.link{
		list-style-type:disc;
	}
		.stream li.link p.description{
			font-style:italic;	
		}

	.stream li.content-type-group li.photo, li.photo{
		list-style-type:none;
		margin-left:0;
		float:left;
	}
		li.photo a{
			background:transparent;	
		}



/*TIMELINE*/
ul.timeline{
	font-size:0.75em;
	height:15em;
	width:90%;
	margin:1em auto 3em;
	list-style-type:none;
}
	.timeline li{
		position:relative;
		float:left;
		width:3%;
		margin:0 0.15%;
		height:13em;
	}
		.timeline li a{
			display:block;
			height:80%;
			line-height:1;
			padding:0;
			background:transparent;
			text-decoration:none;
		}
			.timeline li a .label{
				display:block;
				position:absolute;
				bottom:-2em;
				left:0;
				background:#fff;
				color:#333;
				width:100%;
				height:2em;
				text-align:center;
			}
			.timeline li a .count{
				display:block;
				position:absolute;
				bottom:0;
				left:0;
				height:0;
				width:100%;
				background:#aaa;
				text-indent:-9999px;
				overflow:hidden;
			}
				.timeline li a:hover .count{
					background:#2361ac;
				}
			.timeline li:hover{
				background:#fafafa;	
			}
			




/* PHOTOS */
/*#photos #content{
	width:100%;	
}*/
#photos h2.page-nr{
	text-align:left;	
}

#photos #photo-fun{
	background-image:url(../images/heading-photo-camera.png);
	width:696px;
	height:117px;
	margin:2.5em auto;
}



ul#gallery{
	list-style-type:none;
	/*float:right;*/
	margin:0;
}
	ul#gallery li{
		margin:0 0px 2px 0px;
		margin:0;
		float:left;	
	}
	ul#gallery a, .featured-photo a{
		display:block;	
		line-height:0.7;
		padding:0;
		background-color:transparent;
	}
		ul#gallery a:hover{
			margin-top:-3px;
			padding-bottom:3px;
		}
	
	.featured-photo{
		float:right;	
		/*min-height:569px;*/
		min-height:350px;
	}
		.featured-photo .image a, .featured-photo .image a img{
			/*margin-bottom:2px;	*/
			z-index:2;
		}
		.featured-photo #map_canvas{
			width:30%;
			height:80px;
			margin:-84px 4px 0 0;
			float:right;
			opacity:0.5;
			z-index:9;
			
			/*-moz-border-radius:8px;
			-webkit-border-radius:8px;*/
		}
			.featured-photo:hover #map_canvas{
				opacity:0.90;	
			}
			.featured-photo .gmnoprint{
				font-size:5px !important;	
			}
		.featured-photo h3{
			position:relative;
			margin:4px 0 -2em 4px;
			padding:2px;
			font-size:1.3em;
			font-weight:strong;
			float:left;
			background:#333; 
			color:#fff;
			opacity:0.5;
			z-index:9;
			-moz-border-radius:5px;
			-webkit-border-radius:5px;
		}
			.featured-photo:hover h3{
				opacity:0.9;	
			}
		.featured-photo h3.map-on{
			
		}

		.featured-photo ul .title{
			
		}
		

#photo-detail h3{
	text-align:center;	
}
#photo-detail #photo{
	text-align:center;
}
.gallery-focus{
	background:#000;
	margin:0 -5px 1em -5px; /*no space to container border */
	padding:2em 0 0.5em 0;
	color:#666;
}

	#photo-detail #photo img{
		border:2px solid #fff;	
	}
	
	.gallery-focus a{
		color:#666;
	}
		.gallery-focus a:hover{
			color:#fff;
		}
	.gallery-focus p{
		margin-bottom:0.5em;
		width:500px;
		margin-left:auto;
		margin-right:auto;
	}
	.gallery-focus .out-link{
		font-size:0.8em;	
	}
	.gallery-focus .description{
		color:#888;
		font-size:1.25em;
		font-style:italic;	
	}
	.gallery-focus .license{
			
	}
	#photo-detail #photo .license img{
		border-style:none;	
	}

#photo-detail #meta, #photo-detail #location{
	width:500px;
	margin:2em auto 0 auto;	
}
	#photo-detail #map_canvas{
		width:100%;
		height:200px;
		border:1px solid #333;
	}

#meta dt, #meta dd{
	background:#f3f3f3;
	padding:2px;
	float:left;	
}
#meta dt{
	width:150px;
	margin:1px 1px 1px 0;
}
#meta dd{
	width:341px;
	margin:1px 0;
}

/*ABOUT */

#about #content a{
	text-transform:none;	
}

#contact{
	background-color:#ddd;
	border-color:#666;
	font-size:1.2em;
}

.vcard .fn{
	display:none;
}
.vcard div{
	margin:0.3em 0;
}

.about-side{
	width:342px;
	padding:5px;
	clear:right;
	float:right;
	margin:0 0 1em 20px;
	border:1px solid #eee;
}
#about .main-content{
	width:575px;
	float:left;
	padding-left:5px;
	line-height:1.7;
}

#about .main-content ul{
	margin-bottom:2.5em;
}
	#about .main-content li{
		margin:0;
	}

#other-places{
}
	#about .main-content #other-places ul{
		list-style-type:none;
		margin:0;
		color:#333;
	}
		#about .main-content #other-places li{
			width:44%;
			margin:2px 3%;
			float:left;
		}
			#other-places li.new-row{
				clear:left;
			}
		#other-places ul img{
			vertical-align:middle;
			float:left;
			margin:4px 8px 0 0;
			width:32px;
		}

a.google-button, a.google-button:visited{
	padding:2px 6px 2px;
	background:#eee;
	border:1px solid #ccc;
	color:#333;
	text-decoration:none;
	font-family:Arial,Helvetica, sans-serif;
}
	a.google-button:hover{
		background:#e5e5e5;
		border-color:#aaa;
		color:#111;
	}
	a.google-button span{
		border-top:3px solid #eee;
	}
		a.google-button:hover span{
			border-top-color:#f3f3f3;
		}

.about-side .google-button{
	display:block;
	float:left;
	margin:3px 10px 5px 0;
}

/* PAGINATION */
hr{
	clear:both;	
}

div.pagination{
	text-align:center;
	font-size:1.5em;
}
	#photos div.pagination{
		margin-top:1em;
	}
	#status div.pagination{
		margin-top:3em;
		font-size:1em;
	}
		#status div.pagination ul{
			list-style-type:none;
		}
	div.pagination a.prev{
		margin-right:1em;	
	}
	div.pagination a.home{
		color:#ccc;
		margin-right:1em;
	}


/* fohl.in */
body#short-urls{
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}
#fohl-in{
	width:525px;
	height:159px;
	background-image:url(../images/fohl.in-logo.png);
	float:left;
	margin:0px 15px 0 20px;
}

#url-list{
	list-style-type:none;
	margin:55px 0 0 20px;
}
	#url-list > li{
		float:left;
		width:162px;
		margin:7px 6px;
		padding:5px 2px;
		border:1px solid #666;
		background-color:#f4f4f4;
		-moz-border-radius:2px;
		-webkit-border-radius:2px;
		border-radius:4px;
		overflow:hidden;
	}
	#url-list h3{
		margin-bottom:4px;
	}
		#url-list h3 img{
			margin-bottom:-2px;
		}
	#url-list a{
		text-transform:none;
	}
	#url-list ul{
		list-style-type:none;
		margin:0 0 0 5px;
	}
		#url-list ul li{
			margin:0;
		}

#shortcuts{
	background-color:#000;
	color:#eee;
	position:absolute;
	padding:5px 5px 0px 20px;
	top:0;
	left:0;
	right:0;

}
#shortcuts h2{
	float:left;
	font-size:1em;
	margin:1px 20px 0 0;
	font-weight:bold;
	text-transform:uppercase;
	color:#eee;
}
#shortcuts ul{
	margin:0 0 0 210px;
	list-style-type:none;
}
	#shortcuts ul li{
		margin:0;
		float:left;
		margin:0 5px 2px 0;
	}
#shortcuts img{
	/*width:12px;*/
}
#shortcuts a{
	text-transform:none;
	text-decoration:none;
	color:#e5e5e5;
	background-color:transparent;
}
	#shortcuts a img{
		border:1px solid #555;
	}
	#shortcuts a:hover img{
		border-color:#2361ac;
	}
#short-urls #logo{
	margin:0;
	background-color:#fff;
	position:fixed;
	padding:3px;
	bottom:5px;
	right:5px;
	left:auto;
	border:1px solid #999;
}

/* FOOTER */
#footer{
	text-align:center;
	text-transform:uppercase;
	font-size:0.75em;
	padding-top:2em;
	padding-bottom:2em;
	margin-bottom:2em;
	border-top:1px solid #eee;
	border-bottom:1px solid #000;
}
	#footer a img{
		margin:-3px 0;	
	}
	
	#footer hr{
		width:70%;
	}
	#footer p{
		width:725px;
		margin:0 auto;	
	}



/* GLOBAL USEFULNESS */

.aside{
	color:#777;
}

/* Makes list inline */
ul.unlisted, ol.unlisted{
	list-style-type:none;
	margin:0;
}
ul.unlisted li, ol.unlisted li{
	display:inline;
	margin:0;
}

/* Hide, but not only visually */
.structural {
	position:absolute;
	left:-9999px;
}

/* Clears floats within element */
.clear{display:inline-block;}
.clear:after,.container:after{content:".";display:block;height:0;clear:both;visibility:hidden;}
* html .clear{height:1%;}
.clear{display:block;}

/* Image replacement */
.mir{
	letter-spacing : -1000em;
	background:transparent no-repeat top left;
}
/* Just for Opera, but hide from MacIE */
/*\*/html>body .mir { letter-spacing : normal; text-indent : -999em; overflow : hidden;}
/* End of hack */