@charset "utf-8";
/* CSS Document */

/* RESET CSS
----------------------------------------------------------------------------*/
body, h1, h2, h3, ul, li, p, a, img, input, textarea, label {
	margin: 0; padding: 0;
	border: 0;
	outline: 0;
	list-style: none;
	
	color: #2f2f2f;
	font-family: inherit;
	font-size: inherit;
	text-decoration: none;
}

/* General CSS
----------------------------------------------------------------------------*/
html, body { 
	/* CSS background bottom fix */
	height: 100%;
}
body {
	background: #ebebeb;
	font-family: Tahoma, Arial, Verdana, sans-serif;
}
.background2 {
	background: #323232;
	width: 50%; height: 50px;
	position: absolute;
	top: 0; left: 50%;
}

.container {
	width: 952px;
	margin: 0 auto -93px;
	overflow: hidden;
	
	/* CSS background bottom fix */
	min-height: 100%;
	height: auto !important;
	height: 100%;
}

/* Form CSS
----------------------------------------------------------------------------*/
form {
	margin: 10px 13px;
}
form div {
	margin: 4px 0;
}
form label {
	width: 73px;
	display: inline-block;
	vertical-align: middle;

	color: #2f2f2f;
	font-size: 12px;
	cursor: pointer;
}
form .textarea label, form .textarea span {
	margin: 5px 0;
	vertical-align: top;
	display: inline-block;
}
form input, form textarea, form select {
	width: 210px; height: 18px;
	padding: 6px 4px;
	border: 1px solid #9d9d9d;
	
	font-size: 12px;
}
form select {
	width: 220px; height: 22px;
	padding: 0;
}
form textarea {
	height: 150px;
}
form div span {
	color: #0f8dc2;
	font-size: 10px;
}
form div span.red { color: #ff0000; }

form div.buttons {
	margin: 10px 0;
	text-align: right;
}
form div.buttons input {
	background: url(../images/submit.jpg) no-repeat;
	width: 62px; height: 28px;
	padding: 0;
	border: 0;
	
	color: #fff;
	cursor: pointer;
}

/* Header CSS
----------------------------------------------------------------------------*/
#header {
	background: #464646;
	width: 100%; height: 50px;
	overflow: hidden;
	position: absolute;
}
#header a.facebook {
	background: url(../images/facebook.png) no-repeat;
	width: 48px; height:48px;
	display: block;
	text-indent: -9999px;
	outline: 0;

	position: absolute;
	top: 1px; right: 80px;
	z-index: 9999;
}
#header a.twitter {
	background: url(../images/twitter.png) no-repeat;
	width: 48px; height: 48px;
	display: block;
	text-indent: -9999px;
	outline: 0;


	position: absolute;
	top: 1px; right: 20px;
	z-index: 9999;
}
	#header #inner {
		width: 755px; height: 50px;
		margin: 0 auto;
		position: relative;
		z-index: 1;
	}
	#header #logo {
		background: url(../images/overlay.jpg) no-repeat right;
		width: 406px; height: 50px;
		float: left;
	}
	#header #navigation {		
		margin: 0 0 0 -5px;
		float: left;
	}
	#header #navigation li {
		margin: 17px 5px 0 6px;
		float: left;
		
		font-size: 12px;
	}
	#header #navigation li.last { margin-right: 0; }
	#header #navigation li a {
		color: #fff;
	}
	#header #navigation li a:hover {
		text-decoration: underline;
	}
	
/* Content Box CSS
----------------------------------------------------------------------------*/
div.contentbox {
	background: url(../images/box_back.jpg) repeat-y;
	width: 953px;
	margin: 11px 0 0;
}
div.contentbox div.top, div.contentbox div.foot {
	background: url(../images/box_top.jpg) no-repeat;
	width: inherit; height: 5px;
}
div.contentbox div.foot {
	background: url(../images/box_foot.jpg) no-repeat;
	clear: both;
}

div.contentbox h2 {
	margin: 10px 0 0 13px;
	color: #464646;
	font-size: 15px;
}
div.contentbox p {
	margin: 15px 13px;
	font-size: 12px;
	line-height: 19px;
}
div.contentbox div.col1, div.contentbox div.col2, div.contentbox div.col3, div.contentbox div.col4 {
	width: 317px;
	float: left;
}
div.contentbox div.col1 {
	background: url(../images/test_line.jpg) no-repeat right center;
}
div.contentbox div.col3 {
	background: url(../images/test_line.jpg) no-repeat left center;
}

div.contentbox div.col4 {
	background: url(../images/test_line.jpg) no-repeat left center;
}

/* Home CSS
----------------------------------------------------------------------------*/
.home div.contentbox p {
	margin: 15px 13px;
	font-size: 12px;
	line-height: 17px;
}

	/* Product - Home CSS
	----------------------------------------------------------------------------*/
	.home .product {
		background: url(../images/productback.jpg) no-repeat;
		width: 952px; height: 360px;
		margin: 70px 0 4px;
	}
	.home .product ul {
		width: 153px;
		float: left;
	}
	.home .product ul li {
		margin: 2px 0 0 1px;
		display: block;
	}
	.home .product ul li.quality { height: 119px; margin-top: 0; }
	.home .product ul li.reliability { height: 111px; }
	.home .product ul li.functionality { height: 126px; }
	.home .product ul li.quality:hover { background:url(../images/quality_hover.jpg) no-repeat; }
	.home .product ul li.reliability:hover { background:url(../images/reliability_hover.jpg) repeat-x; }
	.home .product ul li.functionality:hover { background:url(../images/functionality_hover.jpg) no-repeat; }

	.home .product ul li a {
		width: inherit;	height: inherit;
		text-indent: -999999px;
		display: block;
	}
	.home .product ul li.quality a { background: url(../images/quality.png) no-repeat center; }
	.home .product ul li.reliability a { background: url(../images/reliability.png) no-repeat center; }
	.home .product ul li.functionality a { background: url(../images/functionality.png) no-repeat center; }
	
	.home .product div {
		width: 757px;
		margin: 13px 0 0 21px;
		float: left;
		display: none;
	}
	.home .product div h2 {
		margin: 0 0 10px 10px;
		
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 17px;
	}
	.home .product div p {
		margin: 0 0 16px;
	}
	.home .product .quality { display: block; }
	
	.home .paymentprocessors img {
		margin: 0 0 0 30px;
		vertical-align: middle;
	}
/* Features CSS
----------------------------------------------------------------------------*/
div.features h2 {
	background: #f5f5f5;
	height: 29px;
	margin: 0 0 0 3px; padding: 9px 0 0 60px;
}
div.features ul, div.demo ul {
	margin: 10px 0 10px 20px;
	list-style: none;
}
div.features ul li, div.demo ul li {
	background: url(../images/line.jpg) 0 9px no-repeat;
	padding: 0 0 0 10px;
	line-height: 18px;

	color: #2f2f2f;
	font-size: 12px;
}
div.features h2.installation { background: #f5f5f5 url(../images/features/installation.jpg) 20px center no-repeat; }
div.features h2.administrator { background: #f5f5f5 url(../images/features/administrator.jpg) 20px center no-repeat; }
div.features h2.user { background: #f5f5f5 url(../images/features/user.jpg) 20px center no-repeat; }
div.features h2.advertising { background: #f5f5f5 url(../images/features/advertising.jpg) 20px center no-repeat; }
div.features h2.customization { background: #f5f5f5 url(../images/features/customization.jpg) 20px center no-repeat; }
div.features h2.security { background: #f5f5f5 url(../images/features/security.jpg) 20px center no-repeat; }
div.features h2.support { background: #f5f5f5 url(../images/features/support.jpg) 20px center no-repeat; }
div.features h2.payments { background: #f5f5f5 url(../images/features/payments.jpg) 20px center no-repeat; }
div.features h2.gen4 { background: #f5f5f5 url(../images/features/gen4.jpg) 20px center no-repeat; }

/* FAQ CSS
----------------------------------------------------------------------------*/
div.faq h2 {
	background: #f5f5f5;
	height: 29px;
	margin: 0 0 0 3px; padding: 9px 0 0 60px;
}
div.faq ul, div.demo ul {
	margin: 10px 0 10px 20px;
	list-style: none;
}
div.faq ul li, div.demo ul li {
	background: url(../images/line.jpg) 0 9px no-repeat;
	padding: 0 0 0 10px;
	line-height: 18px;

	color: #2f2f2f;
	font-size: 12px;
}
div.faq h2.q1 { background: #f5f5f5 url(../images/faq/question.jpg) 20px center no-repeat; }
div.faq h2.administrator { background: #f5f5f5 url(../images/faq/question.jpg) 20px center no-repeat; }
div.faq h2.user { background: #f5f5f5 url(../images/faq/question.jpg) 20px center no-repeat; }
div.faq h2.advertising { background: #f5f5f5 url(../images/faq/question.jpg) 20px center no-repeat; }
div.faq h2.customization { background: #f5f5f5 url(../images/faq/question.jpg) 20px center no-repeat; }
div.faq h2.security { background: #f5f5f5 url(../images/faq/question.jpg) 20px center no-repeat; }
div.faq h2.support { background: #f5f5f5 url(../images/faq/question.jpg) 20px center no-repeat; }
div.faq h2.payments { background: #f5f5f5 url(../images/faq/question.jpg) 20px center no-repeat; }
div.faq h2.gen4 { background: #f5f5f5 url(../images/faq/question.jpg) 20px center no-repeat; }

/* Demo CSS
----------------------------------------------------------------------------*/
div.demo div.admin, div.demo div.users {
	width: 476px;
	float: left;
}
div.demo h2 {
	background: #f5f5f5;
	height: 27px;
	margin: 0 0 0 3px; padding: 7px 0 0 60px;
}
/* UL & LI style is at features */

div.demo div a {
	background: url(../images/demo_button.jpg) no-repeat;
	width: 226px; height: 23px;
	padding: 5px 0 0;
	display: block;

	color: #fff;
	font-size: 14px;
	text-align: center;
}

div.demo div.admin h2 {
	background: #f5f5f5 url(../images/admin_icon.jpg) 20px center no-repeat;
}
div.demo div.users h2 {
	background: #f5f5f5 url(../images/users_icon.jpg) 20px center no-repeat;
}
div.demo div.admin a {
	margin: 0 auto 25px;
}
div.demo div.users a {
	margin: 0 auto 25px;
}
div.demo div.bottom {
	margin: 0 20px 10px 0;

	text-align: right;
	font-size: 13px;
}
div.demo div.admin div.bottom {
	margin-top: 120px;
}
div.demo div.users div.bottom {
	margin-top: 119px;
}

/* Contact CSS
----------------------------------------------------------------------------*/
div.contact h2 {
	background: #f5f5f5;
	height: 29px;
	margin: 0 0 0 3px; padding: 9px 0 0 20px;
}
div.contact .form {
	width: 450px;
	float: left;
}

div.contact .right {
	width: 400px;
	margin: 50px 0 0;
	float: left;
}
div.contact .right ul { margin: 0 0 0 50px; }
div.contact .right ul li {
	list-style: disc;

	color: #7d7d7d;
	font-size: 12px;
}
div.contact form div.buttons { text-align: center; }

/* Login CSS
----------------------------------------------------------------------------*/
div.login div.form {float:left;}
div.login div.right { margin: 0px 0 0 460px; }
div.login .right h2 {
	background: none;
}

/* Client CSS
----------------------------------------------------------------------------*/
div.client ul#sidenav {
	width: 236px;
	margin: 13px 0 0 10px; padding: 0;
	float: left;
	z-index: 999;
	position: relative;
}
div.client ul#sidenav li {
	height: 43px;
	margin: 0; padding: 0;
}
div.client ul#sidenav li a {
	width: 183px; height: 31px;
	padding: 12px 0 0 53px;
	display: block;
	
	color: #464646;
	font-size: 14px;
}

div.client ul#sidenav li.active {
	background: url(../images/clients/active.jpg) no-repeat;
}

div.client ul#sidenav li.package a { background: url(../images/clients/packages.png) 9px 5px no-repeat; }
div.client ul#sidenav li.unpaid a { background: url(../images/clients/unpaid_invoices.png) 13px 7px no-repeat; }
div.client ul#sidenav li.paid a { background: url(../images/clients/paid_invoices.png) 13px 7px no-repeat; }
div.client ul#sidenav li.information a { background: url(../images/clients/information.png) 8px 9px no-repeat; }
div.client ul#sidenav li.password a { background: url(../images/clients/password.png) 13px 5px no-repeat; }
div.client ul#sidenav li.announcements a { background: url(../images/clients/announcements.png) 9px 11px no-repeat; }

div.client .inner {
	background: url(../images/clients/client_back.jpg) repeat-y;
	width: 702px; min-height: 400px;
	margin: 6px 0 10px -1px;
	float: left;
	
	position: relative;
}
div.client .inner .top	 {
	background: url(../images/clients/client_top.jpg) no-repeat;
	width: inherit; height: 5px;
}

div.client .inner h2 {
	margin: 5px 0 0 13px;
	color: #01293d;
	font-size: 12px;
}

div.client .inner .clientbox {
	background: url(../images/clients/box_back.jpg) repeat-y;
	width: 664px;
	margin: 10px 0 0 19px;
}
div.client .inner .clientbox .top {
	background: url(../images/clients/box_top.jpg) no-repeat;
	width: inherit; height: 4px;
}

div.client .inner .clientbox h3 {
	margin: 5px 0 0 16px;
	font-size: 14px;
}
div.client .inner .clientbox p {
	margin: 10px 16px;
}

div.client .inner .clientbox .foot {
	background: url(../images/clients/box_foot.jpg) no-repeat;
	width: inherit; height: 3px;
	position: static;
}

div.client .inner .clientbox table {
	width: inherit;
	border-spacing: 0;	

	color: #464646;
}

div.client .inner .clientbox table thead th {
	padding: 5px 0;
	border-bottom: 1px solid #d4d4d4;
	
	font-size: 14px;
}
div.client .inner .clientbox table td { 
	padding: 10px 0;
	
	font-size: 12px;
	text-align: center;
}
div.client .inner .clientbox table td a { color: #464646; }

div.client .inner .foot {
	background: url(../images/clients/client_foot.jpg) no-repeat;
	width: inherit; height: 5px;
	position: absolute;
	bottom: 0;
}

/* Other pages CSS
----------------------------------------------------------------------------*/
.breadcrumb, .container h1 {
	margin: 60px 0 0;

	color: #464646;
	font-size: 15px;
	font-weight: bold;
}
.container h1.invis {
	display: none;
}

.container a {
	color: #0f8dc2;
	font-weight: bold;
}

.breadcrumb a {
	color: #464646;
}
.breadcrumb a:hover {
	text-decoration: underline;
}

/* Why Gen4 CSS
----------------------------------------------------------------------------*/
#leftimg, #rightimg, #adminpanel, #customizability {
	height: 254px;
	margin: 13px 13px 0;
}
#rightimg {
	top: -267px; left: 467px;
	margin-bottom: -267px;
}
	
/* Footer CSS
----------------------------------------------------------------------------*/
div.footer {
	margin: 11px 0 25px;
}

.footer div ul {
	margin: 10px 0 5px 13px;
}
.footer div ul li {
	margin: 0 0 0 16px;
	list-style: disc;
	
	color: #146d91;
	font-size: 16px;
}
.footer div ul li a {
	color: #000;
	font-size: 12px;
	font-weight: bold;
}
.footer div ul li a:hover { text-decoration: underline; }

div.footer div.col1, div.footer div.col2, div.footer div.col3, div.footer div.col4 {
	width: 238px;
}

/* Bottom CSS
----------------------------------------------------------------------------*/
.backfix {
	height: 93px;
}
.copyright {
	background: #dad9d5 url(../images/footer.jpg) repeat-x top;
	width: 100%; height: 93px;
	overflow: hidden;
}

.copyright a img { vertical-align: middle; }

.copyright p {
	width: 952px;
	margin: 28px auto 0;

	color: #858582;
	font-size: 13px;	
	text-align: right;
}
