/* 
	CSS for Spike Productions
	E-scape Interactive
    M. J. Magee, 2007

*/


	* { margin: 0px; padding: 0px; }
	body { background: url(../img/wood-bg.jpg); text-align: left; font-family: Arial, Helvetica, sans-serif; font-size: 100%; color: #333333; }
	
	h2 { font-family: Arial, Helvetica, sans-serif; font-weight: bold; color: #ed3024; margin: 0; }
	h3 { font-family: Arial, Helvetica, sans-serif; font-weight: bold; color: #000000; }
	
	hr { display: none; }
	
	.no-italics { font-style: normal; }
	
	.clear { clear: both; height: 0px; width: 0px; border: 0px; background: transparent; }

	
	
	#top { background: url(../img/desk-top.jpg) no-repeat; width: 745px; height: 64px; position: absolute; top: 0px; left: 235px; }
	
	
	/* Business Card */
		#business-card-top a { background: url(../img/business-card-top.jpg) no-repeat; width: 237px; height: 62px; position: absolute; top: 0px; left: 0px; }
			#business-card-top span { display: none; }
		
		#business-card-left a { background: url(../img/business-card-left.jpg) no-repeat; width: 92px; height: 153px; position: absolute; top: 62px; left: 0px; }
			#business-card-left span { display: none; }
			
		#business-card-right a { background: url(../img/business-card-right.jpg) no-repeat; width: 173px; height: 109px; position: absolute; top: 62px; left: 90px; }
			#business-card-right h2 { display: none; }
			#business-card-right span { display: none; }
			
		#business-card-bottom a { background: url(../img/business-card-bottom.jpg) no-repeat; width: 73px; height: 48px; position: absolute; top: 171px; left: 92px; }
			#business-card-bottom span { display: none; }
	
	
	/* Header */
		#header { background: #FFFFFF; width: 440px; height: 182px; position: absolute; top: 64px; left: 130px; overflow: hidden; }
		#logo-text { position: absolute; top: 30px; right: 18px; text-align: right; }
			#logo-text h1 { color: #ed3024; font-size: 160%; font-weight: bold; }
			#logo-text span { color: #000000; font-size: 110%; font-weight: bold; }
			
	
	/* Navigation */
		#navigation { position: absolute; top: 107px; right: 0px; }
		#navigation span { display: none; }
		
		#top-nav { list-style: none; width: 406px; height: 28px; }
		#top-nav li { display: inline; float: left; }
		
		#tab-home { background: url(../img/tab-home-on.jpg) no-repeat; width: 43px; height: 28px; }
		#tab-home a { background: url(../img/tab-home-off.jpg) no-repeat; width: 43px; height: 28px; display: block; }
		#tab-home a:hover { background: url(../img/tab-home-on.jpg) no-repeat; width: 43px; height: 28px;  display: block;}
		#tab-home a.on { background: url(../img/tab-home-on.jpg) no-repeat; width: 43px; height: 28px;  display: block;}
		
		#tab-news { background: url(../img/tab-news-on.jpg) no-repeat; width: 46px; height: 28px; }
		#tab-news a { background: url(../img/tab-news-off.jpg) no-repeat; width: 46px; height: 28px;  display: block;}
		#tab-news a:hover { background: url(../img/tab-news-on.jpg) no-repeat; width: 46px; height: 28px;  display: block;}
		#tab-news a.on { background: url(../img/tab-news-on.jpg) no-repeat; width: 46px; height: 28px;  display: block;}
		
		#tab-team { background: url(../img/tab-team-on.jpg) no-repeat; width: 46px; height: 28px; }
		#tab-team a { background: url(../img/tab-team-off.jpg) no-repeat; width: 46px; height: 28px;  display: block;}
		#tab-team a:hover { background: url(../img/tab-team-on.jpg) no-repeat; width: 46px; height: 28px;  display: block;}
		#tab-team a.on { background: url(../img/tab-team-on.jpg) no-repeat; width: 46px; height: 28px;  display: block;}
		
		#tab-services { background: url(../img/tab-services-on.jpg) no-repeat; width: 64px; height: 28px; }
		#tab-services a { background: url(../img/tab-services-off.jpg) no-repeat; width: 64px; height: 28px;  display: block;}
		#tab-services a:hover { background: url(../img/tab-services-on.jpg) no-repeat; width: 64px; height: 28px;  display: block;}
		#tab-services a.on { background: url(../img/tab-services-on.jpg) no-repeat; width: 64px; height: 28px;  display: block;}
		
		#tab-clients { background: url(../img/tab-clients-on.jpg) no-repeat; width: 54px; height: 28px; }
		#tab-clients a { background: url(../img/tab-clients-off.jpg) no-repeat; width: 54px; height: 28px;  display: block;}
		#tab-clients a:hover{ background: url(../img/tab-clients-on.jpg) no-repeat; width: 54px; height: 28px;  display: block;}
		#tab-clients a.on { background: url(../img/tab-clients-on.jpg) no-repeat; width: 54px; height: 28px;  display: block;}
		
		#tab-showreel { background: url(../img/tab-showreel-on.jpg) no-repeat; width: 68px; height: 28px; }
		#tab-showreel a { background: url(../img/tab-showreel-off.jpg) no-repeat; width: 68px; height: 28px;  display: block;}
		#tab-showreel a:hover { background: url(../img/tab-showreel-on.jpg) no-repeat; width: 68px; height: 28px;  display: block;}
		#tab-showreel a.on { background: url(../img/tab-showreel-on.jpg) no-repeat; width: 68px; height: 28px;  display: block;}
		
		#tab-contact { background: url(../img/tab-contact-on.jpg) no-repeat; width: 85px; height: 28px; }
		#tab-contact a { background: url(../img/tab-contact-off.jpg) no-repeat; width: 85px; height: 28px;  display: block;}
		#tab-contact a:hover { background: url(../img/tab-contact-on.jpg) no-repeat; width: 85px; height: 28px;  display: block;}
		#tab-contact a.on { background: url(../img/tab-contact-on.jpg) no-repeat; width: 85px; height: 28px;  display: block;}
		
	
	
	/* Reels */
		#reels-left { background: url(../img/reels-left.jpg) no-repeat; width: 92px; height: 374px; position: absolute; top: 211px; left: 0px; }
		#reels-right a { background: url(../img/reels-right.png) no-repeat; width: 130px; height: 348px; position: absolute; top: 435px; left: 0px; display: block; }
		#reels-right span { display: none; }
		
	
	/* Main Body */
		#main-body { width: 609px; position: absolute; top: 235px; left: 44px; }
		
		#text-wrapper { background: url(../img/book-repeating-bg.png) repeat-y; width: 609px; }
		#homepage div#text { position: relative; bottom: 10px; }
		#homepage div#text div.articlecontent img { margin: 5px 10px; }
		#text { width: 420px; min-height: 400px; padding: 0px 90px 35px 90px; font-size: 80%; position: relative; }
			#text h2 { font-size: 130%; margin: 0 0 10px 0; }
			#text h3 { font-size: 100%; border-bottom: 1px solid #e5e5e5; padding: 0 0 2px 0; margin: 20px 0px 10px 0px; }
			#text h4 { font-size: 100%; margin: 10px 0px 0px 0px; }
			#homepage div#text a { color: #000000; font-weight: bold; text-decoration: none; }
			#homepage div#text a:hover { color: #ed3024;  }
			#text a { color: #ed3024; text-decoration: none; }
			#text a:hover { text-decoration: underline; }
			#text p { margin: 0 0 10px 0;  }
			
			#error-text { text-align: center; margin: auto; font-size: 90%; }
			
			.articlecontent img { float: left; background: #e8e8e8; padding: 3px; border: 1px solid #000000; margin: 10px; }
		
			
		#team h3 { font-size: 100%; border-bottom: 1px solid #e5e5e5; width: 250px; padding: 0 0 2px 0; margin: 20px 0px 10px 0px; }
	
		#details p { margin: 0 0 10px 0; }
		#details h3{ font-size: 100%; border-bottom: 0px; padding: 0; margin: 0px 0px 10px 0px; }
		#details ul { list-style: disc; margin: 10px; }
			#details ul li { margin: 5px 0; }
		#details img { border: 1px solid #e0e0e0; float: left; margin: 10px 10px 10px 0px; padding: 5px; }
	
	
	/* Styled Elements */
		#text a.learn-more { background: url(../img/main-arrow.jpg) no-repeat 0px 3px; padding: 0 13px; color: #000000; font-weight: bold; text-decoration: none; }
			#text a.learn-more:hover { color: #ed3024; }
			
		.learn-more-sidebar { background: url(../img/sidebar-arrow.jpg) no-repeat 0px 2px; padding: 0 13px;  color: #000000; font-weight: bold; text-decoration: none; }
			.learn-more-sidebar:hover { text-decoration: underline; }
			
		.learn-more-transparent { background: url(../img/arrow.gif) no-repeat 0px 3px; padding: 0 13px;  color: #000000; font-weight: bold; text-decoration: none; }
			.learn-more-transparent:hover { text-decoration: underline; }
			
		#text a.learn-more-news { background: url(../img/news-arrow.jpg) no-repeat 0px 4px; padding: 0 13px;  color: #000000; font-weight: bold; text-decoration: none; }
			#text a.learn-more-news:hover { color: #ed3024; }
			
			
			#news-other-headlines { list-style: none; margin: 10px 0 0 20px; }
				#news-other-headlines li { background: url(../img/main-arrow.jpg) no-repeat 0px 3px; padding: 0 15px; }
					#news-other-headlines li a { font-weight: normal; }



			
			
		.divider { border-bottom: 1px solid #efefef; }
		
		
		.large-indent-list { list-style: none; margin: 20px 0 0 60px; }
			.large-indent-list li { background: url(../img/list-arrow.gif) no-repeat 0px 5px; padding: 0 0 0 17px; line-height: 20px; height: 20px; }
			
		.thumbnails { list-style: none; width: 370px; margin: 0 0 0 25px; }
			.thumbnails li { width: 65px; height: 65px; display: inline; float: left; padding: 2px; margin: 7px 10px; border: 1px solid #656668; background: #FFFFFF; }
				.thumbnails li:hover { border: 1px solid #8a8a8a; background: #d2d2d2; }
				.thumbnails li.last-item { margin: 7px 0px; }
				.thumbnails li img { border: 0px; width: 65px; height: 65px; }
				
		#recent-work { list-style: none; }
			#recent-work li { background: url(../img/list-arrow.gif) no-repeat 0px 8px; padding: 5px 0 5px 17px; border-bottom: 1px solid #d0cfcf; }
			
		#text div.client-navigation { margin: 10px 0 0 0; }
			#text div.client-navigation a { color: #ed3024; }
				#text div.client-navigation span.previous {  }
					#text div.client-navigation span.previous a { background: url(../img/clients-nav-div.gif) no-repeat top right; padding: 0 5px 0 0; }
				#text div.client-navigation span.next {  }
					#text div.client-navigation span.next a { background: url(../img/clients-nav-div.gif) no-repeat top right; padding: 0 5px 0 0;}
				#text div.client-navigation a.view-more { }
				
				
		#text a.news-title { font-family: Arial, Helvetica, sans-serif; font-weight: bold; color: #ed3024; margin: 0; padding: 0; } 
			
			
		#article ul { list-style: none; }
			#article ul li { background: url(../img/list-arrow.gif) no-repeat 0px 8px; padding: 5px 0 5px 17px; line-height: 20px; }

				
	/* News Page */
				
		#news-categories { background: #FFFFFF; width: 203px; border: 1px solid #c4beac; padding: 10px; }
			#news-categories ul { list-style: none; }
				#news-categories ul li { background: url(../img/list-arrow.gif) no-repeat 0px 8px; padding: 5px 0 5px 17px; border-bottom: 1px solid #d0cfcf; }
				#news-categories ul li.rss { background: url(/img/rss-img.gif) no-repeat 0 6px; }
					#news-categories ul li a { color: #000000; font-weight: bold; text-decoration: none; }
						#news-categories ul li a:hover { text-decoration: underline; }
		
		
		.feature-item { width: 400px; background: #f8f8f8; border: 1px solid #d7d7d7; padding: 10px; }
			.feature-item:hover { background: #FFFFFF; }
			.news-date { font-weight: bold; line-height: 20px; font-size: 90%; margin: 0 0 5px 0; }
			
			
	/* Team Page */
		.team-item { width: 400px; height: 90px; background: #f8f8f8; border: 1px solid #d7d7d7; padding: 10px 10px 10px 10px; }
			.team-item:hover { background: #FFFFFF; }
			.team-item p {  }
		.team-list { float: left; border: 3px solid #feffff; margin: 0 10px 0 0; height: 83px; }
		.team-detail { float: right; margin: 0 0 0 10px; border: 5px solid #e0e0e0; }
		
		.center { margin: 0 auto; text-align: center; }
		
		.team-excerpt { font-weight: bold; }
		
		
	/* Services Page */
		.service-item { width: 400px; background: #f8f8f8; border: 1px solid #d7d7d7; padding: 10px 10px 15px 10px; }
			.service-item:hover { background: #FFFFFF; }
			
			
		
	/* Accessibility Page */
		#access ul { margin: 0 0 0 30px; padding-bottom: 15px; }
			#access ul li { margin: 3px 0; }
            
    
    /* Friends Page */
		#friends { margin-top: 0px; padding-top: 0px; }
        #friends ul { margin-left: 25px; margin-top: 0px; padding-top: 0px; }
		#friends p { margin-top: 20px; }
        
		
		
	/* Form */
		#text form div { border: 1px solid #d7d7d7; margin: 20px 0 0 0; }
			#text form div dl { width: 382px; padding: 20px; }
				#text form div dl dt { float: left; line-height: 20px; font-weight: bold; margin: 0; padding: 5px 0; }
				#text form div dl dd { margin: 0; padding: 5px 0 5px 125px; }
					#text form div dl dd input { width: 250px; height: 20px; background: #FFFFFF; border: 1px solid #000000; font-family: Arial, Helvetica, sans-serif; font-size: 100%; }
					#text form div dl dd input:focus { background: #f1eee1; }
					#text form div dl dd textarea { width: 250px; height: 150px; background: #FFFFFF; border: 1px solid #000000; font-family: Arial, Helvetica, sans-serif; font-size: 100%; }
					#text form div dl dd textarea:focus { background: #f1eee1; }
										
					
					#contact { width: 300px; margin: 10px auto; text-align: center; }
						#contact tr td { width: 150px; text-align: left; }
	
					
					#contact-us-form { padding: 0 0 50px 0; }
					.zemSubmit { float: right; margin: 0 20px 0 0; background: #d6d6d6; color: #696767; border: 1px solid #9f9e9e; }
					
					
					
	/* FAQ */
	#faq ul { list-style: none; margin-bottom: 30px; }
	#faq ul li { margin: 0 0 10px 0; }
	#faq #text dt { float: none; font-weight: bold; }
	#faq #text dd { margin: 10px 0 30px 0; }
					
					
	/* Sitemap */
		#sitemap ul { margin: 10px 0 0 30px; list-style: none; }
			#sitemap ul li { background: url(../img/list-arrow.gif) no-repeat 0px 6px; padding: 0 5px 5px 20px; line-height: 20px; }
		#sitemap ul li ul { margin: 0 0 0 20px; list-style: disc; color: #666666; }
			#sitemap ul li ul li { background: transparent; padding: 0; }
				#sitemap ul li ul li a { font-weight: normal; }
			
			
	/* Client Login */
		#text div.ign_login form p { margin: 10px 0 0 0; }
		#text div.ign_login form dl dt { font-weight: bold; float: left; line-height: 20px; margin: 0; padding: 5px 0; }
		#text div.ign_login form dl dd { margin: 0; padding: 5px 0 5px 125px; }
		#text div.ign_login form dl dd input { width: 250px; height: 20px; background: #FFFFFF; border: 1px solid #000000; font-family: Arial, Helvetica, sans-serif; font-size: 100%; }
			#text div.ign_login form dl dd input:focus { background: #f1eee1; }
			
	/* Breadcrumb Trail */
		#text div.breadcrumb-trail { font-size: 83%; color: #666666; position: relative; top: 20px; }
			#text div.breadcrumb-trail a { color: #666666; }
	
	/* Book */
		#book-left { background: url(../img/book-left.jpg) no-repeat; width: 39px; height: 426px; position: absolute; top: 199px; left: 92px; }
		#book-right { background: url(../img/book-right.png) no-repeat; width: 42px; height: 199px; position: absolute; top: 64px; left: 565px; }
		
		#book-bottom-red { background: url(../img/book-bottom-red.jpg) no-repeat; width: 451px; height: 98px; margin: 0 0 0 75px; }
		#book-bottom { background: url(../img/book-bottom.png) no-repeat; width: 610px; height: 149px; position: relative; bottom: 101px; }
		#client-login-button { position: relative; }
		#client-login-button a { background: url(../img/client-login.png) no-repeat; width: 72px; height: 77px; position: absolute; top: 18px; right: 87px;}
			#client-login-button span { display: none; }
			
		#book-bottom ul { width: 365px; list-style: none; margin: 0px 0px 0px 85px; padding: 15px 0 0 0; position: relative; }
		#book-bottom ul li { display: inline; float: left; background: url(../img/bottom-nav-div.gif) no-repeat right 5px; padding: 0px 5px; line-height: 30px; }
		#book-bottom ul li.last-item { background: transparent; }
		#book-bottom ul li a { color: #FFFFFF; text-decoration: none; font-weight: bold; font-size: 70%; }
		#book-bottom ul li a:hover { text-decoration: underline; }
		
		
	/* Phone */
		#phone-left { background: url(../img/phone-left.jpg) no-repeat; width: 71px; height: 199px; position: absolute; top: 64px; left: 607px; }
		#phone-bottom { background: url(../img/phone-bottom.jpg) no-repeat; width: 302px; height: 41px; position: absolute; top: 216px; left: 678px; }
		#phone-right { background: url(../img/phone-right.jpg) no-repeat; width: 74px; height: 153px; position: absolute; top: 64px; left: 906px; }
		
		#no-flash { position: absolute; top: 64px; left: 678px; }
		
	/* Sidebar */
		#sidebar-top { background: url(../img/sidebar-top.jpg) no-repeat; width: 248px; height: 59px; position: absolute; top: 257px; left: 663px; }
			#sidebar-top h2 { position: absolute; top: 38px; left: 20px; font-size: 85% }
		
		#cellotape-top { background: url(../img/cellotape-top.jpg) no-repeat; width: 45px; height: 79px; position: absolute; top: 257px;  left: 911px;}
		#cellotape-bottom { background: url(../img/cellotape-bottom.png) no-repeat; width: 33px; height: 36px; position: relative; bottom: 32px; right: 32px; }
		
		

		#sidebar { position: absolute; top: 316px; left: 663px; font-size: 70%; overflow: visible; width: 330px; }
			#sidebar h2 { font-size: 130% }
		#sidebar-body { background: url(../img/sidebar-bottom-bg.jpg) no-repeat bottom left; background-color: #e2d9bd; width: 227px; padding: 0px 20px; }
		
		.sidebar-item { background: #f1eee1; width: 203px; border: 1px solid #c4beac; padding: 10px; }
		.sidebar-item:hover { background: #FFFFFF; }
		
		.sidebar-item a { color: #000000; font-weight: bold; text-decoration: none; }
			.sidebar-item a:hover { text-decoration: underline; }
			
		.featured-item { background: #FFFFFF; width: 203px; border: 1px solid #c4beac; padding: 10px; font-weight: normal; }
			.featured-item img { width: 125px; }
		
		.sidebar-date { font-weight: normal; }
		
		#sidebar-bottom { background: url(../img/tape-top.png) no-repeat; width: 312px; height: 65px; position: relative; bottom: 36px; right: 15px; display: block; }
		
		#button a { background: url(../img/button.png) no-repeat; width: 87px; height: 93px; position: relative; bottom: 36px; right: 21px; display: block; }
		#button span { display: none; }
		
		#tape-bottom a { background: url(../img/tape-bottom.png) no-repeat; width: 231px; height: 113px; position: relative; bottom: 129px; left: 66px; display: block; }
		#tape-bottom span { display: none; }
		
		
	/* Footer */
		#copyright { color: #FFFFFF; font-weight: bold; margin: 0px 0px 15px 90px; font-size: 70%; position: relative; bottom: 80px; }
			#copyright a { color: #FFFFFF; text-decoration: none; }
			#copyright a:hover { color: #003366; }
			
	/* Spacing */
		.padding10px { padding: 10px 0px; }
		.padding30px { padding: 30px 0px; }
		
		.padding10px0020px { padding: 10px 0 0 20px; }
		
		.padding-top-10px { padding-top: 10px; }
		.padding-top-20px { padding-top: 20px; }
		
		.padding-right-50px { padding-right: 50px; }
		
		
	/* Social Bookmarks */
		#article ul#bookmarks { list-style: none; float: right; }
		#article ul#bookmarks li { font-size: 90%; display: inline; padding: 0px; margin: 0px; }
		#article ul#bookmarks li a { text-decoration: none; color: #000000; }
		#article ul#bookmarks li a:hover { text-decoration: underline; }
		#article li#digg { background: url(../img/digg.gif) no-repeat; width: 16px; height: 14px; }
		#article li#digg a { padding: 0 20px; }
		#article li#delicious {  background: url(../img/delicious.gif) no-repeat; width: 16px; height: 16px; }
		#article li#delicious a { padding: 0 0 0 20px; }