/*
	Theme Name: Micah Ellis Portfolio - Custom
	Theme URI: http://www.mestudios.net
	Description: Custom Wordpress theme designed to showcase the work of the famous Micah Ellis
	Version: 1.2
	Author: James Mehorter www.jamesmehorter.com 
*/


@font-face {
    font-family: 'TradeGothicLTStdRegular';
    src: url('Media/fonts/tradegothicltstd-webfont.eot');
    src: url('Media/fonts/tradegothicltstd-webfont.eot?#iefix') format('embedded-opentype'),
         url('Media/fonts/tradegothicltstd-webfont.woff') format('woff'),
         url('Media/fonts/tradegothicltstd-webfont.ttf') format('truetype'),
         url('Media/fonts/tradegothicltstd-webfont.svg#TradeGothicLTStdRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'TradeGothicLTStdBdCnNo.20';
    src: url('Media/fonts/tradegothicltstd-bdcn20-webfont.eot');
    src: url('Media/fonts/tradegothicltstd-bdcn20-webfont.eot?#iefix') format('embedded-opentype'),
         url('Media/fonts/tradegothicltstd-bdcn20-webfont.woff') format('woff'),
         url('Media/fonts/tradegothicltstd-bdcn20-webfont.ttf') format('truetype'),
         url('Media/fonts/tradegothicltstd-bdcn20-webfont.svg#TradeGothicLTStdBdCnNo.20') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'TradeGothicLTStdBold';
    src: url('Media/fonts/tradegothicltstd-bold-webfont.eot');
    src: url('Media/fonts/tradegothicltstd-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('Media/fonts/tradegothicltstd-bold-webfont.woff') format('woff'),
         url('Media/fonts/tradegothicltstd-bold-webfont.ttf') format('truetype'),
         url('Media/fonts/tradegothicltstd-bold-webfont.svg#TradeGothicLTStdBold') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'TradeGothicLTStdCnNo.18';
    src: url('Media/fonts/tradegothicltstd-cn18-webfont.eot');
    src: url('Media/fonts/tradegothicltstd-cn18-webfont.eot?#iefix') format('embedded-opentype'),
         url('Media/fonts/tradegothicltstd-cn18-webfont.woff') format('woff'),
         url('Media/fonts/tradegothicltstd-cn18-webfont.ttf') format('truetype'),
         url('Media/fonts/tradegothicltstd-cn18-webfont.svg#TradeGothicLTStdCnNo.18') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'TradeGothicLTStdLight';
    src: url('Media/fonts/tradegothicltstd-light-webfont.eot');
    src: url('Media/fonts/tradegothicltstd-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('Media/fonts/tradegothicltstd-light-webfont.woff') format('woff'),
         url('Media/fonts/tradegothicltstd-light-webfont.ttf') format('truetype'),
         url('Media/fonts/tradegothicltstd-light-webfont.svg#tradegothicltstd-light') format('svg');
    font-weight: normal;
    font-style: normal;

}



/* HTML Elements */
Body {
	background: rgb(0,0,0) ;
	margin: 0px ;
	padding: 0px ;
	font-family: 'TradeGothicLTStdRegular', Arial, Helvetica, sans-serif ;
	font-size: 12px ;
}
A {
	color: rgb(0,0,0) ;
	outline: none ;
	text-decoration: none ;
	font-family: 'TradeGothicLTStdRegular', Arial, Helvetica, sans-serif ;
}
	A Img {
		border: 0px ;
	}
H1, H2, H3 {
	display: inline ;
	font-family: 'TradeGothicLTStdBold', Arial, Helvetica, sans-serif ;
}
H2 {
	font-size: 16px ;
	color: #8f9194 ;
	font-family: 'TradeGothicLTStdBdCnNo.20', Arial, Helvetica, sans-serif ;
}
B {
	color: rgb(51,51,51) ;
	font-family: 'TradeGothicLTStdBold', Arial, Helvetica, sans-serif ;
}

	/* Site Elements */
	#website-container {
		display: block ;
		margin: 0 auto 0 auto ;
		width: 100% ;
	}
		#masthead {
			overflow: auto ;
			width: 100% ;
		}
			#branding {
				float: left ;
				width: 50% ;
				height: 60px ;
				background: rgb(0,0,0) ;
				overflow: hidden ;
			}
				#inner-branding {
					float: right ;
					width: 355px ;
					margin: 0 40px 0 0 ;
					overflow: hidden ;
				}
				#branding a {
					float: left ;
					display: block ;
					margin: 7px 10px 0 0 ;
					color: rgb(255,255,255) ;
				}
					#branding img {
						transition: all .2s linear ; 
						-o-transition: all .2s linear ; 
						-moz-transition: all .2s linear ; 
						-webkit-transition: all .2s linear ;
					}
						#branding img:hover {
							-o-opacity: 0.7 ;
							-webkit-opacity: 0.7 ;
							-moz-opacity: 0.7 ;
							opacity: 0.7 ;
						}
				#branding h1 {
					float: left ;
					color: rgb(255,255,255) !important;
					display: block ;
					margin: 17px 0 0 0 ;
					font-size: 20px ;
					font-family: 'TradeGothicLTStdBdCnNo.20', Arial, Helvetica, sans-serif ;
				}
					#branding h1 .light {
						font-family: 'TradeGothicLTStdLight', Arial, Helvetica, sans-serif ;
					}
			nav {
				float: left ;
				padding: 22px 0px 0 0 ;
				width: 50% ; 
				height: 38px ; /* 60 - 20 = 40 */
				background: #8f9194 ;
				overflow: auto ;
			}
				nav ul {
					float: left ;
					display: block ;
					margin: 0px ;
					padding: 0px ;
				}
					nav li {
						float: left ;
						list-style: none ;
						margin-left: 20px ;
					}
						nav li a {
							font-size: 18px ;
							text-transform: uppercase ;
							font-family: 'TradeGothicLTStdCnNo.18', Arial, Helvetica, sans-serif ;
						}
						nav li.current_page_item a {
							font-weight: bold ;
							font-family: 'TradeGothicLTStdBold', Arial, Helvetica, sans-serif ;
						}
		#content {
			background: rgb(255,255,255) ;
			width: 100% ;
			height: 455px ;
		}
			#inner-content {
				width: 800px ;
				margin: 0 auto 0 auto ;
			}
		footer {
			width: 800px ;
			margin: 0 auto 0 auto ;
			margin-top: 15px ;
			margin-bottom: 20px ;
			overflow: auto ;
			background: rgb(0,0,0) ;
		}
			#about, #connect, #contact {
				overflow: visible ;
				color: rgb(255,255,255) ;
				height: 95px ;
			}
			/*
			footer ul {
				margin-top: 0px ;
				margin-bottom: 0px ;
				padding-left: 25px ;
			}
				footer ul li {
					list-style-image: url(Media/Assets/Orange-Arrow.png) ;
					font-size: 11.5px ;
					color: rgb(255,255,255) ;
				}
				footer ul li h2 {
					color: rgb(143,145,148) ;
					padding-bottom: 5px ;
				}
				*/
			#about {
				float: left ;
				width: 420px ; /* 150 - 15 = 125 */
				padding: 0 20px 0 0 ;
				border-right: 1px solid #2c2d2e ;
			}
				#about img {
					float: left ;
					margin: 0 25px 0 0 ;
				}
				#about h3 {
					margin: 0 0 10px 0 ;
				}
				#about p {
					font-size: 12px ;
				}
			#connect {
				float: left ;
				width: 135px ; /* 170 - 25px = 145 */
				padding: 0 0 0 20px ;
			}
				#connect img {
					margin: 6px 0px 0px 3px ;
				}
					#connect div {
						margin-top: 5px;
					}
					#connect a {
						color: rgb(255,255,255) ;
						font-family: 'TradeGothicLTStdBdCnNo.20', Arial, Helvetica, sans-serif ;
						font-size: 24px ;
						display: block ;
						float: left ;
						margin: 0 25px 0 0 ;
						transition: all .2s linear ; 
						-o-transition: all .2s linear ; 
						-moz-transition: all .2s linear ; 
						-webkit-transition: all .2s linear ;
					}
						#connect a:hover {
							-o-opacity: 0.7 ;
							-webkit-opacity: 0.7 ;
							-moz-opacity: 0.7 ;
							opacity: 0.7 ;
						}
			#contact {
				float: left ;
				width: 170px ; /* 180 - 25 = 155 */
				padding: 0 0 0 20px ;
				border-left: 1px solid #2c2d2e ;
			}
				#contact img {
					margin: 5px 0 0 -2px ;
				}				
				#contact a {
					color: rgb(255,255,255) ;
				}
				#contact h2 {
					margin: 0 0 10px 0 ;
				}
				#download-pdf {
					width: 148px ;
					height: 25px ;
					margin: 10px 0 0 0 ;
					background: url(Media/Assets/download-pdf-sprite.png) no-repeat center top ;
					cursor: pointer ;
				}
					#download-pdf:hover {
						background-position: center bottom ;
					}
	#ExtraInfo, #ExtraInfo a {
		font-size: 10px ;
		color: rgb(51,51,51) ;
	}
		#ExtraInfo #Left {
			float: left ;
			margin-top: 5px ;
		}
		#ExtraInfo #Right {
			float: right ;
			margin-top: 30px ;			
		}
	#Browsers {
		padding: 20px ;
		overflow: auto ;
	}
		#Browsers img {
			float: left ;
			margin-top: 20px ;
			margin-right: 20px ;
		}
	/*  Galleryview Overrides  */
	.galleryview {
		float: right ;
		margin: 15px 100px 0px 15px !important ;
		height: 440px !important ;
	}
		.panel {
			padding-top: 0px !important;
			background-color: rgb(0,0,0) !important;
			height: 375px !important;
			overflow: visible !important;
		}
			.panel img {
				width: auto !important;
				height: 375px !important;
				display: block ;
				margin: 0 auto 0 auto ;
			}
			.panel-overlay {
				padding-top: 10px !important ;
				z-index: 1000 !important ;
				position: absolute !important ;
				top: 110px !important;
				left: -260px !important;
				width: 220px !important;
			}
				.panel-overlay, .panel-overlay h2 {
					color: rgb(0,0,0) !important ;
					display: block ;
					font-size: 16px ;
					margin: 0px 0px 15px 0px !important;
				}
				.panel-overlay p {
					margin-top: 2px ;
					font-size: 14px ;
					color: #8f9194 ;
				}
					.panel-overlay p b {
						color: #000000 ;
					}
				.panel-overlay a {
					color: rgb(51,51,51) !important;
				}
				.overlay {
					display: none ;
				}
			#pointer {
				border-color: transparent !important;
			}
				#pointer img {
					display: none ;
				}
			.strip_wrapper {
				left: 25px !important;
				padding-left: 0px !important;
				top: 375px !important;
				width: 500px !important;
			}
				.filmstrip {
					margin-left: 20px !important ;
				}
					.filmstrip li {
					}
			.nav-prev {
				top: 395px !important;
				left: 0px !important;
				visibility: hidden ;
			}
			.nav-next {
				top: 395px !important;
				left: 540px !important;
				visibility: hidden ;
			}