/* COLORS 

Logo Dark Green:   #28ae9a
Logo Light Green:  #87f6e5
Content Green:     #3a5244
Grey Text:         #383737
Links:             #28ae9a
Dark Grey:         #111111

*/


/* GENERAL ****************************************************************************************************** */

	body#home  {  color: #3a5244; margin: 0; padding: 0; font-family: Arial; font-size: 12px; }
	body {background: #232323 url(../img/design/bg.gif) repeat-x; color: #3a5244; margin: 0; padding: 0; font-family: Arial; font-size: 12px; }

	a { color: #28ae9a; }
	a:hover { text-decoration: none;}
	
	#shell { width: 100%;}
	#home #shellInner { background: url(../img/design/bg_header.jpg) top center no-repeat; }
	#shellInner {background: url(../img/design/bg_header_sub.jpg) top center no-repeat;  }
	
	#shellInner2 { width: 964px; margin: 0 auto; }
	
	header, nav, footer { display: block;}
	
	.last { margin: 0; padding: 0;}
	
	hr { background: #ccc; border: none; border-top: 1px; height: 1px; margin: 30px 0;}
	.imgLeft { float: left; margin: 0 5px 5px;}


/* HEADER ******************************************************************************************************* */


	#titlebar { height: 97px; }
	
		#utilityNav { background: #111111; height: 10px; width: 420px; float: right;   }
		#utilityNav a { display: none; padding: 11px 16px 10px 26px;  font-size: 11px; color: #fff; background: url(../img/design/icon_login.gif) 16px 13px no-repeat; text-decoration: none;}
		#utilityNav a:hover { color: #28ae9a; }
	
		#logo { position: absolute; margin: 40px 0 0 0; width: 210px; height: 40px; background: url(../img/design/logo.png);}
		#logo a { display: block; width: 210px; height: 40px;}
		
		nav { }
		nav ul {  width: 100%; height: 40px;   margin: 0; padding: 57px 0 0 0;}
		nav ul li { margin: 0 0 0 30px ; list-style: none; float: right;  }
		nav ul li a { font-size: 15px; letter-spacing: -1px; color: #fff; padding: 5px 0; text-decoration: none; }
		nav ul li a:hover { border: 1px solid #ccc; border-left: none; border-right: none; }
		
		#services nav ul li#nservices a,
		#portfolio nav ul li#nportfolio a,
		#about nav ul li#nabout a,
		#contact nav ul li#ncontact a,
		#home nav ul li#nhome a { border: 1px solid #ccc; border-left: none; border-right: none; }


	#home header {   height: 333px; }
	header { height: 143px; }
	
		#home #intro { position: absolute; margin: 60px 0 0 0; width: 420px; height: 210px;}
		#home #intro h1 { background: url(../img/design/intro_h1.png); height: 91px; width: 416px;}
		#home #intro p { color:#fff; font-size: 13px; line-height: 160%; }
		#home #intro span { position: absolute; margin: 0px 0 0 250px;  width: 186px; height: 37px;}
		#home #intro span a { display: block; background: url(../img/design/btn_letstalk.gif); width: 186px; height: 37px;}
		#home #intro span a:hover { background: url(../img/design/btn_letstalk_hover.gif);}
		
		#intro  {  position: absolute; margin: 10px 0 0 0;}
		#intro h1 { color: #fff; font-weight: normal; font-size: 48px; }
		#home #intro h1 { display: block; margin: 0 ;}

		
		#home #mainpicShadow { display: block; margin: 291px 0 0 415px; position: absolute; z-index: 9999; background:url(../img/design/browser_shadow.png); width: 566px; height: 42px; }
		#home #mainpic {display: block;  margin: 0 0 0 415px; background: url(../img/design/browser.png); width: 566px; height: 332px; }
		#home #mainpic img { position: absolute; margin: 60px 0 0 52px;}
		
		#mainpicShadow,
		#mainpic
		{ display: none; }
		
	
	#home #ctaShell { height: 100px;   }
		#cta1, #cta2, #cta3 { display: none;}
		
		#home #cta1, #home #cta2, #home #cta3 { display: block; margin: 15px 27px 0 0; padding: 15px 22px 0 70px; width: 211px; height: 54px; color: #383737;  text-decoraton: none; float: left; }
		#home #cta1 a, #home #cta2 a, #home #cta3 a { text-decoraton: none;}
		#home a#cta1, #home a#cta2, #home a#cta3 { text-decoration: none;}
		#home #cta1:hover, #home #cta2:hover, #home #cta3:hover {  }
		#home #cta1 h1, #home #cta2 h1, #home #cta3 h1 { color: #383737; font-size: 16px; margin: 0; padding: 0;}
		#home #cta1 span, #home #cta2 span, #home #cta3 span { color: #383737; text-decoraton: underline; }

		
		#home #cta1 { background: url(../img/design/icon_cta1.png) 0 8px no-repeat;}
		#home #cta1:hover { background: #a4b8ac url(../img/design/icon_cta1.png) 0 8px  no-repeat;}

		#home #cta2 { background: url(../img/design/icon_cta2.png) 0 8px no-repeat;}
		#home #cta2:hover { background: #a4b8ac url(../img/design/icon_cta2.png) 0 8px  no-repeat;}

		#home #cta3 { background: url(../img/design/icon_cta3.png) 0 8px no-repeat;}
		#home #cta3:hover { background: #a4b8ac url(../img/design/icon_cta3.png) 0 8px  no-repeat;}

		#home #cta3 { border: none;  margin-right: 0;}


/* BODY ********************************************************************************************************* */

	#home #contentShell {  background: #fff; height:20px; border: none; }
	#contentShell {  background: #fff;  border-top: 10px solid #b0c6b9; }
	
	#contentInner { width: 964px; margin: 0 auto;  padding: 20px 0;}

	#contentShell h2 { font-size: 26px; font-weight: normal;}
	#contentShell h3 { font-size: 18px; color: #28ae9a; }
	#contentShell p { color: #727272; line-height:180%;}

	/* Portfolio ********************************************************************************************************* */

		ul#portfolio_list { margin: 0; padding: 0; }
		ul#portfolio_list li { background: url(../img/design/bg_portoflio_link.jpg) 0 97px no-repeat ; float: left; margin: 0 20px 80px 0; list-style: none; text-align: center; width: 300px; }
		ul#portfolio_list li img { display: block; background: #232323; width: 300px; height: 95px; margin: 0 0 10px 0; }
		ul#portfolio_list li span { display: block; color:#333333; font-weight: bold; font-size: 13px; margin: 0 0 10px 0; }
		ul#portfolio_list li a { margin: 0 10px;}
		ul#portfolio_list li a:hover {}

	/* Services ********************************************************************************************************* */

		div.service {  background: url(../img/design/bg_service.jpg) bottom no-repeat; margin: 0 35px 25px 0; padding: 0; width: 286px; height: 255px; float: left; }
		#service_web h3 { height: 72px; width: 200px; margin-bottom: 27px; background: url(../img/services/head_service_webdesign.jpg);}
		#service_teacher h3 { height: 72px; width: 243px; margin: 14px 0 30px 0; background: url(../img/services/head_service_teacher.jpg);}
		#service_branding h3 { height: 72px; width: 243px; margin: 18px 0 26px 0; background: url(../img/services/head_service_brand.jpg);}
		div.service .last { margin: 0; padding: 0;}
		#contentShell div.service p { color: #000; height: 85px; padding: 0 25px; font-size: 11px; }
		div.service .btn a { background: #1ab29b; color: #fff; margin: 0 25px; padding: 4px 8px; text-decoration: none;}
		div.service .btn a:hover { background: #111111; }

	/* About ********************************************************************************************************* */
	
		#about_left { width: 550px; margin: 0 50px 0 0; float: left;}
	
		#tidbits { width: 322px; float: left;  }

			#who, #when, #where { padding: 35px 0 15px 60px; width: 322px; height: 23px; border-bottom: 1px solid #ccc; margin: 0 0 15px 0;}
			#who { background:url(../img/about/about_who.jpg) no-repeat;}
			#when { background:url(../img/about/about_when.jpg) no-repeat;}
			#where { background:url(../img/about/about_where.jpg) no-repeat;}
			
		#about span#sig{ position: absolute; margin: -30px 0 0 330px;}


	/* Contact Us ********************************************************************************************************* */
		
		iframe { margin: 0 0 0 -20px; border-left: 1px solid #ccc; margin: 0 0 0 300px; }
		body#public h1#logo { display: none;}
		body#public { background: #fff;}
		body#public #container { border: none; width: 450px; margin: 0; padding: 0;}
		body#public element.style { display: none;}
		body#public .info { display: none;}
		body#public #Field6 { width: 200px;}
		body#public li a { display: none;}
		element.style { display: none; }
		.noI form li, .altInstruct form li { margin:0 0 2px 0; padding:5px 10px; width:98% !important; }
		
		#contact span#map { position: absolute; margin: -40px 0 0 350px; margin: 0 0 0 70px;}

/* FOOTER ******************************************************************************************************* */

	footer {  background: url(../img/design/bg_footer.jpg) top center no-repeat; border-top: 3px solid #28ae9a; height: 200px; }
	
		#footerInner {  width: 964px; padding: 0px 0;  margin: 0 auto;} 
		
			#copyright {  float: right; text-align: right; width: 464px; padding: 0px 0;  margin: 20px 0 0 0; color:#848484; font-size: 11px;}
		
			footer nav { float: left;  width: 464px; padding: 20px 0;   }
			footer nav ul { float: left; margin: 0; padding: 0; }
			footer nav ul li { float: none; display: inline; margin: 0 11px 0 0;}
			footer nav ul li a { color: #848484; font-size: 11px; letter-spacing: normal; }
			footer nav ul li a:hover { color: #28ae9a; border: none; text-decoration: underline;}
	
			#socialMenu {}






