/* CSS Document */

body,html {
	margin: 10px 0px;
	width: 100%;
	background-color: #575757;
	font-family: arial, verdana, helvetica, sans-serif;
	font-size: 8pt;
	color: #5C5D5B;
	}
	
img {border: 0px;}

#page {
	width: 650px;
	padding: 0px 0px;
	margin: 0px auto;
	background-color: #FFFFFF;	
	}
	
#header {    
	height:	107px;
	width: 650px;
	margin: 0px;
	padding: 0px;
	z-index: 0;	
    }
	
#nav_banner {
    position: relative;
	height:	177px;
	width: 650px;
	padding: 0px;	
}

#footer {
    width: 650px;
	height: 36px;
	margin-top: -11px;
	
}

#nav {
    position: absolute;
    height:	177px;
	width: 200px;
	background-color:#FFFFFF;
	text-align: right;
	margin: 0px;
	top: 0px;
	left:0px;
    }

#navServices {
   margin-left: 12px;
   width: 188px; 
   height: 44px;  
  }
  
#navServices a { display:block; height: 44px; width: 188px; background: url("images/cosmic/navServices.gif") 0 0 no-repeat;	}			 
#navServices a:hover {  background-position: 0 -44px; }  				 
#navServices a:active {  background: url("images/cosmic/navServices.gif") 0 0 no-repeat; }   
  
#navPortfolio {
   padding-left: 12px;
   height: 45px;    
  }
  
#navPortfolio a { display:block; height: 45px; width: 188px; background: url("images/cosmic/navPortfolio.gif") 0 0 no-repeat;	}			 
#navPortfolio a:hover {  background-position: 0 -45px; }  				 
#navPortfolio a:active {  background: url("images/cosmic/navPortfolio.gif") 0 0 no-repeat; } 
 
#navTemplates {
   padding-left: 12px; 
   height: 43px;
   width: 188px;   
  }
  
#navTemplates a { display:block; height: 43px; width: 188px; background: url("images/cosmic/navTemplates.gif") 0 0 no-repeat;	}			 
#navTemplates a:hover {  background-position: 0 -43px; }  				 
#navTemplates a:active {  background: url("images/cosmic/navTemplates.gif") 0 0 no-repeat; }
	
  
#navContact {
   padding-left: 12px;
   height: 45px; 
   width: 188px;   
  }
  
#navContact a { display:block; height: 45px; width: 188px; background: url("images/cosmic/navContact.gif") 0 0 no-repeat;	}			 
#navContact a:hover {  background-position: 0 -45px; }  				 
#navContact a:active {  background: url("images/cosmic/navContact.gif") 0 0 no-repeat; }


#banner {
    position: absolute;
	height:	177px;
	width: 450px;
	top: 0px;
	right: 0px;
    }
	

.orangeText {
  color: #FA9B05;
}

a.orangeLink:link { color: #FA9B05; text-decoration: none; }
a.orangeLink:visited { color: #FA9B05; text-decoration: none; }
a.orangeLink:hover {color: #FA9B05; text-decoration: underline; }

	
#contentContainer {
  width: 650px;  
}

#leftColumn { 
     float: left;     
     width: 200px;	 
	 vertical-align:top;
	 padding: 0px;
	 margin: 0px;	 
}

#rightColumn { 
   float: right;
   width: 450px;  
}

#featuredProject {
   width: 188px;     
   margin-left: 12px;
}

#featuredImage {
 background-image:url(images/cosmic/featuredProject_bg.gif);
 text-align:center;
 margin-top: -3px;
 padding-top: 5px;
 padding-bottom: 5px;
}

#footer {    
    width: 650px;
	height: 36px;
	clear: both;
	margin-top: 5px;
	
}	

#copyright {
     color: #FFFFFF;
	 text-align:center; 
	 background-color: #575757;
	 
}
a.footerLink:link { color: #FFFFFF; text-decoration: underline; }
a.footerLink:visited { color: #FFFFFF; text-decoration: underline; }
a.footerLink:hover {color: #FA9B05; text-decoration: none; }

#testimonials {
    width: 188px;
	margin-top: -3px;
	margin-left: 12px;	
}

#testimonialsContent { 
  margin-top: -3px;  
  padding-left: 10px;
  padding-right: 10px;
  padding-bottom: 5px;
  text-align:left;
  background-image: url(images/cosmic/testimonials_bg.gif);
  background-repeat: repeat-y;
}

#welcome {
  width: 350px;
  margin-left: 30px;
  margin-top: 10px;
}

#recentProjects {
  width: 400px;
  margin-left: 30px;
  margin-top: 25px;
}

.pageHeading {
font-size: 12pt;
font-weight: bold;
   color:#FF9900;
}

input {
  font-size: .85em;
  }
  
   div.formrow span.label {
  float: left;
  width: 165px;
  text-align: right;
  padding-top: 2px;
  }

div.formrow span.element {
  float: right;
  width: 175px;
  text-align: left;
  }
  
div.spacer {
  clear: both;
  }

#portfolio_holder {
 width: 626px;
 margin-left: 12px;
 
}

#portfolio_intro {
 width: 600px;
 margin-left: 12px;
margin-top: 20px;
padding-bottom: 10px;
}

a.grayLink:link { color: #5C5D5B; text-decoration: underline; }
a.grayLink:visited { color: #5C5D5B; text-decoration: underline; }
a.grayLink:hover {color: #5C5D5B; text-decoration: none; }

a.portfolio_breadcrumbs:link { color: #5C5D5B; text-decoration: none; font-size: 12pt; font-weight: bold; }
a.portfolio_breadcrumbs:visited { color: #5C5D5B; text-decoration: none; font-size: 12pt; font-weight: bold; }
a.portfolio_breadcrumbs:hover {color: #5C5D5B; text-decoration: underline; font-size: 12pt; font-weight: bold; }

a.portfolio_breadcrumbs_category:link { color: #FF9900; text-decoration: none; font-size: 12pt; font-weight: bold; }
a.portfolio_breadcrumbs_category:visited { color: #FF9900; text-decoration: none; font-size: 12pt; font-weight: bold; }
a.portfolio_breadcrumbs_category:hover {color: #FF9900; text-decoration: underline; font-size: 12pt; font-weight: bold; }

.projectDescription {
  text-align: left;
  width: 475px;
  
}

.projectDescription_web {
  text-align: left;
  width: 500px;
  
}

#portfolio_details {
 width: 475px;
 margin-left: 75px;
margin-top: 20px;
padding-bottom: 10px;
}

#portfolio_details_web {
 width: 500px;
 margin-left: 50px;
margin-top: 20px;
padding-bottom: 10px;
}

#templatePreview {
width: 500px;
height: 150px;
overflow: scroll;
}