/* CSS Document */

html, body, div, span, applet, object, iframe, h2, h3, h4, h5, h6, 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, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { 
	margin: 0; 
	padding: 0;
	font-size: 100%;
	vertical-align: baseline;
	border: 0;
	background: transparent;
	list-style:none;
	}

@font-face {
	font-family: 'PTSansRegular';
	src: url('fonts/PT_Sans.eot');
	src: local('PT Sans Regular'), local('PTSans-Regular'), url('fonts/PT_Sans.woff') format('woff'), url('fonts/PT_Sans.ttf') format('truetype');
}

@font-face {
	font-family: 'PTSansNarrowRegular';
	src: url('fonts/PT_Sans_Narrow.eot');
	src: local('PT Sans Narrow Regular'), local('PTSans-Narrow'), url('fonts/PT_Sans_Narrow.woff') format('woff'), url('fonts/PT_Sans_Narrow.ttf') format('truetype');
}


p { font-family: PTSansRegular, Helvetica, Arial, sans-serif; font-size:12px; line-height:18px; color:#333; padding: 5px 15px 0px 16px; margin:0px; letter-spacing: -0.00em;  }

.para { font-family: PTSansRegular, Helvetica, Arial, sans-serif; font-size:12px; line-height:18px; color:#333; padding:16px; letter-spacing: -0.00em;  }

h1 { font-family: PTSansNarrowRegular, Helvetica, Arial, sans-serif; font-size:18px; line-height:19px; color:#333; padding:16px 5px 0px 16px; margin:0px; letter-spacing: -0.00em;  }

.ad { margin: 25px 10px 10px; }

.clear { clear: both; width: 825px; height: 200px;}

body {
	background: url(imgs/bkg.jpg) repeat-x top fixed, url(imgs/bkg-2.jpg) repeat-x bottom fixed;
	margin: 6px 0px 35px 0px;
}
img { border: 0; }

#home-wrapper {  }

#about-wrapper {  }

#folio-wrapper { }

#contact-wrapper {  }

.background-lower { background-image:url(imgs/bkg-2.jpg); background-repeat:repeat-x; background-position:bottom; height: inherit; width: 100%; position: absolute; z-index:-10; }

#get-in-touch { width: 33px; height: 185px; position: fixed; left: 0px; bottom: 100px; background-image:url(imgs/get-in-touch.png); z-index: 11; }

.spacer { width: 100%; margin: 15px auto; clear: both; height: 30px;}

#jump { width: 430px; height: 30px;  position: fixed; bottom: 5px; left: 50%; margin: 0 0 0 -215px; background: #333; border: 6px solid #f1f1f1; z-index: 50; }

#jump li { margin: 5px 25px; font-family: PTSansRegular, Helvetica, Arial, sans-serif; font-size:14px; color:#fff; float: left; }
#jump li a { text-decoration: none; color: #fff; }
#jump li a:hover { color: #84D0F0; }

/* -----------------------------
			NAVIGATION
-------------------------------- */
.menu { margin:auto; margin-top:10px; margin-bottom: 10px; width: 825px; height:265px; clear: both; background-image:url(imgs/design-studio-logo.png); background-position: center; background-repeat:no-repeat; background-position:top; }
 
.dotted-line { margin: auto; background-image:url(imgs/dots.gif); background-repeat:repeat-x; width: 825px; height: 4px; display: block; clear:both; overflow:hidden; }


.menu .navigation { margin:auto; width: 596px; position: relative; top: 200px; border: 0px; }

.menu .navigation li {
	display: inline;
}

.menu .navigation li a {
	background: url(imgs/nav-bkg.png) no-repeat;
	float:left;
	height:50px;
	overflow:hidden;
	padding-top: 0px;
	width:149px;
}

.menu .navigation li.home a { background-position: 0px 0; }

.menu .navigation li.portfolio a { background-position: -150px 0px; }
 
.menu .navigation li.services a {
	background-position: -300px 0px;
}
 
.menu .navigation li.contact a {
	background-position: -450px 0px;
}
 
.menu .navigation li.home a:hover {
	background-position: 0 -49px;
}
 
.menu .navigation li.portfolio a:hover {
	background-position: -150px -49px;
}
 
.menu .navigation li.services a:hover {
	background-position: -300px -49px;
}

.menu .navigation li.contact a:hover {
	background-position: -450px -49px;
}

.menu .navigation li.home a#first {
	background-position: 0 -49px !important;
}
 
.menu .navigation li.portfolio a#second {
	background-position: -150px -49px !important;
}
 
.menu .navigation li.services a#third {
	background-position: -300px -49px !important;
}

.menu .navigation li.contact a#fourth {
	background-position: -450px -49px !important;
}


/* -----------------------------
			HOME PAGE
-------------------------------- */

#home-content { width: 825px; height: auto; clear:both; margin:auto; padding-top: 20px; }

#i-love-design { background-image: url(imgs/i-love-design.png); width: 576px; height: 264px; background-repeat: no-repeat; margin: 0px 0px 45px 0px; float: left; display:block; }

#featured-work { width: 221px; height: 232px; background-image: url(imgs/featured-work-bg.png); margin: 44px 0px 0px 0px; float:right; display:block; }

/*--Main Container--*/
#featured-work .main_view {
	float: left;
	position: relative;
}
/*--Window/Masking Styles--*/
#featured-work .window {
	height:210px;	width: 210px;
	overflow: hidden; /*--Hides anything outside of the set width/height--*/
	position: relative; margin-top:5px; margin-left:5px; }
#featured-work .image_reel {
	position: absolute;
	top: 0; left: 0;
}
#featured-work .image_reel img {float: left;}
#featured-work .paging { z-index: -1; width:1px; height:1px; overflow:hidden; }

#featured-work #title { background-image:url(imgs/featured-title.jpg); width: 35px; height: 177px; position:absolute; margin: -30px 0px 0px 25px; z-index:10; }

#about { width: 526px; height: 325px; background-image:url(imgs/home-bg-1.png); background-repeat: no-repeat; background-position:bottom; float:left; margin: 55px 0px 0px 0px; position:absolute;  } 
 
.title {
	background-image:url(imgs/titles-about.png);
	position:absolute;
	width: 37px;
	height: 138px;
	margin: -30px 0px 0px 25px;
	z-index:2;
}

.home-filler {
	background-color:#F2F2F2;
	width: inherit;
	height: 310px;
	position:absolute;
	margin: 0px 0px 0px 0px;
}


/* -----------------------------
			CONNECT
-------------------------------- */

#connect { width: 240px; height: 325px; float: right; background-image:url(imgs/home-bg-2.png); background-repeat:no-repeat; background-position:bottom; margin: 55px 0px 0px 0px; }

#connect #title1 { width: 37px; height: 138px; margin: -30px 0px 0px 25px; float:left; position:absolute; display:block; z-index:2; }

#connect #title2 { width: 37px; height: 138px; margin: -30px 0px 0px 75px; float:left; position:absolute; display:block; z-index:2; }

#connect #title3 { width: 37px; height: 138px; margin: -30px 0px 0px 126px; position: absolute; float: left; display: block; z-index:2; }

#connect #title4 { width: 37px; height: 138px; margin: -30px 0px 0px 178px; position: absolute; float:left; display:block; z-index:2; }

#twitter-bg { background-image:url(imgs/tweet-bg.png); background-repeat:no-repeat; background-position:center; width: 100%; height: 150px; margin: 135px 0px 0px 0px; }

#twitter-bg #twitter-post {
	width: 165px;
	height: 80px;
	margin-top:55px;
	margin-left: 40px;
	overflow:hidden;
	position:absolute;
}

#tweet { font-family:Arial, Helvetica, sans-serif; font-size:11px; line-height:14px; color:#333333; margin:5px 5px 5px 5px; }

#tweet a {color:#84D0F0; }

#tweet ul { line-height:17px; }

.twitterTime {	font-style:italic; text-align: center; font-size:9px;
}


/* -----------------------------
			ABOUT
-------------------------------- */

#about .home-filler #danny {
	background-image:url(imgs/danny.jpg);
	background-repeat:no-repeat;
	width: 185px;
	float:right;
	height:85px;
	padding-top:225px;
	padding-left:17px;
	margin: 0px -10px 0px 0px;
}

#about .home-filler #about-spc { background-image:url(imgs/about-spc.jpg); margin-left:80px; float:left; background-repeat:no-repeat; height:310px; width:22px; }

#about .home-filler #about-content { height:310px; width:215px; float:left; }


/* -----------------------------
			SERVICES
-------------------------------- */
#services-content { width: 825px; height: auto; clear:both; margin:auto; padding-top: 20px; }

#services-content #design { width: 281px; background-image:url(imgs/about/design-head.png); background-repeat:no-repeat; background-position:top; margin: 0px 0px 0px -20px; float:left; }

#services-content #design .body { background-image:url(imgs/about/design-body.png); width: 281px; height: 295px; margin-top: 162px; }

#services-content #design  p { padding: 10px 15px 10px 110px; }
#services-content #print  p { padding: 10px 20px 10px 105px; }
#services-content #online  p { padding: 10px 25px 10px 100px; }

#services-content #print { width: 281px; background-image:url(imgs/about/print-head.png); background-repeat:no-repeat; background-position:top; float:left; }

#services-content #print .body { background-image:url(imgs/about/print-body.png); width: 281px; height: 295px; margin-top: 162px; }


#services-content #online { width: 280px; background-image:url(imgs/about/online-head.png); background-repeat:no-repeat; background-position:top; float:left; }

#services-content #online .body { background-image:url(imgs/about/online-body.png); width: 280px; height: 295px; margin-top: 162px; }

#services-content #quote { width:595px;  height:50px; padding-top:25px; clear:both; margin-top: 25px; margin-right: auto; margin-bottom: 50px; margin-left: auto; }

.small-text {
	text-align:center;
	font-size: 9px;
	width:600px;
	margin:auto;
}


/* --------------------------------
			FOLIO
----------------------------------- */

#logos {width: 825px; height:auto; margin: auto; }

.thumbs-left { width: 386px; height: 185px; margin: 40px 5px 0px 15px; float:left; }

.thumbs-right { width: 386px; height: 185px; margin: 40px 15px 0px 0px; float:right; }

.thumbs { margin: 40px 12px 5px 13px; float: left; background: url(imgs/folio-border-2.png) no-repeat bottom; padding: 0 0 0px 0;}

#logos .thumbs img { width: 238px; }

#logos img { border: 6px solid #f1f1f1; }


/* --------------------------------
			CONTACT
----------------------------------- */

#contact-content #base #details {width: 338px; height:339px; padding:10px 0 0 0; background-color:#F2F2F2;  }

#contact-content #base { width:338px; height:377px; float:left; background-image:url(imgs/contact-bkg.png); background-repeat:no-repeat; background-position:bottom; }

#contact-content {	width: 825px; margin:auto; padding-top:60px;  }

#contact-content #dees { float: right; display: block; margin-bottom:60px;  }



/* --------------------------------
			CONTACT FORM
----------------------------------- */

form { width:350px;  }

#inline1 { display:none; width:700px; }

#formpage { width: 450px;  overflow:hidden; }

input, input.text, input.title, textarea, select { font-size:12px; padding: 6px; color: #333; background: #EEE;border:0; }

input:focus, input.text:focus, input.title:focus, textarea:focus, select:focus { color:#333;border:0; background: #B6E3F2;  }

input.submitButton { border:0; background:transparent; margin-left:10px; margin-bottom:25px; clear:both; }

input.submitButton:focus {border:0; background:transparent; margin-left:10px; margin-bottom:25px; clear:both;  }

.formlabels { width: 300px; margin-right: 10px; float:left;}

.formboxes { width: 300px; float:left; clear: right; margin-bottom:15px;  }

/* --------------------------------
			BORDERS
----------------------------------- */
#te, #le, #re, #be {
    position: fixed;
    z-index: 10;
    background-color: #fff;
    display: block;
}
#te {
    height: 10px;
    left: 0;
    right: 0;
    top: 0;
    padding: ;
}

#be {
    height: 20px;
    left: 0;
    right: 0;
    bottom: 0;
}
#le {
    width: 10px;
    left: 0;
    bottom: 0;
    top: 0;
}

#re {
    width: 10px;
    top: 0;
    right: 0;
    bottom: 0;
}
footer { width: 825px; margin: -5px auto 10px auto; text-align: right; }
footer p { font-size: 10px;}