

@import "reset.css"; /* Imports the reset.css */

body { 
	background: url(../images/bg.png) repeat-x #656565; /* This is the topbar and header background */
	font-family: Arial,Helvetica Neue,Helvetica;
	font-size:12px;
	color:#666666;
}

	/* Text */
		p { margin-bottom: 0.6em; line-height: 17px;}
		a { color: #444343; font-weight: bold; text-decoration: none; } /* Links */
		a:hover { text-decoration: underline; }
		
		/* Headings */
		h2 {
			font: 28px Arial, Helvetica, sans-serif;
			color: #12b881;
			letter-spacing: -1px;
			border-bottom: 1px dotted #b7b7b7;
		}
		h3 {
			font: 28px Arial, Helvetica, sans-serif; 
			font-size: 22px;
			color: #444343;
			letter-spacing: -1px;
			border-bottom: 1px dotted #b7b7b7;
		}
		h4 { font-size: 18px; margin: 10px 0 25px; color:#000;}
	    h5 { font-size: 16px; margin: 10px 0 5px;}
	    h4.case-study { font-size: 18px; margin: 10px 0 5px; color:#000; font-weight: bold;}
	    h6 { font-size: 16px; margin: 15px 0 5px; font-family:Georgia, "Times New Roman", Times, serif; font-style:italic; color:#12B881;}
		h7 {font: 16px Arial, Helvetica, sans-serif;color: #12b881; letter-spacing: -1px;}
#container{ 
	width: 982px; 
	margin: 0 auto -31px;
	padding:0;
	} /* -31px is the height of the footer and push */
	
#wrapper{ 
	width: 982px; 
	margin: 0 auto -31px;
	padding:0 20px 0 25px;
	background:url(../images/white-panel-bg.png) repeat-y;
	} /* -31px is the height of the footer and push */



#footer { height: 31px; } /* The push and footer height must be the same */
#push { height: 1px;  margin-top: 10px; }


/* Topbar */
#topbar {
	color: #fff;
	font-weight: bold;
	height: 35px;
	line-height: 35px; /* Vertical centers the text */
	overflow: hidden;
}
#topbar p { margin: 0; 	line-height: 35px;} /* Remove margin-bottom: 0.6em; from p elements inside #topbar */
.top-content { width: 950px; }
#topbar p.twitter a{ 
	background: url(../images/twitter.png) no-repeat right; /* The Twitter Bird */ 
	color: #fff;
	padding: 10px 36px 10px 0;
}
#topbar p.email-us { margin-right: 20px;}
#topbar p.email-us a { color: #dde78c; } /* Mail text color */

	/* Search form */
	#searchform { float: right; margin-top: 4px; width: 220px;}
	#searchform input.searchfield, #searchform #searchsubmit { border: none; float: left; width: auto;}
	/*  The input field */
	#searchform input.searchfield {
		background: url(../images/search_input.png) no-repeat;
		padding: 5px 0 0 8px;
		height: 21px; /* Will be 26px with padding */
		width: 161px; /* Will be 169px with padding */
	}
	/* Search button */
	#searchform #searchsubmit { 
		background: url(../images/search_submit.png) no-repeat; 
		margin-left: 8px;
		height: 28px;
		width: 43px;
		text-indent: -9999px; /* Push the text away */
	}

/* Header */

#header {
	height: 160px;
	position: relative;
	border-bottom:1px #CCCCCC dotted;
}
#header #logo { float: left; margin-top: 0; width: auto;}
#header #logo h1 a{ 
	background: transparent url(../images/logo.png) no-repeat; 
	color: #343434; /* Color of the text if you remove the logo */
	display: block; 
	font: 48px Georgia, Arial, Times, serif; 
	height: 106px; /* Height of logo.png */
	width: 991px; /* Width of logo.png */
	text-indent: -9999px; /* Push the text away */
}
/*#header #logo p.tagline{ 
	font: 14px Georgia, Arial, Times, serif;
	float: right;
	margin: -7px 0 0;
	width: auto;
}*/

#header #logo2 {height: 106px; width: 991px; }
#header #logo2 .colL{ float:left; width:185px; height: 100px;
	background: transparent url(../images/logo2.png) no-repeat; 
}
#header #logo2 .colR{ float: right; width:789px;  height: 100px;
	background: transparent url(../images/logo-rightcol.png) no-repeat;
	text-align:right;
}
#header #logo2 .colR .tagline{ 
	font: 10px Arial; color:#FFF;
	margin:84px 30px 0 0; width:285px; float:right;
}
#header #logo2 .colL a{ 
	display: block; 
	height: 80px; /* Height of logo.png */
	width: 185px; /* Width of logo.png */
	text-indent: -9999px; /* Push the text away */
}
#header #logo2 .colL h1{ 
	color: #343434;
	font-size: 11px; 
	font-family: Arial; 
	font-weight:bold;
	margin:2px 0 0 5px; padding:0;
}

/* Breadcrumb */
#breadcrumb {float:left; color: #999; font-size: 11px; font-family: Arial; width: 982px; margin:10px 0;}
#breadcrumb a { color: #999; text-decoration:none; font-weight:normal;}
#breadcrumb a:hover { color: #999; text-decoration:underline;}


/* Navigation */
ul#nav { 
	position: absolute;
	bottom: 0; right: 0;
	z-index:+1;
}
ul#nav li { 
	background: url(../images/menu_li.png) repeat-x;
	border: 1px solid #bcbcbc;
	border-bottom: none; 
	font-size: 12px;
	float: left; 
	height: 28px;
	line-height: 28px;
	padding: 0 25px;
	margin: 0 3px 0 0;
	width: auto;
	position: relative;
	text-shadow: #000 0 1px 0;
	
	
}
ul#nav li.last { margin-right: 0; } /* The last navigation li have the class "last" */
ul#nav li a { color: #fff; } /* Color of the navigation text */

	/* Active page */
	ul#nav li.active {
		background: url(../images/menu_li_active.png) repeat-x;
		border: 1px solid #fff;
		border-bottom: none;
		text-shadow: none;
	}
	ul#nav li.active a{ color: #363636;}
	
	/* 2. level */
	ul#nav li ul{ 
		visibility: hidden;
		background: #444343 url(../images/menu_li.png) repeat-x bottom;
		position: absolute; 
		top: 27px; 
		left: 0; 
		z-index:+5;
		width:200px;
		
	}
	ul#nav li ul li{
		background: none;
		border: none;
		border-top: 1px solid #858484;
		margin: 0 0px -1px 0;
		float: none; 
	}
	ul#nav li.active ul li{ border: none;}
	ul#nav li.active ul li a{ color: #fff;}



/* Top section */
#top-section { margin-top: 55px; float: left; padding-bottom: 25px;}
#top-section .top-image { float: left; width: 590px; height:275px; }
/*#top-section img { border: 3px solid #343434; } /* The image border */
#top-section .top-info{ float: left; margin-left: 40px; height: 200px; width: 310px; position: relative;}
#top-section h2 { margin-bottom: 15px; }

	/* Read more button */
	a.readmore { position: absolute; bottom: 0; left: 0; }

/* Main */
#main {
	float: left;
	margin-top: 0;
	width: 600px; 
}
#main p { text-align:left; }
#main img.alignleft, #main img.alignright { border: 1px solid #dedede; padding: 4px; }
#main a:hover img.alignleft, #main a:hover img.alignright { border: 1px solid #8A8A8A;}
	/* Main headings */
	#main h2 { margin-bottom: 15px; margin-top:20px; }
	#main h3 { margin: 20px 0 10px; }
	#main h4.btn { float: left; padding: 5px 20px; }
	#main h7 { margin-bottom: 15px; margin-top:20px; }
	
	/* Main lists */
	#main ul, #main ol { font-size: 12px; margin: 5px 0 5px 10px;}
	#main ul li, #main ol li { list-style: inside; line-height: 20px; border-bottom: 1px dotted #dedede;  } 
	#main ul li{ list-style: url(../images/list_bullet.png);}
	#main ol li{  list-style: decimal; }
	

/* Services */
	
h3.services { margin-top: 20px; }
#main ul.services { margin: 10px 0 0 5px; width: 450px;}
#main ul.services li{ color: #595959; margin-bottom: 30px;  line-height: 20px; border-bottom: none; list-style: none;  }
#main ul.services li:hover{ color: #101010; }
#main ul.services li strong{ color: #101010; }
#main li.service1, li.service2, li.service3, li.service4, li.service5 {  padding: 7px 0 0 40px; }

#main ul.services li.service1 {
	background: url(../images/service-icons/money.png) no-repeat left center; 
}
#main ul.services li.service2 {
	background: url(../images/service-icons/web.png) no-repeat left center; 
}
#main ul.services li.service3 {
	background: url(../images/service-icons/users.png) no-repeat left center; 
}
#main ul.services li.service4 {
	background: url(../images/service-icons/clock.png) no-repeat left center; 
}
#main ul.services li.service5 {
	background: url(../images/service-icons/favorite.png) no-repeat left center; 
}

	/* Gallery */
	
	div.gallery { overflow: hidden; }
	div.gallery img { margin: 0 5px 5px 0; }
	div.gallery-nav{  font: 14px Arial, Helvetica, sans-serif;  margin: 25px 8px 15px 0;} /* The gallery navigation */
	div.gallery-nav a {font-weight:bold; color:#000; }
	div.gallery-nav2{  font: 14px Arial, Helvetica, sans-serif;  margin: 0px 8px 15px 0;} /* The gallery navigation */
	div.gallery-nav2 a {font-weight:bold; color:#000; }
	
		/* The Gallery Slider */

 		/* These 2 lines specify style applied while slider is loading */
		.csw {width: 540px; height: 465px; }
		.csw .loading {margin: 200px 0 300px 0; text-align: center; }
 
		.stripViewer { /* This is the viewing window */
			position: relative;
			overflow: hidden; 
			width: 540px; /* Also specified in  .stripViewer .panelContainer .panel  below */
			height: 465px;
			clear: both;
		}
		
		.stripViewer .panelContainer { /* This is the big long container used to house your end-to-end divs. Width is calculated and specified by the JS  */			position: relative;
			left: 0; top: 0;
			width: 100%;
		}
		
		.stripViewer .panelContainer .panel { /* Each panel is arranged end-to-end */
			float:left;
			height: 100%;
			position: relative;
			width: 540px; /* Also specified in  .stripViewer  above */
			
			
		}

		.stripViewer .panelContainer .longpanel { /* Each panel is arranged end-to-end */
			float:left;
			height: 100%;
			position: relative;
			width: 650px; /* Also specified in  .stripViewer  above */
		}
		
		.stripNav { /* Removes the tab menu */
			display: none;
		}
	
div.enquiry-nav { font-size:14px; margin:-50px 0 0 0; text-align:right; }
div.enquiry-nav a {color:#12B881; text-decoration:none;}
div.enquiry-nav a:hover {color:#000; text-decoration:underline;}

	/* Video / Media */
	
	div.video { float:left; margin-bottom:20px; font: 12px Arial, Helvetica, sans-serif; }
	div.video img { border: 2px solid #DEDEDE; }
	div.video .videocolL { float:left; width: 126px; }
	div.video .videocolR { float:right; text-align:left; margin-top:0; margin-left:10px; padding-top:0; width: 460px; }
	div.video h5 {margin-top:0; padding-top:0; color:#000000;}
	div.video h5 a {color:#000000; text-decoration:none; font-weight:normal;}
	div.video h5 a:hover {color:#000000; text-decoration:underline;}
	div.videoseparator { float:left; width: 600px; margin-bottom:20px; border-bottom:1px solid #CCC; }


/* Sidebar */

#sidebar {
	border-left: 1px solid #dedede;
	float: right;
	margin-top: 55px;
	width: 280px; /* 300px with padding */ 
	padding: 10px 22px 15px 20px; /* I add some padding so there's a little space between the top and bottom of the left border and text */
}
#sidebar h3 { border-bottom: none; margin-bottom: 12px; }
#sidebar .box { margin-bottom: 35px; border-bottom: 1px dotted #dedede; padding-bottom: 17px;}
#sidebar .box2 { float:left;  margin-bottom: 25px; padding-bottom:25px; border-bottom: 1px dotted #dedede; }
#sidebar .box2borderless { margin-bottom: 25px; padding-bottom:25px; border-bottom: 0px; }

#sidebar .box2 .colL { float:left; width:120px;}
#sidebar .box2 .colR { float:right; text-align:left; width:140px;}

#sidebar p { line-height: normal; padding-right:10px;}
#sidebar ul li {
	margin-left: 20px;
	margin-bottom:7px;
	line-height: 14px;
	padding-right:10px;
	font-size:12px;
	list-style-image:url(../images/arrow-bullet.gif);
}
#sidebar a { font-weight:normal; }
.sidbar-ad{
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size:16px;
	color:#999999;
	font-style:italic;
}

#sidebar img.alignleft { margin-right: 5px; }
#sidebar img.alignright { margin-left: 5px; }

/* landing page */
#container2{ 
	margin: 0 auto;/* -31px is the height of the footer and push */
	padding:0;
	background-image: url(../images/summer_offer.jpg); 
	width: 982px;
	background-repeat: no-repeat;
	float:left; font: 12px Verdana, Arial, Helvetica, sans-serif;
	} 
#main2 { float: left; margin-top: 390px;width: 560px; }
#sidebar2 { border-left: 1px dotted #dedede; float: right;	margin-top: 10px;	width: 350px; /* 300px with padding */ 	padding: 10px 22px 15px 20px; /* I add some padding so there's a little space between the top and bottom of the left border and text */ }
#sidebar2 h3 { border-bottom: none; font-size: 22px;  color: #333333; font-family: Verdana, Arial, Helvetica, sans-serif; letter-spacing: -1px; margin:0; padding:0; font-weight:normal; }
#sidebar2 .box { margin-bottom: 35px; border-bottom: 1px dotted #dedede; padding-bottom: 17px;}
#sidebar2 .box2 { float:left;  margin-bottom: 25px; padding-bottom:25px; }
#sidebar2 form#contactform { margin-top: 25px; font-family: Verdana, Arial, Helvetica, sans-serif; }
#sidebar2 form#contactform p{ margin-bottom: 4px; margin-top:0; line-height:11px;}
#sidebar2 form label { color:#333333; font-weight: normal;}
#sidebar2 form input[type=text] { /* Text input fields */	border: 1px solid #d3d3d3;	padding: 4px 72px 4px 5px; }
#sidebar2 form input[type=text]:focus, form input[type=text]:hover, form textarea:focus, form textarea:hover{ border: 1px solid #B2B2B2; }
#sidebar2 form label.error { /* Error */	background: none;	border: none;	font-weight: normal; }
#sidebar2 form input[type=text].error, form textarea.error { border: 1px solid #C00; 	padding: 4px 64px 4px 5px;	font-family: Verdana, Arial, Helvetica, sans-serif; }
#sidebar2 form textarea {	border: 1px solid #d3d3d3;	font: 12px Verdana, Arial, Helvetica, sans-serif;	padding: 4px 5px;	margin-bottom: 12px;	width: 338px; /* Will be 380px with padding and border */	overflow: auto;	-moz-box-sizing: border-box;   	-webkit-box-sizing: border-box;   	-ms-box-sizing: border-box;   	box-sizing: border-box;   }
#sidebar2 form input.btn { /* The submit button */ border: 1px solid #89933d; 	padding: 4px 12px;	margin-bottom: 10px; }
#sidebar2 .box2 #slideshow a {font: 12px Verdana, Arial, Helvetica, sans-serif;}

#container2 a { color: #000000; text-decoration: none; font-weight: normal; }
#container2 a:hover { color: #444343; text-decoration: none; font-weight: normal; }
#container2 a.cross-link { color: #000000; font-weight: bold; padding: 0 10px; text-decoration: none; }
#container2 a.cross-link:hover { color: #444343; text-decoration: none; font-weight: bold; }
#container2 a.green-link { color: #009966; font-weight: bold; text-decoration: none; }
#container2 a.green-link:hover { color: #444343; text-decoration: none; font-weight: bold; }
#container2 .box2 { }
#container2 #navi {    float: left;    position: relative;    width: 100%;}
#container2 ul#navigation li {	list-style:none;	float: left; 	margin-right: 10px}
#container2 ul#navigation li a:link { border: 0px solid #000; 	display: block; 	width: 8px; 	height: 8px;	line-height: 8px;	color: black; 	 
	text-align: center; 	text-decoration: none}
#container2 ul#navigation li a:visited {	border: 0px solid #000; 	display: block; 	width: 8px; 	height: 8px;	line-height: 8px;	color: black; 	 
	text-align: center; 	text-decoration: none }
#container2 ul#navigation li a:active { border: 0px solid #000; 	display: block; 	width: 8px; 	height: 8px;	line-height: 8px;	color: black; 	 	text-align: center; 	text-decoration: none	background-color: white;  }
#container2 #main2 p { line-height:20px; }
#container2 p.green-link { color: #009966; font-weight: bold;  font-size:16px; text-align:left;}
#sidebar2 h3.small { border-bottom: none; font-size: 18px;  color: #333333; font-family: Verdana, Arial, Helvetica, sans-serif; letter-spacing: -1px; margin:0; padding:0; font-weight:normal; }



/* Ads area */
.ads-area { margin-top: 30px; }
.ads-area img.alignleft{ margin: 0 5px 5px 0;}
	
/* Footer */
#footer {
	background: url(../images/footer_bg.png) repeat-x;
	color: #777;
	font-size: 11px;
} 
#footer-inner { width: 940px; margin: 0 auto; }
#footer p { margin: 0; line-height: 31px; /* Height of footer (look on about line 37) */}
#footer a { color: #777;font-weight: normal; }
#footer a:hover { color: #2dcb96; text-decoration: none;}

#footer2 {
	background: #FFF; width: 940px; height:50px;
	color: #777;
	font-size: 11px;
} 
#footer-inner2 {  width: 900px; margin: 0 0 0 20px;font-weight:normal; }
#footer2 a { color: #777;font-weight: normal; }

/* Form elements and contactform */
form#contactform { margin-top: 25px; }
form#contactform p{ margin-bottom: 4px; }
form label {
	color:#333333;
	font-weight: bold;
}
form label.formlabel {width:130px; float:left;}
form input[type=text] { /* Text input fields */
	border: 1px solid #d3d3d3;
	padding: 4px 72px 4px 5px;
	margin-bottom: 12px;
}
form input[type=text]:focus, form input[type=text]:hover, form textarea:focus, form textarea:hover{
	border: 1px solid #B2B2B2;
}
form label.error { /* Error */
	background: none;
	border: none;
	font-weight: normal;
}
form input[type=text].error, form textarea.error {
	border: 1px solid #C00;
	/*padding: 4px 64px 4px 5px;*/
	padding: 4px 4px 4px 5px;
	font-family: Arial, Helvetica, sans-serif;
}
form textarea {
	border: 1px solid #d3d3d3;
	font: 12px Arial, Helvetica, sans-serif;
	padding: 4px 5px;
	margin-bottom: 12px;
	width: 268px; /* Will be 380px with padding and border */
	overflow: auto;
	-moz-box-sizing: border-box;   
	-webkit-box-sizing: border-box;   
	-ms-box-sizing: border-box;   
	box-sizing: border-box;   
}

form input.btn { /* The submit button */
	border: 1px solid #89933d; 
	padding: 4px 12px;
	margin-bottom: 10px;
}
form input.btn:hover {  border: 1px solid #727a32; }
p.human { display: none; } /* Hide the human text field */

	/* Different things */
	.aligncenter { display: block; margin-left: auto; margin-right: auto; }
	.alignleft { float: left; }
	.alignright{ float: right; }
	img.alignleft { float: left; margin-right: 10px; }
	img.alignright { float: right; margin-left: 10px;}
	
	.clear { clear: both; }
	
	/* Give some things attention to your users - Just give a element a class - For example <p class="error">Some error text!</p>*/
	.warning, .alert, .error, .success, .download {
		padding: 6px 9px;
		font-family: Arial, Helvetica, sans-serif;
		/* I think it looks better with Georgia instead of Arial, just delete this line if you dont' */
	}
	.warning, .alert { background: #fffbbc; border: 1px solid #E6DB55; }
	.error { background: #ffebe8; border: 1px solid #C00; }
	.success, .download{ background: #e7f7d3; border: 1px solid #6c3; }
	
	/* Buttons */
	.btn {
		background: #444343 url(../images/btn_bg.png) repeat-x; 
		border: 1px solid #000; 
		color: #fff;
		padding: 4px 12px;
		text-shadow: #444343 0 1px 0;
		border-radius: 5px; /* Rounded corners - Currently not supported by any browser */
		-moz-border-radius: 5px; /* Rounded corners for Firefox */
		-webkit-border-radius: 5px; /* Rounded corners for Safari and Chrome */
	}
	.btn:hover { border: 1px solid #000; }
	.btn a { color: #fff; }
	input[type="submit"] { cursor: pointer; } /* Gives all submit buttons a hand cursor on rollover - Not working in IE6 */
	
	
	blockquote {
		border-left: 3px solid #dde78c;
		color: #666;
		font: italic 12px Georgia, "Times New Roman", Times, serif;
		overflow: hidden;
		margin: 10px 0;
		padding-left: 9px;
	}
	code { padding: 0 3px; background: #eee; }
	pre {
		background: url(../images/pre.png) repeat;
		border: 1px solid #eee;
		padding: 9px;
		overflow-x: auto; /* Use horizontal scroller if needed*/
	}
	
	/* Table */
	
	table {	
		width: 100%;
		border:1px dotted #dedede;
		margin: 0 0 25px 0;	
	}
	table caption{
		color: #829107;
		font-size: 18px;
		text-align:left;
		line-height:40px;
	}
	table thead th {
		background: #EAEAEA url(../images/table_head_bg.png) repeat-x; /* The background image is just a soft gradient */
		border: 1px solid #dedede;
		font-size: 12px;
		padding: 15px;
	}
	table tbody td{ 
		background: #fcfcfc;
		border-left:1px dotted #dedede;
		border-bottom:1px dotted #dedede;
		font-size: 12px;
		padding: 3px;
		text-align: left;
	}
	table tbody td:hover{ background: #F8F8F8;} /* Color of the hover background in tables */
	
/*TITLES*/

#welcome{ 
	display:block;
	/*background:url(../images/welcome.gif) no-repeat;
	width:550px;
	height:30px;
	text-indent:-99999px;*/
	line-height:30px;
	font-size: 30px;
	font-family: Arial;
	font-weight: bold;
	color: #444343;
	letter-spacing: -1px;
	border-bottom: 1px dotted #b7b7b7;
	}

#latest-news{ 
	display:block;
	background:url(../images/latest-news.gif) no-repeat;
	width:550px;
	height:30px;
	text-indent:-99999px;
	}


#featured-product-heading{
	display:block;
	background:url(../images/featured-product.gif) no-repeat;
	width:300px;
	height:24px;
	text-indent:-99999px;
	z-index:-1;
	}
#testimonial-heading{
	display:block;
	background:url(../images/testimonials.gif) no-repeat;
	width:300px;
	height:24px;
	text-indent:-99999px;
	}
	
#newsletter-subs{
	display:block;
	background:url(../images/news-letter.gif) no-repeat;
	width:300px;
	height:24px;
	text-indent:-99999px;
	}
#clients-heading{
	display:block;
	background:url(../images/clients.gif) no-repeat;
	width:300px;
	height:24px;
	text-indent:-99999px;
	}





/*NEWS SCROLLER*/
#scrollup {
	position: relative;
	overflow: hidden;
	height: 200px;
	width: 300px;
}

.headline {
	position: absolute;
	top: 210px;
	left: 5px;
	height: 195px;
	width:300px;
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size:12px;
	text-align:left;
}




/*TESTIMONIALS*/

#clienttestimonial{float:left;  position:relative; margin:0 0 15px 0; width: 600px;}
#clienttestimonial .client-logo { position:relative; width:220px; margin-top:25px}
#clienttestimonial .client-text { float:left; width:360px;  margin-top:25px}

#clienttestimonial.bordered { border-top:1px dotted #B7B7B7; }
span.unbold {font-weight:normal;}

#clienttestimonial .client-logo2 { position:relative; width:220px; }
#clienttestimonial .client-text2 { float:left; width:360px; }

ul#client-logos li img{
	border:none;
	padding: 4px;
	list-style:none;
}

#testimonial{position:relative; margin:5px 0 5px 0;}
#left-quote{ background:url(../images/quote-left.gif) no-repeat top left; height:19px; width:24px;}

#testi-text{
	background:url(../images/quote-right.gif) no-repeat bottom right;
	width:250px;
	padding:0 15px 15px 25px;
	font-size:12px;
	color:#666666;
	}

#testi-logo{ position:relative; top:0; left:5px;}
#credits{position:relative; top:-80px; left:110px;}
#readmore{ position:relative; top:-25px; float:right;}
.title{ font-size:11px;}


/*FEATURED PRODUCT*/
#featured-product{ position:relative; float:left;}
#f-product{ float:left; border:none; margin:0 7px 7px 0; z-index:-1;}





.infiniteCarousel {
  width: 420px;
  position: relative;
}

		.infiniteCarousel .wrapper {
		  width: 400px; /* .infiniteCarousel width - (.wrapper margin-left + .wrapper margin-right) */
		  overflow: auto;
		  min-height: 10em;
		  margin: 0 40px;
		  position:relative;
		  top: 0;
		}
		
		.infiniteCarousel ul a img {
		  border: 5px solid #8bc7b4;
		  -moz-border-radius: 5px;
		  -webkit-border-radius: 5px;
		}
		
		.infiniteCarousel .wrapper ul {
		  width: 9999px;
		  list-style-image:none;
		  list-style-position:outside;
		  list-style-type:none;
		  margin:0;
		  padding:0;
		  position: absolute;
		  top: 0;
		}
		
		.infiniteCarousel ul li {
		  display:block;
		  float:left;
		  padding: 10px;
		  height: 80px;
		  width: 110px;
		}
		
		.infiniteCarousel ul li a img {
		  display:block;
		}
		
		.infiniteCarousel .arrow {
		  display: block;
		  height: 36px;
		  width: 37px;
		  background: url(../images/arrow.png) no-repeat 0 0;
		  text-indent: -999px;
		  position: absolute;
		  top: 37px;
		  cursor: pointer;
		}
		
		.infiniteCarousel .forward {
		  background-position: 0 0;
		  right: -65px;
		}
		
		.infiniteCarousel .back {
		  background-position: 0 -72px;
		  left: 0;
		}
		
		.infiniteCarousel .forward:hover {
		  background-position: 0 -36px;
		}
		
		.infiniteCarousel .back:hover {
		  background-position: 0 -108px;
		}



#product-col-left{
	position:relative;
	float:left;
	width:300px;
	padding-left:5px;
}

#product-col-right{
	position:relative;
	float:left;
	width:200px;
	padding:25px 0 0 25px;
	margin-right:5px;
}

#download-link{
	margin-top:15px;
	border:none;
}

.solution-container { float:left; width:600px; }
.text-container{ float:left; width:320px; } 
.img-container{ float:right; width:250px; margin:0 0 20px 20px; }
.text-container2{ float:right; width:320px; } 
.img-container2{ float:left; width:250px; margin:0 20px 20px 0; }



/*Testimonials*/

.testimonial{
	margin: 35px 0 0 0;
	border-bottom: 1px solid #ccc;
	}

.client-logo{
	float: left;
	margin-right:15px;
	}

/* Case Study */
img.imgright { margin: 0 0 15px 15px; }
img.imgleft { margin: 0 15px 15px 0; }

#slide_show {
	width:250px; 
	float: left;
}
#navi{
	position:relative;
 	width:100%;
	float: left;
 	/*height:14px;
	top:-35;
	*top:-45;
	left:250px;*/
}


ul#navigation li {
	list-style:none;
	float: left; 
	margin-right: 10px
}

ul#navigation li a:link {
	border: 0px solid #000; 
	display: block; 
	width: 8px; 
	height: 8px;
	line-height: 8px;
	color: black; 	 
	text-align: center; 
	text-decoration: none
}

ul#navigation li a:visited {
	border: 0px solid #000; 
	display: block; 
	width: 8px; 
	height: 8px;
	line-height: 8px;
	color: black; 	 
	text-align: center; 
	text-decoration: none
}

ul#navigation li a:active {
	border: 0px solid #000; 
	display: block; 
	width: 8px; 
	height: 8px;
	line-height: 8px;
	color: black; 	 
	text-align: center; 
	text-decoration: none
	background-color: white; 
}


#logorotator {float: left; width: 600px; }
#logorotator ul { float: left; height: 84px; list-style: none outside none;  margin: 0;  padding: 0;  width: 600px; }
#logorotator ul li { float: left; height: 84px; padding-left: 10px; position: relative; width: 110px; list-style:none outside none; border-bottom:none;}
#logorotator ul li .cell { display: table-cell; height: 84px; text-align: center; vertical-align: middle; width: 110px; }
#logorotator .rotator-image { display: none; height: 100px; position: absolute; width: 100px; }
