@import "globals";

#journal {
	width: 1024px; margin: 0 auto;
	position: relative;

	.left {
		position: absolute; z-index: 0;
	}

	.right {
		position: absolute; left: 50%; z-index: -1;
		//background-color: #eee;
	}

	ul {
		position: relative; z-index: 99;
		margin: 0; padding: 0;

		li {
			list-style: none;
			width: 492px;
			text-align: right;
			padding: 10px 20px 10px 0;
			position: relative;
			border-width: 1px 0; border-style: solid; border-color: fadeout(#000, 90%);
			background-repeat: no-repeat;

			&:first-child {
				border-top: 0 !important;
			}

			a, a:visited {
				color: #000;
				text-decoration: none;
				font: bold 16px "chaparral-pro-1","chaparral-pro-2",serif;

				span.date {
					font-weight: normal;
					line-height: 1em;
				}
			}

			&.longform {
				min-height: 200px;
				border-width: 2px 0; border-style: solid; border-color: #333;
				background-color: #fff;
			}

			&.longform > a,
			&.longform > a:visited {
				position: absolute; bottom: 5px; right: 10px;
				display: block; width: 90%;
				font-family: "ff-tisa-web-pro-1","ff-tisa-web-pro-2",serif; font-size: 22px;
				line-height: 1.2em;

				span.date {
					display: block;
					font-size: 60%;
				}
			}

			ul.relatedposts {
				width: 100%;
				float: right;
				margin-right: -108%;

				p.excerpt {
					font: 16px/1.2em "dejarip-1", "dejarip-2", "Helvetica", sans-serif;
					text-align: left;
					color: #333;
					margin-top: 0; margin-bottom: 25px;
					width: 95%;
				}

				li {
					width: 100%;
					text-align: left;
					padding: 0;
					border: 0;

					a, a:visited {
						//color: #555 !important;
					}

					&:before {
						content: "+ ";
						color: #bbb;
					}

					span.date {
						white-space: nowrap;
					}
				}
			}

			&.odd {
				float: right;
				text-align: left;
				width: 495px;
				padding: 10px 0 10px 15px;

				&.longform {
					width: 495px;
					padding-left: 15px;
				}

				&.longform > a,
				&.longform > a:visited {
					left: 10px;
					right: auto;
				}

				ul.relatedposts {
					float: left;
					margin-left: -108%;

					p.excerpt {
						text-align: right;
						color: #333;
						margin-left: 28px;
					}

					li {
						text-align: right;
						position: relative;

						a, a:visited {
							display: inline-block;
							width: 90%;
							padding-right: 10px;
						}

						&:before {
							content: "";
						}

						&:after {
							content: " +";
							padding-left: 2px;
							color: #bbb;
							position: absolute;	top: 2px; right: -5px;
						}
					}
				}
			}
		}
	}
}

#photography {
	position: relative;

	.left {
		position: absolute; z-index: 0;
		//background-color: #eee;
	}

	.right {
		position: absolute; left: 49%; z-index: -1;
	}

	ul {
		position: relative; z-index: 99;
		margin: 0; padding: 0;

		li {
			list-style: none;
			padding: 20px 0;
			width: 49%;
			position: relative;
			clear: both;

			&:first-child {
				padding-top: 0;
			}

			&:last-child {
				padding-bottom: 0;
			}

			a, a:visited {
				display: block;
				text-align: center;
				font: 24px "chaparral-pro-1","chaparral-pro-2",serif;
				text-decoration: none;
				float: left;
				
				img {
					width: 512px;
					border-width: 2px 0; border-style: solid; border-color: #333;
					position: absolute;
					clip: rect(0px,510px,260px,0px);
					left: 514px;
				}
			}

			p {
				width: 100%;
				margin-top: 20px; margin-right: -107%;
				float: right;
				font-size: 18px; font-family: "chaparral-pro-1","chaparral-pro-2",serif;
				line-height: 1.2em;

				a.p-title {
					display: block;
					text-align: inherit;
					margin-left: 0; margin-bottom: 14px;
					color: #000;
					width: 100%;
				}
			}

			&.odd {
				float: right;

				a, a:visited {
					color: #000;
					float: right;

					img {
						width: 510px;
					}
				}

				p {
					margin-left: -98%;
					float: left;
					width: 90%;
					text-align: right;
					color: #000;

					a.p-title {
						margin-right: 0;
						color: #000;
					}
				}
				
			}
		}
	}
}

@import "posts";