@charset "UTF-8";
/* CSS Document */
/*------------------------------------------------------------------ 
[Master Stylesheet] 
 
Project:    Justin Moreland's personal portfolio 
Version:    1.0 
Last change:    04/16/2009 [Created globalNav, html/css framework] 
Assigned to:    Justin Moreland 
Primary use:    jwmoreland.net 
-------------------------------------------------------------------*/  
@import "/CSS/reset.css";
 
/*------------------------------------------------------------------ 
[Table of contents] 
 
1. Body
2. Header
3. Main Content / #contentMain
4. Global Nav / #globalNav
5. Boundary / #boundary
6. Content
7. Grid
8. Sub Nav / #subNav
9. Footer / #globalFooter
10. Globals
11. Printing / @media print
 
-------------------------------------------------------------------*/
 
 
/*------------------------------------------------------------------ 
[1. Body ] 
*/  
body {
	background-image: url(/images-global/BG-repeat.png);
	background-repeat: repeat-x;
	background-position: left top;
	background-color: #050506;
}
#pageWrap {
	background-image: url(/images-global/BG-texture.jpg);
	background-repeat: no-repeat;
	background-position: center top;
}

/*------------------------------------------------------------------ 
[2. Header ] 
*/  
.boundary {
	display: block;
	width: 960px;
	margin: 0 auto 0 auto;
}
#title {
	padding-top: 34px;
	padding-bottom: 36px;
}
/*------------------------------------------------------------------ 
[3. Main Content / #contentMain ] 
*/  
#contentMain {
	background-color: #e2e2e2;
	background-image: url(/images-global/BG-globalNav_dark2.jpg);
	background-position: right top;
	background-repeat: no-repeat;
	padding-bottom: 12px;
}
#content {
	display: block;
	padding-top: 33px;
	background-image: url(/images-global/BG-TR_mainContent.jpg);
	background-position: right 33px;
	background-repeat: no-repeat;
}

/*------------------------------------------------------------------ 
[4. Global Nav / #globalNav ] 
*/  
#globalNav {
	height: 33px;
	display:block;
	margin: 0;
	padding: 0;
	position: absolute;
	z-index:1;
}

#globalNav li {
	display: block;
	list-style:none;
}
#globalNav li a {
	bottom: 0;
	float: left;
	height: 33px;
	overflow:hidden;
	position: absolute;
	background-repeat: no-repeat;
	background:none;
	background-image: url(/images-global/Navigation.gif);
}

/* default positions */
li#globNavPort a { left: 0; width: 161px; }
li#globNavAbou a { left: 161px; width: 159px; }
li#globNavBlog a { left: 320px; width: 160px; }
li#globNavCont a { left: 480px; width: 161px; }

/* common hover  */
li#globNavPort a:hover { left: 0; margin-right: auto;  }
li#globNavAbou a:hover { left: 156px; width: 164px; }
li#globNavBlog a:hover { left: 315px; width: 165px; }
li#globNavCont a:hover { left: 475px; width: 166px; }

/* default background positions */
li#globNavPort a { background-position: 0 0 }
li#globNavAbou a { background-position: -161px 0 }
li#globNavBlog a { background-position: -320px 0 }
li#globNavCont a { background-position: -480px 0 }


/* portfolio default state */
.portfolio li#globNavPort a { background-position: 0 -165px; }
.portfolio li#globNavAbou a { background-position: -161px -165px; }
.portfolio li#globNavBlog a { background-position: -320px -165px; }
.portfolio li#globNavCont a { background-position: -480px -165px; }

/* portfolio hover state */
.portfolio li#globNavPort a:hover { background-position: 0 -165px; }
.portfolio li#globNavAbou a:hover { background-position: -156px -198px; }
.portfolio li#globNavBlog a:hover { background-position: -315px -33px; }
.portfolio li#globNavCont a:hover { background-position: -475px -99px; }

/* portfolio active state */
.portfolio li#globNavPort a:active { background-position: 0 -165px; }
.portfolio li#globNavAbou a:active { background-position: -156px -231px; }
.portfolio li#globNavBlog a:active { background-position: -315px -66px; }
.portfolio li#globNavCont a:active { background-position: -475px -132px; }

/* about default state */
.about li#globNavPort a { background-position: 0 -264px; }
.about li#globNavAbou a { background-position: -161px -264px; }
.about li#globNavBlog a { background-position: -320px -264px; }
.about li#globNavCont a { background-position: -480px -264px; }

/* about hover state */
.about li#globNavPort a:hover { background-position: 0 -297px; }
.about li#globNavAbou a:hover { background-position: -156px -264px; }
.about li#globNavBlog a:hover { background-position: -315px -363px; }
.about li#globNavCont a:hover { background-position: -475px -99px; }

/* about active state */
.about li#globNavPort a:active { background-position: 0 -330px; }
.about li#globNavAbou a:active { background-position: -156px -264px; }
.about li#globNavBlog a:active { background-position: -315px -396px; }
.about li#globNavCont a:active { background-position: -475px -132px; }

/* blog default state */
.blog li#globNavPort a { background-position: 0 -429px; }
.blog li#globNavAbou a { background-position: -161px -429px; }
.blog li#globNavBlog a { background-position: -320px -429px; }
.blog li#globNavCont a { background-position: -480px -429px; }

/* blog hover state */
.blog li#globNavPort a:hover { background-position: 0 -33px; }
.blog li#globNavAbou a:hover { background-position: -156px -462px; }
.blog li#globNavBlog a:hover { background-position: -315px -429px; }
.blog li#globNavCont a:hover { background-position: -475px -528px; }

/* blog active state */
.blog li#globNavPort a:active { background-position: 0 -66px; }
.blog li#globNavAbou a:active { background-position: -156px -495px; }
.blog li#globNavBlog a:active { background-position: -315px -429px; }
.blog li#globNavCont a:active { background-position: -475px -561px; }

/* contact default state */
.contact li#globNavPort a { background-position: 0 -594px; }
.contact li#globNavAbou a { background-position: -161px -594px; }
.contact li#globNavBlog a { background-position: -320px -594px; }
.contact li#globNavCont a { background-position: -480px -594px; }

/* contact hover state */
.contact li#globNavPort a:hover { background-position: 0 -33px; }
.contact li#globNavAbou a:hover { background-position: -156px -99px; }
.contact li#globNavBlog a:hover { background-position: -315px -627px; }
.contact li#globNavCont a:hover { background-position: -475px -594px; }

/* contact active state */
.contact li#globNavPort a:active { background-position: 0 -66px; }
.contact li#globNavAbou a:active { background-position: -156px -132px; }
.contact li#globNavBlog a:active { background-position: -315px -660px; }
.contact li#globNavCont a:active { background-position: -475px -594px; }


/*------------------------------------------------------------------ 
[6. Content ] 
*/  
#gallery {
	float: right;
	width: 700px;
	margin-right: 10px;
	margin-top: 20px;
}
#gallery h2 {
	font-family: "Trebuchet MS", "Lucida Grande", Arial, sans-serif;
	font-size: 14px;
	font-weight: normal;
	color: #333333;
	padding-bottom: 15px;
}
#gallery p {
	font-family: "Trebuchet MS", "Lucida Grande", Arial, sans-serif;
	font-size: 12px;
	font-weight: normal;
	color: #777777;
	margin-bottom: 10px;
}
#gallery p a {
	color: #777777;
	text-decoration: none;
	padding: 0 1px 0 1px;
}
#gallery p a:hover {
	color: #FFFFFF;
}

#divMyPic {
	float: right;
	width: 170px;
}
#divMyPic p {
	font-family: Helvetica, Arial, san-serif;
	font-size:12px;
	color: #777;
	line-height: 20px;
}

.fieldReq { color:#990000; font-size:16px; }  /* This is for the red in the "*" (required) fields */

/*------------------------------------------------------------------ 
[8. Sub Nav / #subNav ] 
*/  
#subNav {
	margin-left: 11px;
	margin-top: 100px;
	width: 219px;
	float: left;
}
#subNav .active {
	background-image: url(/portfolio/images/arrow_ActivePage.gif);
	background-repeat: no-repeat;
	background-position: 6px; center;
}
#subNav .active a {
	cursor: default;
}
#subNav dt a {
	height: 36px;
	width: 219px;
	display: block;
	background-repeat: no-repeat;
}
#subNav dd {
	border-top: 1px solid #b2b2b2;
	border-bottom: 1px solid #b2b2b2;
	padding: 10px 0px;
}
#subNav ul {
	margin-top: 12px;
}
#subNav dd a, #subNav li a {
	font-family: Helvetica, Arial, sans-serif;
	font-size: 12px;
	text-decoration: none;
	color: #000000;
	display:block;
	margin-left: 15px;
	padding: 4px 4px 4px 10px;
-moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px;
}
#subNav dd a:hover, #subNav li a:hover {
	text-decoration: none;
	background-color:#d2d2d2;
	
}
#subNav dd .active a:hover {
	text-decoration: none;
	background-color:#e2e2e2;	
}
#subNav .divSubNavRule {
	height: 1px;
	background-color:#b2b2b2;
}
.rule {
	height: 1px;
	background-color:#b2b2b2;
	margin-bottom: 10px;
}


#subNav #sn_Web a {
	background-image: url(/portfolio/images/subNav-WebDesign.gif);
	background-position: 10px 0px;

}
#subNav #sn_Web a:hover, #subNav #sn_Print a:hover, #subNav #sn_Photo a:hover {
	background-position: 10px -36px;

}
#subNav #sn_Print a {
	background-image: url(/portfolio/images/subNav-PrintDesign.gif);
	background-position: 10px 0px;

}
#subNav #sn_Identity a {
	background-image: url(/portfolio/images/subNav-Identity.gif);
	background-position: 10px 10px;
}
#subNav #sn_Photo a {
	background-image: url(/portfolio/images/subNav-Photography.gif);
	background-position: 10px 0px;
}

/*------------------------------------------------------------------ 
[10. Globals ] 
*/ 
#globalFooter {
	font-family: Helvetica, Arial, san-serif;
	font-size: 10px;
	color: #333333;
	text-align: right;
	margin-bottom: 8px;
}
#globalFooter a {
	color: #565656;
	text-decoration: none;
	padding: 2px;
}
#globalFooter a:hover {
	background-color: #323433  ;
	color: #FFFFFF;
}
strong { font-weight:bold }



/*------------------------------------------------------------------ 
[10. Globals ] 
*/  
.bottomCap {
	background-image: url(/images-global/BGfoot.png);
	background-repeat: no-repeat;
	background-position: left bottom;
	display: block;
	height: 5px;
	width: 100%; 
	margin-bottom: 24px;
}


/*------------------------------------------------------------------ 
[10. Globals ] 
*/  
.hiddentext { position: absolute; left:0px; text-indent: -9999px; width:1px; height:1px; overflow:hidden; }
.clearer { clear:both; }
.fullWidth {
	margin-right: 91px;
	margin-bottom: 10px;
	margin-left: 91px;
	font-family: "Trebuchet MS", "Lucida Grande", Arial, sans-serif;
	font-size: 12px;
	color: #6E6E6E;
}