/*

	1 - LAYOUT

		1.1 - Header
		1.2 - Content
		1.3 - Footer

*/

/*===============================================

	L A Y O U T
	Layout styles

===============================================*/

/*
	Hierarchy:

	#layout
	| #header
	| | #header-layout-2
	| | | #header-holder-2
	| | | | ...
	| | #header-layout
	| | | #header-holder
	| | | | #logo
	| | | | #hcustom
	| | | | ...
	| #content
	| | #content-layout
	| | | #content-holder
	| | | | #content-box
	| | | | | div
	| | | | | | div
	| | | | | | | ...
	| | | | #sidebar
	| | | | | ...
	| #footer
	| | #footer-layout
	| | | #footer-holder
	| | | | #footer-box
	| | | | | .sidebar-footer
	| | | | | | ...
	| | | #copyrights-holder
	| | | | #copyrights-box
*/

#layout {
	max-width: 100%;
	overflow: hidden;
}


	/*-------------------------------------------
		1.1 - Header
	-------------------------------------------*/

	#header {
		position: relative;
		background: #3c424f;	
		z-index: 3;
	}
	
		#header-layout-2 {
			background: url('../images/bg-black-40.png') center center repeat;	
		}

			#header-holder-2 {
				position: relative;
				display: block;
				width: 1200px;
				margin: 0 auto;
			}

		#header-layout {
		}
	
			#header-holder {
				position: relative;
				display: block;
				width: 1200px;
				color: #CCC;
				margin: 0 auto;
				padding: 10px 0;
			}


				/*--- Logo -----------------------------*/

				#logo {
					width: 312px;
					height: 67px;
					float: left;
				}

					#logo h2,
					#logo h2 a,
					#logo h2 img {
						position: relative;
						display: block;
						font-size: 36px;
						line-height: 0.9em;
						font-weight: 300;
						color: #FFF;
						letter-spacing: -0.02em;
						text-decoration: none;
						max-width: 100%;
						margin: 0;
						padding: 0;
						opacity: 1;
					}

						#logo h2 {
							margin-right: 50px;
							max-width: 262px;
						}

							.hidpi #logo h2 img {
								opacity: 0;
							}

							#logo h2 strong {
								font-weight: bold;
							}


				/*--- Custom data -----------------------------*/

				#hcustom {
					height: 67px;
					max-width: 262px;
					float: right;
				}

					#hcustom a {
						color: #FFF;
					}


	/*-------------------------------------------
		1.2 - Content
	-------------------------------------------*/

	#content {
		z-index: 1;
		position: relative;
	}

		#content-layout {
		}

			#content-holder {
				display: block;
				width: 1200px;
				margin: 0 auto;
				padding: 0;
				z-index: 1;
			}

				#content-box {
					min-height: 600px;
				}

					/* Content area */
					div.post-single {
						width: 667px;
					}

					/* If sidebar by right */
					.sidebar-position-right #content-box {
						float: left;
						width: 888px;
					}
	
						.sidebar-position-right #content-box > div {
							padding: 50px 51px 50px 0;
							background: url('../images/line.png') right top repeat-y;
						}

							.sidebar-position-right div.post-single {
								float: right;
							}

					/* If sidebar by left */
					.sidebar-position-left #content-box {
						float: right;
						width: 888px;
					}
					
						.sidebar-position-left #content-box > div {
							padding: 50px 0 51px 51px;
							background: url('../images/line.png') left top repeat-y;
						}

							.sidebar-position-left div.post-single {
								float: left;
							}

					/* If sidebar none */						
					.sidebar-position-none #content-box > div {
						padding: 50px 0;
					}

						.sidebar-position-none div.post-single {
							float: right;
							width: 1030px;
						}


	/*-------------------------------------------
		1.3 - Footer
	-------------------------------------------*/

	#footer {
		position: relative;
		color: #777;
		background: #3c424f;
	}
	
		#footer-layout {
		}
		
			#footer-holder {
				position: relative;
				width: 1200px;
				margin: 0 auto;
				z-index: 2;
			}
	
	
	#copyrights-holder {
		padding: 10px 0;
		background: url('../images/bg-black-40.png') top left repeat;
	}
	
		#copyrights-box {
			width: 1200px;
			margin: 0 auto;
		}

			#copyrights-box a:hover {
				color: #FFF;
			}
	
			#copyrights-company {
				font-size: 12px;
				width: 65%;
				float: left;
			}
			
			#copyrights-developer {
				font-size: 12px;
				width: 35%;
				float: right;
				text-align: right;
			}