@charset "UTF-8";
/* CSS Document */

/**
 * 100% height layout with header and footer
 * ----------------------------------------------
 * Feel free to copy/use/change/improve
 */
/* 	Css Reset -----------------------------------------------------------------------------------------------*/
@font-face	{	font-family: "Avenir";
				src: url("assets/Avenir.otf")
			}
html,body {
	margin:0;
	padding:0;
	height:100%; /* needed for container min-height */
	font-family:Trebuchet MS;
	font-size:small;
	color:#666;
}
div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
}
/*
:focus {
	outline: 0;
}*/
body 	{	color:white;
			background:#111;
			-webkit-text-size-adjust: none;
			height:100%;
			min-height:100%;
		}

ol, ul 	{	list-style: none;
		}
/* tables still need 'cellspacing="0"' in the markup */
table 	{	border-collapse: separate;
			border-spacing: 0;
		}
caption, th, td	{	text-align: left;
					font-weight: normal;
				}
blockquote:before, blockquote:after, q:before, q:after	{	content: "";
														}
blockquote, q	{	quotes: "" "";
				}
em	{	font-style: italic;	}
strong	{	font-weight: bold;	}
a img	{	border: none!important;	}
.clear:after	{	content: ".";
					display: block;
					height: 0;
					font-size: 0;
					clear: both;
					visibility: hidden;
				}
.clear	{	display: inline-block;	}
.clear	{	clear:both;	}

.clearfix:after {content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;}
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix { height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

/* Styles --------------------------------------------------------------------------------*/	

/* End Styles ----------------------------------------------------------------------------*/

div#container	{	position:relative; /* needed for footer positioning*/
					margin:0 auto; /* center, not in IE5 */
					height:auto !important; /* real browsers */
					height:100%; /* IE6: treaded as min-height*/
				
					min-height:100%; /* real browsers */
				}
				
				
/* Header -------------------------------------------------------------------------------*/

div#header {	background:transparent url(assets/headerBckgrnd.png) no-repeat;
				border-bottom: white solid 2px;
				height:100px;
				width:960px;
				margin:0 auto;
				position:relative;
			}
	div#header p 	{	font-style:italic;
						font-size:1.1em;
						margin:0;
					}
	.logo	{	background:url(assets/logo.png) no-repeat;
				text-indent:-9999px;
				height:100px;
				width:400px;
			}
					
	/* Navigation  */
		
		ul#nav	{	list-style-type:none;
					list-style-position:outside;
					position:absolute;
					z-index:1000;
					top:78px;
					left:30px;
				}
		ul#nav li	{	float:left;
						width:75px;
						height:25px;
					}
		ul#nav li a	{	text-decoration:none;
						color:white;
						font-size:16px;
						padding:0 10px 2px 10px;
					}
		ul#nav li a:hover	{	color:#adcffd;
							}
		ul#nav li a:active	{	color:#14478d;
							}
		
	/* End Navigation  */
		
/* End Header ---------------------------------------------------------------------------*/


/* Begin Footer -------------------------------------------------------------------------*/

div#footer 	{	position:absolute;
				width:100%;
				height:325px;
				margin-top:-325px;
				bottom:0; /* stick to bottom */
				background:#ddd;
				border-top:3px solid gray;
				background:black;
				
			}
			
#footContainer	{	width:960px;
					min-height:325px;
					margin:0 auto;
					position:relative;
					background:transparent url(assets/footerBckgrnd.png) bottom no-repeat;
				}
	div#footer p	{	padding:1em;
						margin:0;
					}
#twitter	{	background:transparent url(assets/twitBckgrnd.png) no-repeat;
				width:400px;
				height:325px;
				position:absolute;
				left:550px;
				top:0;
			}
#tweetStatus	{	display:none;	}

#juitterContainer	{	
						padding:75px 10px 10px 75px;
					}

#footer #juitterContainer ul li {	clear:both;
									color:#C1C2C6;
									font-size:12px;
									line-height:16px;
									list-style-image:none;
									list-style-position:outside;
									list-style-type:none;
									width:300px;
									margin:0 0 5px;
									padding:0 0 5px;
									border-bottom:#666 dotted 1px;
								}
#footer #juitterContainer ul li img.juitterAvatar 	{	float:left;
														margin:0 10px 25px 0;
														width:20px;
														display:none;
													}
#footer #juitterContainer ul li a 	{	color:#718098;
										text-decoration:none;
									}
#footer #juitterContainer ul li a:hover {	color:#EEEEEE;
										}
#footer #followMe	{	width:196px;
						height:32px;
						text-indent:-9999px;
						margin:0;
						padding:0;
						background:transparent url(assets/followMe.png) no-repeat -2px 0;
						position:relative;
						left:200px;
					}
#footer #followMe a	{ 	width:100%;
						height:100%;
						display:block;
						
					}
					
.footerBox	{	width:350px;
				position:absolute;
				left:0;
				margin:10px 0 0 0;
			}				
.footerBox	h4	{	font-size:1.3em;
					padding:4px;
					border:#718098 1px solid;
				}
.footerBox p	{	font-size:.9em;
					line-height:1.5em;
				}
.footerBox a 	{	color:#718098;
					text-decoration:none;
				}
						
/* End Footer ---------------------------------------------------------------------------*/

/* Widgets */

/* Portfolio Carosel --------------------------------------------------------------------*/


					
/* End Portfolio Carosel ----------------------------------------------------------------*/

/* Begin Content ------------------------------------------------------------------------*/

div#content {
	padding:0 0 350px 0; /* bottom padding for footer */
	width:960px;
	margin:0 auto;
}
	div#content p {
	}

/* Index Page */

/* Main Content ------------------------------------------------------------------------------- */
	body#index #mainContent	{	height:500px;
								background:url(assets/phone.png) right no-repeat;
								position:relative;
								z-index:500;
								margin:-100px 0 0 0;
							}
	body#index #mainContent h1.tagHead	{	font-size:55px;
											line-height:1.5em;
											padding:130px 0 0 20px ;
											#padding:130px 0 10px 5px ;
											text-indent:105px;
										}
	body#index #mainContent span	{	font-size:155px;
									#font-size:156px;
									text-transform:uppercase;
									line-height:.6em;
									padding:0 0 0 22px;
									#padding:5px 0 20px 22px;
									#margin:10px 0;
								}
	body#index #mainContent p.tag	{	font-family:"Avenir", arial;	
										text-transform:uppercase;
										font-size:18px;
										line-height:1.5em;
										padding:30px 0 0 30px;
										margin:0 0 0 0;
										width:560px;
										display:block;
									}	
	body#index #mainContent p.endLine	{	font-family:"Avenir", arial;	
											text-transform:uppercase;
											font-weight: bold;
											font-size:24px;
											line-height:1.5em;
											letter-spacing:.05em;
											padding: 0 0 0 30px;
											margin:8px 0 10px 0;
											width:560px;
											display:block;
											
										}								
.details	{	text-align: center;
			}
/* End Main Content --------------------------------------------------------------------------- */
	
/* Secondary Content -------------------------------------------------------------------------- */
	
	body#index #secondaryContent	{	border-bottom:2px solid white;
										margin-bottom:10px;
									}
	body#index #secondaryContent ul.secondaryItems	{	background:url(assets/secondaryUL_Backgrnd.png) no-repeat right;
														height:300px;
														position:relative;
													}
	body#index #secondaryContent ul.secondaryItems li 	{	width:220px;
															height:300px;
															display:block;
															float:left;
															padding:20px 10px 0 10px;	
														}
	body#index #secondaryContent ul.secondaryItems li.webTab	{	background:url(assets/secondaryLI_web_Backgrnd.png) no-repeat;
																	background-position:-240px 0;
																}
	body#index #secondaryContent ul.secondaryItems li.webTab:hover	{	background-position:0 0;
																	}
	body#index #secondaryContent ul.secondaryItems li.printTab	{	background:url(assets/secondaryLI_print_Backgrnd.png) no-repeat;
																	background-position:-240px 0;
																}
	body#index #secondaryContent ul.secondaryItems li.printTab:hover	{	background-position:0 0;
																		}
	body#index #secondaryContent ul.secondaryItems li.photoTab	{	background:url(assets/secondaryLI_photo_Backgrnd.png) no-repeat;
																	background-position:-240px 0;
																}
	body#index #secondaryContent ul.secondaryItems li.photoTab:hover	{	background-position:0 0;
																	}
	body#index #secondaryContent ul.secondaryItems li.contactTab	{	width:219px;
																		background:url(assets/secondaryLI_contact_Backgrnd.png) no-repeat;
																		background-position:-240px 0;
																	}
	body#index #secondaryContent ul.secondaryItems li.contactTab:hover	{	background-position:0 0;
																		}																																											
	body#index #secondaryContent ul.secondaryItems li.lastItem	{	width:219px;	}	
	body#index #secondaryContent ul.secondaryItems a	{	color:white;
															text-decoration:none;
														}
	body#index #secondaryContent ul.secondaryItems li h2	{	font-size:30px;
																line-height:1.3em;
																padding-bottom:5px;
															}																								
	body#index #secondaryContent ul.secondaryItems li p	{	font-family:"Avenir", arial;	
															font-size:15px;
															line-height:1.2em;
														}
														
														
	/* End Secondary Content ---------------------------------------------------------------------- */

/* End Index Page */

/* Photo Page */

	body#photo #mainContent	{	height:610px;
								background:url(assets/photoFrame.jpg) top no-repeat;
								position:relative;
								z-index:500;
								margin:0 0 0 0;
							}
	body#photo #mainContent h1.tagHead	{	font-size:30px;
											line-height:1.5em;
											padding:10px 0 0 20px ;
											#padding:10px 0 10px 5px ;
											text-indent:105px;
										}
	body#photo #mainContent span	{	font-size:155px;
										#font-size:156px;
										text-transform:uppercase;
										line-height:.6em;
										padding:0 0 0 70px;
										#padding:5px 0 20px 50px;
										#margin:10px 0;
									}
	body#photo #mainContent p.tag	{	font-family:"Avenir", arial;	
										text-transform:uppercase;
										font-size:18px;
										line-height:1.3em;
										letter-spacing:.05em;
										padding:20px 0 0 30px;
										margin:0 0 10px 0;
										width:500px;
										display:block;
									}						


	body#photo #mainContent .carousel	{	width:700px;
											height:400px;
											display:block;
											margin:0 auto;
											position:relative;
											top:-55px;
											overflow:hidden;
											background:transparent url(assets/loading_white.gif) center no-repeat;
										}
	body#photo #mainContent .carousel ul	{	width:700px;
												height:400px;
											}
	body#photo #mainContent .carousel ul li	{	width:700px;
												height:400px;
											}										
	
	body#photo #mainContent button.prev	{	background:transparent url(assets/rev_button.png) no-repeat -65px 0; 
											width:65px;
											height:60px;
											position:relative;
											top:100px;
											border:none;
										}
	body#photo #mainContent button.prev:hover	{	background-position: 1px 0;
												}
	body#photo #mainContent button.next	{	background:transparent url(assets/for_button.png) no-repeat;	
											width:65px;
											height:60px;
											position:relative;
											right:-830px;
											top:100px;
											border:none;
										}
	body#photo #mainContent button.next:hover	{	background-position:-66px 0;
												}
					
/* Contact Page ----------------------------------------------------------------------------------------- */

	body#contact #mainContent	{	background:url(assets/cordless.png) 500px -15px no-repeat;
							}
	body#contact #mainContent h1.tagHead	{	font-size:55px;
												line-height:1.5em;
												padding:130px 0 0 20px ;
												text-indent:105px;
											}
	body#contact #mainContent span	{	font-size:155px;
										#font-size:156px;
										text-transform:uppercase;
										line-height:.6em;
										padding:0 0 0 70px;
									}
	body#contact #mainContent p.tag	{	text-transform:uppercase;
										font-size:18px;
										line-height:1.3em;
										letter-spacing:.1em;
										padding:10px 0 0 30px;
										margin:0 0 10px 0;
										width:500px;
										display:block;
									}
	body#contact #secondaryContent	{	
									}
	form#contactUs	{	width:475px;
						margin:10px 0 0 0;
					}
	form#contactUs fieldset	{	border: white solid 2px;
								padding:15px;
							}
	.formName	{	font-size:22px;
					padding:3px 15px;
					margin:0 15px;
				}
	label	{	font-size:20px; 
				text-align:left;
				color:#adcffd; 
				font-weight:bold;
				margin:0 0 0 0;
				display:block;
				line-height:1.2em;
			}
	label.error	{	font-weight:normal;
					font-size:12px;	
					color:red;
					text-align:right;
					width:140px; 
					padding:0 0 10px 25px;
				}
	.formInput	{	font-size:30px;
					margin:10px 0;
				}
	input.text-input	{ 	margin:4px 0 0 0;
							padding:2px 0;
							color:#333;
						}
	.button	 	{	font-size:16px;
					border:solid white 1px;
					padding:5px;
					margin-right:10px;
					background-color:none;
				}
	.button:hover	{	background-color:#adcffd;	}
	.button:active	{	background-color:#14478d;	}

	/* After Sending */
		#message	{	height: 450px;
						padding:15px;
					}
		#message h2	{	font-size:42px;
						color:#adcffd;
						margin-bottom:15px;
					}
		#message p	{	font-size:24px;
						line-height:1.3em;
					}
/* End Contact Page ------------------------------------------------------------------------------------- */			

/* Print Design Page ------------------------------------------------------------------------------------ */

	body#print #mainContent	{	height:610px;
								position:relative;
								z-index:500;
								margin:0 0 0 0;
							}
	body#print #mainContent h1.tagHead	{	font-size:30px;
											line-height:1.5em;
											padding:10px 0 0 20px ;
											#padding:10px 0 10px 5px ;
											text-indent:105px;
										}
	body#print #mainContent span	{	font-size:155px;
										#font-size:156px;
										text-transform:uppercase;
										line-height:.6em;
										padding:0 0 0 70px;
										#padding:5px 0 20px 50px;
										#margin:10px 0;
									}
	body#print #mainContent p.tag	{	font-family:"Avenir", arial;	
										text-transform:uppercase;
										font-size:18px;
										line-height:1.3em;
										letter-spacing:.05em;
										padding:20px 0 0 30px;
										margin:0 0 10px 0;
										width:500px;
										display:block;
									}						


	body#print #mainContent .carousel	{	width:700px;
											height:400px;
											display:block;
											margin:0 auto;
											position:relative;
											top:-55px;
											overflow:hidden;
											background:transparent url(assets/loading.gif) center no-repeat;
										}
	body#print #mainContent .carousel ul	{	width:700px;
												height:400px;
											}
	body#print #mainContent .carousel ul li	{	width:700px;
												height:400px;
											}										
	
	body#print #mainContent button.prev	{	background:transparent url(assets/rev_button.png) no-repeat -65px 0; 
											width:65px;
											height:60px;
											position:relative;
											top:100px;
											border:none;
										}
	body#print #mainContent button.prev:hover	{	background-position: 1px 0;
												}
	body#print #mainContent button.next	{	background:transparent url(assets/for_button.png) no-repeat;	
											width:65px;
											height:60px;
											position:relative;
											right:-830px;
											top:100px;
											border:none;
										}
	body#print #mainContent button.next:hover	{	background-position:-66px 0;
												}
	
/* End Print Design Page -------------------------------------------------------------------------------- */

/* Web Design Page -------------------------------------------------------------------------------------- */

	body#web #mainContent	{	height:610px;
								position:relative;
								z-index:500;
								margin:0 0 0 0;
							}
	body#web #mainContent h1.tagHead	{	font-size:30px;
											line-height:1.5em;
											padding:10px 0 0 20px ;
											#padding:10px 0 10px 5px ;
											text-indent:105px;
										}
	body#web #mainContent span	{	font-size:155px;
										#font-size:156px;
										text-transform:uppercase;
										line-height:.6em;
										padding:0 0 0 70px;
										#padding:5px 0 20px 50px;
										#margin:10px 0;
									}
	body#web #mainContent p.tag	{	font-family:"Avenir", arial;	
										text-transform:uppercase;
										font-size:18px;
										line-height:1.3em;
										letter-spacing:.05em;
										padding:20px 0 0 30px;
										margin:0 0 10px 0;
										width:500px;
										display:block;
									}						


	body#web #mainContent .carousel	{	
											height:400px;
											display:block;
											margin:0 auto;
											position:relative;
											top:-55px;
											overflow:hidden;
										}
	body#web #mainContent .carousel ul	{	width:700px;
											height:400px;
										}
	body#web #mainContent .carousel ul li	{	width:700px;
												height:400px;
											}
	
	body#web #mainContent .carousel ul li div.caroselItemContainer	{	max-width:275px;
																		position:absolute;
																	}
	body#web h2	{	margin:0 0 10px 0;
					display: block;
				}										
	body#web #mainContent .carousel ul li img	{ 	position:relative;
													left:300px;
												}
	body#web #mainContent button.prev	{	background:transparent url(assets/rev_button.png) no-repeat -65px 0; 
											width:65px;
											height:60px;
											position:relative;
											top:100px;
											border:none;
										}
	body#web #mainContent button.prev:hover	{	background-position: 1px 0;
											}
	body#web #mainContent button.next	{	background:transparent url(assets/for_button.png) no-repeat;	
											width:65px;
											height:60px;
											position:relative;
											right:-830px;
											top:100px;
											border:none;
										}
	body#web #mainContent button.next:hover	{	background-position:-66px 0;
											}
	
/* End Web Design Page ---------------------------------------------------------------------------------- */

