/*CSS Reset*/
@import(css/reset.css);

body { /* This is where you set many of the universal defaults */
	background: #2e2e2e; color: #FFF;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	text-align: center;
}
.clearfix:after { content: "."; display: block; clear: both; margin: 0px; padding: 0px; height: 0; visibility: hidden; }

/*********************************************
		Universal Link Styles
*********************************************/
a {
	color: #ffffff;
	text-decoration: none;
}
a:hover {
	color: #ff6600;
	text-decoration: underline;
}
a:visited {
	color: #ffffff;
}


/*********************************************
		Universal Text Elements
*********************************************/
p, ul, ol, blockquote {
	color: #FFF;
}

blockquote {
	margin: 5px 0px 5px 10px; padding: 0px 0px 0px 10px;
	font-style: italic;
}
img { border: 0px; background: none; }
p {
	padding: 10px 0px;
	margin: 0px;
}
/*********************************************
		Header Styles
*********************************************/
/* Use this for universal styles for all header elements
Be sure to uncomment the styles before using */
h1,h2,h3,h4,h5,h6 {
	font-family: Arial, Helvetica, Sans-Serif;
	font-size: 25px;
	font-weight: normal;
	color: #FFF;
	margin: 0px; padding: 0px;
}

h1 { /* This style is generally used as title on single posts and pages */
	font-size: 20px;
	margin: 0px; padding: 0px;
	text-transform: uppercase;
}
h2 { /* This style used as a sub-header in post/page content */
	font-size: 18px;
	margin: 0px; padding: 0px;
}
h3 { /* This style used as the post titles on homepage/archive */
	clear: both;
	font-size: 16px;
	font-weight: normal;
	margin: 0px; padding: 0px;
	text-transform: uppercase;
}
h3 a {
}
h3 a:hover {
}
h4 { /* This style used as title for comments and as the identifying header on archive page  */
	font-size: 14px;
	margin: 0px; padding: 0px;
	text-transform: uppercase;
}
h5 {
	font-size: 16px;
	margin: 0px; padding: 0px;
}
h6 {
	font-size: 14px;
	margin: 0px; padding: 0px;
}



/*********************************************
		Container Div
*********************************************/
#container 
{
	background: #0d0d0d url(images/container-bg.gif) repeat-y;
	width: 960px;
	margin: 20px auto; 
	padding: 0px;
	text-align: left;
}


/*********************************************
		Header Styles
*********************************************/

#headerLeft 
{
	background: url(images/header_left.gif) no-repeat;
	width: 599px;
	height: 34px;
	float: left;
	margin: 0px; 
	padding-left: 45px;
	padding-top:90px;
	clear: both;
	display:inline;
}

#headerRight 
{
	background: url(images/header_right.gif) no-repeat;
	width: 286px;
	height: 104px;
	float:left;
	text-align: right;
	padding-right: 30px;
	padding-top: 20px;
	
	
	
}

#header-right-button 
{
	background: url(images/requestquote.png) no-repeat; 
	width: 120px; 
	height: 30px; 
	float: right;
	text-align: center;
}


#header a {
	color: #ffffff;
	text-decoration: none;
}
#header a:hover {
	color: #ff6600;
	text-decoration: underline;
}
/*********************************************
		Horizontal Navigaion Styles 
				(with dropdowns)
*********************************************/
#menu 
{
	float:left;
	height: 30px;
	font-size: 14px;
	background: #000;
	width: 954px; 
	margin: 0px; 
	padding: 0px;
	border: 3px solid #FFF;
	border-top: 1px solid #FFF;
	border-bottom: 1px solid #FFF;
	position: relative;
	
	display:inline;
}

/* This is the style for the first UL (horizontal) */
#menu ul 
{
	float: left;
	background: transparent;
	height: 30px; 
	line-height: 30px;
	margin: 0px; 
	padding: 0px;
	
}

/* This is the style for the top level list items */
#menu ul li 
{
	background: none;
	width: auto;
	display: inline;
	float: left;
	list-style-type: none;
	height: 30px; 
	line-height: 30px;
	margin: 0px; 
	padding: 0px;
	border-right: 1px solid #FFF;
}

#menu ul li.home 
{
	background: none;
}
/* The style for all links */
#menu a 
{
	color: #FFF;
	text-decoration: none;
	
}

/* The universal hover state colors and background for all LI items and links */
#menu li:hover,
#menu li:hover a,
#menu li.sfhover,
#menu li.sfhover a,
#menu li a:hover 
{
	background: #FFF url(images/menu-active.gif) repeat-x;
	color: #FFF;
	text-decoration: none;
}
/* This is the style for the top level links, if different than the universal */
#menu ul li a {
	display: block;
	height: 30px; line-height: 30px;
	margin: 0px; padding: 0px 15px;
	text-decoration: none;
	
}
/* if you want to set a "current page item" style, do it here */
#menu ul li.current_page_item a 
{
	background: #FFF url(images/menu-active.gif) repeat-x;
}
/****************************** 
The second-level stuff 
*******************************/
/* This hides the nested UL before you hover */
#menu li ul 
{
	clear: both;
	position: absolute;
	width: 200px; /* the width of the dropdown */
	left: -999em;
}
/* This shows the nested UL when you hover */
#menu li:hover ul, 
#menu li.sfhover ul {
	left: auto;
	display:  block;
	z-index: 1000;
}

/* This is the style for the nested UL */
#menu li:hover ul, #menu li.sfhover ul 
{
	background: transparent;
	display: block;
	border-top: 1px solid #FFF;
	margin: 0px; padding: 0px;
}

/* This is the style for the LI items within the nested UL */
#menu li:hover ul li,
#menu li.sfhover ul li 
{
	background: transparent;
	width: 100%;
	display: block;
	padding: 0px; margin: 0px;
	height: 26px; line-height: 26px;
	overflow: hidden;
	text-align: left;
}

/* This is the style for the links within the LI items within the nested UL */
#menu li:hover ul li a,
#menu li:hover ul li.current_page_item a,
#menu li.sfhover ul li a,
#menu li.sfhover ul li.current_page_item a {
	width: 190px;
	display: block;
	background: #FFF url(images/menu-active.gif) repeat-x;
	margin: 0px; padding: 0px 5px;
	height: 25px; line-height: 25px;
	border: 1px solid #FFF;
	border-top: none;
}
/* This is the style for the hover state on the links within the LI items within the nested UL */
#menu li:hover ul li a:hover, 
#menu li.sfhover ul li a:hover 
{
	background: #000 url(images/menu-active-hover.gif) repeat-x;
	text-decoration: none;
	margin: 0px; padding: 0px 5px;
	height: 25px; line-height: 25px;
}


/*********************************************
		Homepage Styles
*********************************************/
#homefeature {
	width: 954px;
	
	background: #2e2e2e;
	margin: 0px; padding: 0px;
	border-left: 3px solid #FFF;
	border-right: 3px solid #FFF;
}



#homebottom {
	width: 954px;
	background: url(images/homebottom-bg.gif) repeat-y;
	margin: 0px; padding: 0px;
	border-top: 1px solid #FFF;
	border-left: 3px solid #FFF;
	border-right: 3px solid #FFF;
}
#homebottom .widget {
	width: 318px;
	display: inline;
	float: left;
}
#homebottom h4 {
	padding: 10px;
	font-size: 14px;
	font-weight: normal;
	text-align: center;
	border-bottom: 1px solid #FFF;
}
#homebottom .widget img {
	width: 298px;
    height: 130px;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 5px 0px;
	display: inline;
}
#homebottom .widget a {
	color: #7aa2d1;
	text-decoration: none;
}
#homebottom .widget a:hover {
	color: #ff6600;
	text-decoration: underline;
}
#homebottom .widget a:visited {
	color: #7aa2d1;
}
#homebottom .widget p,
#homebottom .widget form,
#homebottom .widget div  {
	padding: 10px;
}
#homebottom .widget ul,
#homebottom .widget ol, {
	padding: 10px 0px; margin: 0px 15px 5px 25px;
	list-style-type: square;
}
#homebottom .widget .textwidget p,
#homebottom .widget .textwidget img,
#homebottom .widget .textwidget form,
#homebottom .widget .textwidget div,
#homebottom .widget .textwidget ul,
#homebottom .widget .textwidget ol {
	margin: 0px; padding: 0px;
}

	
/*********************************************
		Content Div
*********************************************/
#column-left
{
	background-color: #444444;
	border-left: 3px solid #FFF;
	border-right: 1px solid #FFF;
	width: 261px;
	height: 400px;
	float: left;
	margin: 0px; 
	padding-left: 20px;
	padding-top: 20px;
	padding-bottom: 10px;
	clear: both;
	
}

#column-left-about
{
	background-color: #444444;
	background: url(images/Leftside_About.png) no-repeat;
	border-left: 3px solid #FFF;
	border-right: 1px solid #FFF;
	width: 261px;
	height: 400px;
	float: left;
	margin: 0px; 
	padding-left: 20px;
	padding-top: 20px;
	padding-bottom: 10px;
	clear: both;
	
}

#column-left-careers
{
	background-color: #444444;
	background: url(images/Leftside_Careers.png) no-repeat;
	border-left: 3px solid #FFF;
	border-right: 1px solid #FFF;
	width: 261px;
	height: 400px;
	float: left;
	margin: 0px; 
	padding-left: 20px;
	padding-top: 20px;
	padding-bottom: 10px;
	clear: both;
}

#column-left-contact
{
	background-color: #444444;
	background: url(images/Leftside_contact.png) no-repeat;
	border-left: 3px solid #FFF;
	border-right: 1px solid #FFF;
	width: 261px;
	height: 400px;
	float: left;
	margin: 0px; 
	padding-left: 20px;
	padding-top: 20px;
	padding-bottom: 10px;
	clear: both;
}

#column-left-hosting
{
	background-color: #444444;
	background: url(images/Leftside_Hosting.png) no-repeat;
	border-left: 3px solid #FFF;
	border-right: 1px solid #FFF;
	width: 261px;
	height: 400px;
	float: left;
	margin: 0px; 
	padding-left: 20px;
	padding-top: 20px;
	padding-bottom: 10px;
	clear: both;
}

#column-left-webhosting
{
	background-color: #444444;
	background: url(images/Leftside_webhosting.png) no-repeat;
	border-left: 3px solid #FFF;
	border-right: 1px solid #FFF;
	width: 261px;
	height: 400px;
	float: left;
	margin: 0px; 
	padding-left: 20px;
	padding-top: 20px;
	padding-bottom: 10px;
	clear: both;
}

#column-left-email
{
	background-color: #444444;
	background: url(images/Leftside_Email.png) no-repeat;
	border-left: 3px solid #FFF;
	border-right: 1px solid #FFF;
	width: 261px;
	height: 400px;
	float: left;
	margin: 0px; 
	padding-left: 20px;
	padding-top: 20px;
	padding-bottom: 10px;
	clear: both;
}

#column-left-service
{
	background-color: #444444;
	background: url(images/Leftside_service.png) no-repeat;
	border-left: 3px solid #FFF;
	border-right: 1px solid #FFF;
	width: 261px;
	height: 400px;
	float: left;
	margin: 0px; 
	padding-left: 20px;
	padding-top: 20px;
	padding-bottom: 10px;
	clear: both;
}

#column-left-design
{
	background-color: #444444;
	background: url(images/Leftside_design.png) no-repeat;
	border-left: 3px solid #FFF;
	border-right: 1px solid #FFF;
	width: 261px;
	height: 400px;
	float: left;
	margin: 0px; 
	padding-left: 20px;
	padding-top: 20px;
	padding-bottom: 10px;
	clear: both;
}


#column-left-why
{
	background-color: #444444;
	background: url(images/Leftside_why.png) no-repeat;
	border-left: 3px solid #FFF;
	border-right: 1px solid #FFF;
	width: 261px;
	height: 400px;
	float: left;
	margin: 0px; 
	padding-left: 20px;
	padding-top: 20px;
	padding-bottom: 10px;
	clear: both;
}

#column-left-webservices
{
	background-color: #444444;
	background: url(images/Leftside_webservices.png) no-repeat;
	border-left: 3px solid #FFF;
	border-right: 1px solid #FFF;
	width: 261px;
	height: 400px;
	float: left;
	margin: 0px; 
	padding-left: 20px;
	padding-top: 20px;
	padding-bottom: 10px;
	clear: both;
}

#column-left-seo
{
	background-color: #444444;
	background: url(images/Leftside_seo.png) no-repeat;
	border-left: 3px solid #FFF;
	border-right: 1px solid #FFF;
	width: 261px;
	height: 400px;
	float: left;
	margin: 0px; 
	padding-left: 20px;
	padding-top: 20px;
	padding-bottom: 10px;
	clear: both;
}

#column-left-domain
{
	background-color: #444444;
	background: url(images/Leftside_domain.png) no-repeat;
	border-left: 3px solid #FFF;
	border-right: 1px solid #FFF;
	width: 261px;
	height: 400px;
	float: left;
	margin: 0px; 
	padding-left: 20px;
	padding-top: 20px;
	padding-bottom: 10px;
	clear: both;
}

#column-left-pricing
{
	background-color: #444444;
	background: url(images/Leftside_pricing.png) no-repeat;
	border-left: 3px solid #FFF;
	border-right: 1px solid #FFF;
	width: 261px;
	height: 400px;
	float: left;
	margin: 0px; 
	padding-left: 20px;
	padding-top: 20px;
	padding-bottom: 10px;
	clear: both;
}

#content-main
{
		
	padding-left: 30px;
	padding-right: 30px;
	padding-top: 30px;
	padding-bottom: 30px;
	float: left;
	width: 609px;
}

#content-full {
	background: #0d0d0d;
	display: inline;
	width: 914px;
	float: left;
	margin: 0px; padding: 20px;
	border-left: 3px solid #FFF;
	border-right: 3px solid #FFF;
}

#column-left-quote
{
	background-color: #444444;
	background: url(images/Leftside_quote.png) no-repeat;
	border-left: 3px solid #FFF;
	border-right: 1px solid #FFF;
	width: 261px;
	height: 400px;
	float: left;
	margin: 0px; 
	padding-left: 20px;
	padding-top: 20px;
	padding-bottom: 10px;
	clear: both;
}


/*********************************************
		Previous/Next Page Navigation
*********************************************/
.page-nav {
	clear: both; /* To clear any floats */
	margin: 0px; padding: 0px;
}

/*********************************************
		Footer Styles
*********************************************/
#footer {
	clear: both;
	display: block;
	background: url(images/footer-bg.gif) bottom left no-repeat;
	color: #ffffff;
	text-align: left;
	border-top: 1px solid #FFF;
	margin: 0px; padding: 15px 20px 20px 20px;
}
#footer a {
	color: #ffffff;
	text-decoration: none;
}
#footer a:hover {
	color: #ff6600;
	text-decoration: underline;
}