/* css parts related only to article page layout */

h2 {
	color: #36466a;
	font-size: 30px;
	margin: 0 0 15px 0;
}

h4 {
	display: block;
	
	color: #36466a;
	font-size: 18px;
	margin: 0 0 2px 0;
}

#content {
	background-image: url(../img/article_wrapper_bg.gif) !important;
}

#middle-container {
	float: left;
	clear: left;
	width: 591px;
	overflow: hidden;
	padding-right: 20px;
	margin-right: 4px;
}

	#middle-container img {
		display: inline;
		padding: 4px;
		margin: 0;
		border: 3px solid #F1F1F1;
	}
	
	#middle-container p {
		font-size: 13.5px;
		line-height: 19px;
		margin: 0 0 18px 0;
	}
	
	#middle-container .intro {
		display: block;
		font-size: 16px;
		padding-bottom: 10px;
	}
	
	#middle-container .paragraph-container {
		float: left;
		clear: both;
		width: 476px;
	}
	
	table {
		width: 1px;
		margin: 0;
		padding: 0;
		border-collapse: collapse;
	}

	table td, table th {
		padding : 0;
		margin: 0;
	}
	
	table img {
		max-width:462px;
	}
	
	.picture-left {
		float: left;
		clear: none;
		margin-right: 10px;
	}
	
	.picture-left-left {
		float: left;
		clear: none;
		position: relative;
		margin-right: 10px;
		margin-left: -115px;
	}
	
	.picture-right {
		float: right;
		clear: none;
		margin-left: 10px;
	}
	
	.picture-center {
		margin: 0 auto 0 auto;
	}
	
	table .description {
		font-style: italic;
		padding-bottom: 9px;
		line-height: 14px;
	}

	#middle-container .indent {
		float: left;
		clear: both;
		display: inline;
		margin-left: 115px;
		width: 476px;
	}
	
	#main-photo {
		position: relative;
		clear: both;
		overflow: hidden;
	}
	
		#main-photo img {
			position: relative;
			z-index: 1;
			padding: 2px !important;
			margin: 0 !important;
			max-width:580px;
		}
		
		#main-photo #prev {
			position: absolute;
			top: 0px;
			left: 0;
			z-index: 2;
			width: 45%;
			height: 100%;
		}
		
		#main-photo #next {
			position: absolute;
			top: 0px;
			left: 55%;
			z-index: 2;
			width: 45%;
			height: 100%;
		}
		
		#main-photo #prev a,
		#main-photo #next a {
			z-index: 2;
			position: absolute;
			top: 0;
			left: -9999px;
			display: block;
			width: 100%;
			height: 100%;
			background-image: url(../img/blank.gif);
		}
		
			#main-photo #prev a div,
			#main-photo #next a div {
				position: relative;
				width: 20%;
				height: 100%;
				
				background:#FFFFFF;
				filter:alpha(opacity=50);
				-moz-opacity:0.5;
				-khtml-opacity: 0.5;
				opacity: 0.5;
			}
			
			#main-photo #next a div {
				float: right;
			}
			
			#main-photo #prev a img,
			#main-photo #next a img {
				position: absolute;
				top: 45%;
				width: 18px;
				height: 36px;
			}
			
			#main-photo #prev a img {
				left: 15px;
			}
			
			#main-photo #next a img {
				right: 15px;
			}
		
		#main-photo #prev img,
		#main-photo #next img {
			border: 0;
			width: 100%;
			height: 100%;
		}
	
	#photo-description {
		float: left;
		clear: both;
		width: 590px;
		margin-bottom: 8px;
		margin-top: 4px;
	}

	#thumbs-container {
		float: left;
		clear: both;
		width: 475px;
		border-top: 7px solid #ebf4f7;
	}

		#thumbs-container-inner {
			float: left;
			clear: both;
			width: 497px;
		}

		#thumbs-container img {
			border: 2px solid #e9eff4 !important;
			padding: 3px !important;
			margin-right: 6px !important;
			margin-top: 10px !important;
		}
		
		#thumbs-container span {
			display: none;
		}
	
	#comments-container {
		float: left;
		clear: both;
		width: 592px;
	}
	
		.comments-pagination {
			float: left;
			clear: both;
			width: 542px;
			padding: 5px 20px 15px 20px;
		}
		
			.comments-pagination a{
				display: block;
				float: left;
				padding: 2px 4px;
				margin-right: 5px;
			}
			
			.comments-pagination a.active{
				background-color: #ebf4f7 !important;
			}
	
		#comments-form {
			float: left;
			clear: both;
			width: 591px;
			padding: 10px 10px 15px 10px;
			margin-bottom: 30px;
			background-color: #37476b;
		}
		
			#comments-form .input {
				float: left;
				clear: both;
				width: 182px;
				height: 18px;
				margin-top: 3px;
			}
		
			#comments-form label {
				color: #FFFFFF;
				display: block;
				float: left;
				clear: both;
				width: 182px;
				margin-bottom: 6px;
			}
				
				#comments-form label span {
					margin-left: 6px;
				}
			
			#comments-form textarea {
				width: 344px;
				height: 196px;
				margin-bottom: 3px;
				margin-top: 3px;
			}
		
			#comments-form .left {
				float: left;
				width: 208px;
			}
			
			#comments-form .right {
				float: left;
				width: 358px;
			}
			
			#comments-form .warning {
				color: #FFFFFF;
				display: block;
				float: left;
				clear: both;
				width: 182px;
				margin-top: 10px;
			}
			
			#submit {
				font-size: 13px;
				width: 101px;
				height: 37px;
				padding: 0;
				margin: 5px 0 0 0;
				text-decoration: underline !important;
				background: url(../img/comment_submit.jpg);
				border: 0;
				color: #FFFFFF;
				float: left;
				clear: both;
			}
			
		#comments {
			float: left;
			clear: both;
			width: 477px;
			overflow: hidden;
			list-style-type: none;
			margin: 0;
			padding: 0;
		}
		
			#comments li {
				position: relative;
				float: left;
				clear: both;
				width: 572px;
				padding: 15px 10px;
				background-image: url(../img/article_comment_border.gif) !important;
				background-repeat: repeat-x;
				
				min-height:75px;
				height:auto !important;
				height:75px;
			}
			
			#comments .info {
				float: left;
				width: 125px;
				overflow: hidden;
				margin-right: 10px;
			}
			
				#comments .name {
					display: block;
					font-size: 14px;
					color: #00a2ff;
				}
				
				#comments .date {
					font-size: 11px;
					color: #666666;
					display: block;
					float: left;
					clear: both;
				}
				
				#comments .no {
					font-size: 50px;
					color: #cfcdd9;
					position: absolute;
					top: 42px;
					width: 125px;
					overflow: hidden;
				}
			
			#comments .text {
				font-size: 12px;
				color: #747474;
				float: left;
				width: 322px;
				overflow: hidden;
				text-transform: lowercase;
			}

#features-container {
	position: relative;
	float: left;
	clear: none;
	width: 175px;
	overflow: hidden;
	margin-right: 10px;	
}

	#features-menu {
		float: left;
		clear: both;
		width: 175px;
		margin: 0 0 10px 0;
		padding: 0;
		list-style-type: none;
	}
	
		#features-menu li {
			font-size: 14px;
			float: left;
			clear: both;
			width: 155px;
			height: 18px;
			margin: 0 0 5px 0;
			padding: 6px 10px;
			background-image: url(../img/article_features_active.gif);
			background-position: 0 -35px;
			background-repeat: repeat-y;
		}
		
		#features-menu li.active {
			background-image: url(../img/article_features_active.gif) !important;
			background-repeat: repeat-y;
			background-position: 0px -5px;
		}
		
			#features-menu li.active a:link,
			#features-menu li.active a:hover,
			#features-menu li.active a:active,
			#features-menu li.active a:visited {
				color: #FFFFFF !important;
			}
	
	#features-photos,
	#features-tags {
		display: inline;
		float: left;
		clear: both;
		width: 170px;
		margin: 0 0 0 10px;
	}
	
		#features-photos h3,
		#features-tags h3 {
			font-size: 14px;
			line-height: 18px;
			color: #666666;
			float: left;
			clear: both;
			width: 165px;
			margin-top: 10px;
			padding: 7px 0 7px 0;
			border-top: 3px solid #edf4f7;
		}
		
		#features-photos img {
			display: inline;
			float: left;
			border: 3px solid #f1f1f1;
			padding: 3px;
			margin: 0 3px 3px 0;
			width: 69px;
		}
		
	#sections {
		float: left;
		clear: both;
		width: 175px;
		margin: 5px 0 10px 0;
		padding: 0;
		list-style-type: none;
	}
		
		#sections li {
			margin: 0;
			padding: 0;
			float: left;
			clear: both;
			width: 155px;
		}
		
			#sections li div.inner {
				float: left;
				clear: both;
				width: 135px;
				padding: 0 10px;
			}
			
			#sections li h5 {
				font-size: 14px;
				font-weight: normal;
				color: #FFFFFF;
				float: left;
				clear: both;
				width: 155px;
				height: 18px;
				margin: 0 0 5px 0;
				padding: 6px 10px;
				background-image: url(../img/article_features_active.gif);
				background-position: 0 -5px;
				background-repeat: repeat-y;
			}
			
			#sections li p {
				margin: 0 0 5px 0;
				padding: 0;
			}
			
	#info {
		font-size: 12px;
		line-height: 17px;
		float: left;
		clear: both;
		width: 175px;
		margin: 0;
		padding: 0;
		list-style-type: none;
	}
	
		#info li {
			float: left;
			clear: both;
			width: 165px;
			margin: 0;
			padding: 5px 0 5px 10px;
		}
		
	#tags {
		clear: both;
		width: 165px;
		padding-bottom: 8px;
		border-bottom: 3px solid #f1f1f1;
	}
	
		#tags a {
			font-size: 12px;
		}
		
	#comment-teaser {
		display: none; 
		float: left;
		clear: both;
		width: 141px;
		height: 62px;		
		overflow: hidden;
		margin-top: 50px;
		padding: 12px 12px 12px 22px;
		background-image: url(../img/article_comment_teaser_bg.gif);
		background-repeat: no-repeat;
		background-position: 10px 0;
	}
	
		#comment-teaser a {
			text-decoration: underline !important;
		}
	
		#wanna-comment {
			font-size: 14px;
			display: block;
			margin-bottom: 10px;
		}
		


#banners-container {
	float: left;
	clear: right;
	width: 160px;
	overflow: hidden;	
}

	#banner-tower {
		width: 160px;
		height: 600px;
		float: left;
		clear: left;
		margin-right: 10px;	
	}
	
#banner-article {
	float: left;
	padding: 20px 5px;
}

.published {
	color: #00a2ff;
}

.unshown {
	display: none;
}

#bottom-banner {
	float: right;
	margin-top: 20px;
}

#bottom-banner img {
	border: 0;
}

#facebook-box {
	display: inline;
	float: right;
	margin-top: 10px;
	text-align: right;
	width: 345px;
}
