* {padding: 0; margin: 0; }

*, ul, li, p, img, div { behavior: url(png-fix/iepngfix.htc) }

body {
	background: #2C403F url(../images/bg_body.jpg) 0 0 repeat-x; 
	font: normal 75%/1em arial, helvetica, sans-serif;	
	line-height: 1.5em;
	}
body p, body ul {
	 font-size: 1.1em;
	 color: #fff;
	 margin-bottom:.5em;
	 }

body a {
	 color: #AFE57C; }
body a:hover {
     color:white; }

#mainContainer {
	width:1000px;
	margin:0 auto;
	min-height:800px;
	}
#header {
	height:100px;
	 }	
h1 {
   display:block;
   background: url(../images/logo.gif) 0 15px no-repeat;
   height:75px;
   width:223px;
   padding-top:15px; }

h2 {
   color:#9FBDBD;
   font-size: 1.4em;
   padding-bottom: 10px;
   background:url('../images/underline.jpg') bottom no-repeat;
   font-weight:normal;
   margin-bottom:1em; }
h3 {color:#AFE57C;font-size: 1.1em;margin-bottom:.5em; }
h4 {color:#87A9A8;font-size: 1.1em; }
.auralOnly {
		   position:absolute;
		   margin-left:-1000em;
		   overflow:hidden;
		   }
.clearfix {
          height:0px;
          display:block;
          clear:both;
          margin-bottom:1em; }
.bullets {
         margin-left:2em;
          }   
#navigation {
			height:30px;
			width:1000px;
			background: url(../images/bg_nav.gif) 0 0 no-repeat; }
			
#navigation ul li {
			list-style-type: none;
			background: url('../images/bg_nav_li.jpg') bottom right no-repeat;
			float:left;
			padding:0 1em;
			margin:2px 0 0 0; }

#navigation ul li a { 
			float:left; }

#navigation #home { display:block;width:38px; height:24px;}
#navigation #about { display:block;width:43px; height:24px;}
#navigation #work { display:block;width:39px; height:24px;}
#navigation #testimonial { display:block; width:82px; height:24px;}
#navigation #contact { display:block; width:60px; height:24px;}
#navigation #knowledge { display:block; width:106px; height:24px;}
#navigation #packages { display:block; width:62px; height:24px;}
#navigation #blog { display:block; width:34px; height:24px;}
#navigation #support { display:block; width:54px; height:24px;}

#navigation #home a { display:block; background:url('../images/nav_home.gif') 0 6px no-repeat; width:38px; height:22px;}
#navigation #about a { display:block; background:url('../images/nav_about.gif') 0 6px no-repeat; width:43px; height:22px;}
#navigation #work a { display:block; background:url('../images/nav_work.gif') 0 6px no-repeat; width:39px; height:22px;}
#navigation #testimonial a { display:block; background:url('../images/nav_testimonial.gif') 0 6px no-repeat; width:82px; height:22px;}
#navigation #contact a { display:block; background:url('../images/nav_contact.gif') 0 6px no-repeat; width:60px; height:22px;}
#navigation #knowledge a { display:block; background:url('../images/nav_knowledge.gif') 0 6px no-repeat; width:106px; height:22px;}
#navigation #packages a { display:block; background:url('../images/nav_packages.gif') 0 6px no-repeat; width:62px; height:22px;}
#navigation #blog a { display:block; background:url('../images/nav_blog.gif') 0 6px no-repeat; width:34px; height:22px;}
#navigation #support a { display:block; background:url('../images/nav_support.gif') 0 6px no-repeat; width:54px; height:22px;}

#navigation a:hover { background-position: 0 -18px!important; } 

#mainBox {
	width:668px;
    float:left;
	min-height:200px;
	position:relative;
	background: url(../images/bg_mainBox_center.png) 0 0 repeat-y;
	margin-top:205px;}
	
#mainBox .detailTop {
	background: url(../images/bg_mainBox_top.png) 0 0 no-repeat;
	height:185px;
	width:668px;
	position:absolute;
	top:-185px;
	left:0;
    z-index:-1;
	}
#mainBox .detailBot {
	background: url(../images/bg_mainBox_bottom.png) 0 0 no-repeat;
	height:15px;
	width:668px;
	position:absolute;
	bottom:-15px;
	left:0;
	}
    
#rightCol {
          float:left;
          background:url(../images/bg_rightCol.png)0 187px repeat-y;
          margin-top: 207px;
          margin-left:10px;
          min-height:50px;
          position:relative;
          width:318px; }
          
         #rightCol .detailTop {
                   background: url(../images/bg_rightCol_top.png) 0 0 no-repeat;
	               height:187px;
	               width:318px;
	               position:absolute;
	               top:-187px;
                   z-index:-1;
                   }
         #rightCol .detailBot {
	            background: url(../images/bg_rightCol_bot.png) 0 0 no-repeat;
	            height:15px;
	            width:318px;
	            position:absolute;
	            bottom:-15px;
	            left:0;
	            }
	
.contentContainer {
				  /*position:absolute;*/
				  margin-top:-185px;
				  z-index:999;
				  left:0;
				  padding:30px 25px; }	
	
	#mainImage {
	background: url(../images/mainImage.jpg) center repeat-x;
	position:absolute;
	top:410px;
	display:block;
	height:550px;
	width:100%;
	z-index:-1;
	}
	#moon {
	width:256px;
	height:258px;
	background: url(../images/moon.png) 0 0 no-repeat;
	position:absolute;
	top:10px;
	right:300px;
	}
	#turtle {
	width:369px;
	height:194px;
	background: url(../images/turtle.jpg) 0 0 no-repeat;
	position:absolute;
	top: 303px;
	left:300px; }
    
#template_wd {
             display:block;
             height:160px;
             width:290px; 
             float:left;
             margin-top:1em;
             background: url(../images/work/template_thumb.jpg)0 20px no-repeat;}
#bespoke_wd {
             display:block;
             height:160px;
             width:290px; 
             float:left;
             margin-top:1em;
             margin-left:10px;
             background: url(../images/work/bespoke_thumb.jpg)0 20px no-repeat;}
             #template_wd:hover, #bespoke_wd:hover { color:white; }
#thumb li {
      display:inline;
      display:block;
      height:160px;
      float:left;
      width:280px;
      padding-left:20px;  }

#screenshot {
	margin: 0;
	padding: 8px;
	position: absolute;
	border: 1px solid #264F51;
	background: #1B292A;
	display: none;
	z-index: 99999;
}