﻿/*-------------------------------CSS Reset---------------------------------*/
html, body, div, span, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, em, font, img, ins, kbd, q, s, small, strong, sub, sup, tt, ol, ul, li, fieldset, form, label, table, tr, th, td 
{
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
}
/*-------------------------------------------------------------------------*/

/*
	# text-indent: -9999px = (if css is turned off, text links will display in images place
*/

html, body, form, #wrapper {font-family:Arial;background:url(../images/top_main_rep.gif) repeat-x;height:100%;}

#wrapper {margin:0 auto;width:960px;height: auto;min-height: 100%;}

#logo a {background:url(../images/logo.gif) no-repeat;height:41px;width:258px;margin:54px 0 73px 0;display:block;float:left;}


.innerOL{ padding-left:40px;}
/*------------------------------Main Menu----------------------------------*/

.myUL{list-style-image:url(../images/about_bullet.gif);line-height:30px;font-size:13px;margin:0 0 0 40px;}
ol li {font-size:11px;line-height:18px;}
.read_terms{}
.read_terms a{color:#2da4b8; text-decoration:underline;font-size:11px;line-height:18px;} 
#navContainer {list-style:none;width:583px;height:11px;float:right;margin:63px 0 95px 0;overflow:hidden;}
ul#nav li{display: inline;}  
ul#nav li a{height: 11px;float: left;text-indent: -9999px;}  

#navHome a {width: 63px;background: url(../images/nav.gif) no-repeat 0px 0px;}  
#navHome a:hover {background-position: 0 -11px;} 
.HomeActive {background: url(../images/nav.gif) no-repeat 0px -11px!important;} 
#navAboutus a {width: 104px;background: url(../images/nav.gif) no-repeat -63px 0px;} 
#navAboutus a:hover {background-position: -63px -11px;}  
.AboutActive {background: url(../images/nav.gif) no-repeat -63px -11px!important;} 
#navProducts a {width: 197px;background: url(../images/nav.gif) no-repeat -167px 0px;}  
#navProducts a:hover {background-position: -167px -11px;} 
.ProductsActive {background: url(../images/nav.gif) no-repeat -167px -11px!important;}
#navWork a {width: 104px;background: url(../images/nav.gif) no-repeat -364px 0px;}  
#navWork a:hover {background-position: -364px -11px;} 
.WorkActive {background: url(../images/nav.gif) no-repeat -364px -11px!important;}
#navContact a {width: 115px;background: url(../images/nav.gif) no-repeat -468px 0px;}
#navContact a:hover {background-position: -468px -11px;} 
.ContactActive {background: url(../images/nav.gif) no-repeat -468px -11px!important;}
/*-------------------------------------------------------------------------*/

#main {padding-bottom: 124px;clear:both;margin:0 0 75px 0;}  /* padding-bottom must be same height as the footer */

/*-------------------------------Footer------------------------------------*/
#footer {position:relative;background:url(../images/foot_rep.gif) repeat-x;height:124px;margin-top:-124px;clear:both;color:#8a8a8a;font-size:10px;}
#footer_container {width:960px;margin:0 auto;padding:26px 0 0 0;height:63px;}

#footer_left {float:left;width:550px;}
#footer_left_container {padding:0 0 0 139px;}
#footer_left a {color:#8a8a8a;text-decoration:none;}
#footer_left a:hover {color:#fff;}

#footer_right {float:right;width:211px;}

#footer p {color:#2da4b8;margin:10px 0 0 0;}

#call_us {background:url(../images/call_us.gif) no-repeat;height:15px;width:262px;margin:0 0 13px 0;text-indent: -9999px;}
#foot_logos {width:143px;height:34px;float:right;margin:10px 0 0 0;}
#twitter a{background:url(../images/twitter.gif) no-repeat;width:20px; height:34px;display:block;float:left;}
#blog a{background:url(../images/social/blogger.png) no-repeat;width:24px; height:24px;display:block;float:left;margin:6px 0 0;}
#facebook a{background:url(../images/social/facebook.png) no-repeat;width:24px; height:24px;display:block;float:left; margin:6px 0 0;}
#digg a{background:url(../images/social/digg.png) no-repeat;width:24px; height:24px;display:block;float:left; margin:6px 15px 0 0;}
#delicious a{background:url(../images/social/delicious.png) no-repeat;width:24px; height:24px;display:block;float:left; margin:6px 15px 0 15px;}
#nibbler a{width:88px; height:31px;display:block;float:left; margin:5px 0 0;}

#adwords  {height:125px;width:125px;position:absolute;bottom:23px;margin:45px 0 0 0; display: block;}

span.share{display:block; margin:5px 0 0 5px; float:right;}
.clearfix:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}
/* Hides from IE-mac \*/
* html .clearfix { height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */
/*-------------------------------------------------------------------------*/
#addthis
{
	position:absolute;
	bottom:125px;
	width:70px;
	margin:0 0 0 4px;
	height:50px;
}
/*-----------------------------General Styles------------------------------*/
a {font-size:11px;line-height:18px;color:#000;text-decoration:none;}
a:hover {color:#2da4b8;}
p {font-size:11px;line-height:18px;}
/*-------------------------------------------------------------------------*/

/*-------------------------------Home Page---------------------------------*/
#main_banner {height:299px;width:960px;clear:both;margin:0 0 52px 0;}

.hr {background:url(../images/hr_rep.gif) repeat-x;height:3px;}
.hr_clear {background:url(../images/hr_rep.gif) repeat-x;height:3px;clear:both;}
#block_container {font-size:11px;text-align:justify;line-height:18px;overflow:auto;}

#block_headings {background:url(../images/block_hed.gif) no-repeat;width:766px;height:12px;margin:44px auto 22px;}

#work {width:290px;float:left;}
#about {width:290px;float:left;margin:0 0 0 46px;}
#chat {width:290px;float:right;}

.block_link {width:92px;height:10px;text-indent: -9999px;overflow:hidden;margin:20px auto 0 auto;}

.learn_more a {background:url(../images/learn_more.gif) no-repeat;display:block;}
.learn_more a:hover {background-position: 0 -10px;}

.contact_us a {background:url(../images/contact_us.gif) no-repeat;display:block;}
.contact_us a:hover {background-position: 0 -10px;}


/*-------------------------------------------------------------------------*/

/*------------------------------About Us-----------------------------------*/
#about_top_img {background:url(../images/ten.jpg) no-repeat;width:267px;height:192px;float:left;}
#about_top_content {float:right;font-size:14px;line-height:28px;width:623px;margin:48px 0 30px 0;text-align:justify;}
#about_top_content h1 {background:url(../images/why_hed.gif) no-repeat;width:368px;height:15px;text-indent: -9999px;margin:0 0 10px;}

#about_doforyou {float:left;width:590px;margin:0 0 54px 0;}
#about_doforyou h1 {background:url(../images/we_can_do.gif) no-repeat;margin:0 0 15px 0;}

.about_columns {margin:50px 0 0;text-align:justify;}
.about_columns h1 {text-indent: -9999px;}

#about_breed {float:left;width:290px;margin:0 0 54px 0;}
#about_breed h1 {background:url(../images/hed_breed.gif) no-repeat;margin:0 0 15px 80px;}

#about_vision {float:left;width:290px;margin:0 0 0 45px;}
#about_vision h1 {background:url(../images/hed_vision.gif) no-repeat;margin:0 0 15px 80px;}

#about_committed {float:right;width:290px;}
#about_committed h1 {background:url(../images/hed_committed.gif) no-repeat;margin:0 0 15px 45px;}

#about_committed ul li {list-style-image:url(../images/about_bullet.gif);line-height:30px;font-size:14px;margin:0 0 0 20px;}

ul.services
{
    line-height:24px;font-size:11px; margin:0 0 0 12px;
}

h2#about_culture {background:url(../images/hed_culture.gif) no-repeat;text-indent: -9999px;display:block;margin:41px 0 15px 80px;}

#a-team h1
{
	background:url(../images/hed_a-team.gif) no-repeat;
	margin:46px auto 0 auto;
	width:107px;
}
/*-------------------------------------------------------------------------*/

/*-----------------------------Contact Us----------------------------------*/
#contact {font-size:11px;line-height:18px;width:960px;}

#contact_col1 {height:605px;float:left;width:160px;}
#contact_col1 a{color:#2da4b8; text-decoration:underline;font-size:11px;line-height:18px;}
#contact_col1 h1 {background:url(../images/pretoria_hed.gif) no-repeat;width:84px;height:13px;text-indent: -9999px;}
#contact_col1 h2 {background:url(../images/capetown_hed.gif) no-repeat;width:96px;height:15px;text-indent: -9999px;margin:60px 0 0 0;}
.google_map a {background:url(../images/google_map_link.gif) no-repeat;display:block;width:129px;height:11px;text-indent: -9999px;overflow:hidden;margin:25px 0 0;}
.google_map a:hover {background-position: 0 -11px;}

#contact_col2 {float:left;width:106px;height:482px;}

#contact_col3 {float:left;width:271px;margin:110px 0 0 0;}
#contact_col3 a{color:#2da4b8; text-decoration:underline;font-size:11px;line-height:18px;}

#contact_col4 {float:right;width:414px;}

/*Form Styles*/
#contact h3 {background:url(../images/contact_chat.gif) no-repeat;height:12px;width:106px;text-indent: -9999px;}
#contact_col4 b {line-height:26px;}
#contact_col4 ol {list-style:none;}
.contact_col4_textbox {border:0px;margin:3px 0 0 3px;font-size:11px;width:287px;}
.form_bottom_border {border-bottom:dotted 1px #000;}
.form_left_data {height:23px;width:114px;float:left;border-top:dotted 1px #000;border-right:dotted 1px #000;border-left:dotted 1px #000;}
.form_pad {margin:2px 0 0 10px;display:block;}
.form_right_data {height:23px;width:296px;float:right;border-top:dotted 1px #000;border-right:dotted 1px #000;}
.form_right_data input{outline:none;}/* for chrome and safaris auto outline */
.form_block {border:dotted 1px #000;padding:10px;overflow:auto;}
.form_block ul {list-style:none;width:386px;}
.form_block ul li {float:left;width:170px;line-height:25px;}
.form_block ul li a {background:no-repeat 0 0;width:16px;height:16px;float:left;margin:4px 4px 0 0;}
.form_block ul li a:hover {background-position:0 -16px;cursor:pointer;}
.form_block_multi {width:370px;border:0px;overflow:hidden;height:69px;outline:none;}
#submit a {background:url(../images/submit_btn.gif) no-repeat;height:38px;width:125px;text-indent: -9999px;display:block;margin:25px 0 0 0;}
#submit a:hover {background-position:0 -38px;}


/*-----------*/

.black_overlay{
			display: none;
			position: absolute;
			top: 0%;
			left: 0%;
			width: 100%;
			height: 100%;
			background-color: #4d4d4d;
			z-index:1001;
			-moz-opacity: 0.8;
			opacity:.80;
			filter: alpha(opacity=80);
		}
		.white_content {
			display:none;
			position: absolute;
			top: 25%;
			left: 25%;
			width: 50%;
			height: 50%;
			
			border: 8px solid #2da4b8;
			background-color: #2da4b8;
			z-index:1002;
			overflow: auto;
		}
		.white_content a:hover
		{
			color:#fff;}
.close
{
	z-index:1003;
	position:absolute;
	bottom:0;
	
	
	height:20px;
	background:#2da4b8;
	padding:5px 15px 5px 10px;
}

.larger_map
{
	z-index:1003;
	position:absolute;
	bottom:0;
	left:60px;
		
	height:20px;
	background:#2da4b8;
	padding:5px 15px 5px 15px;
}

/*-----------------------------------------------------------------------*/

/*------------------------Products & Services----------------------------*/
#ps{overflow:auto;}
#ps_img {width:620px;height:352px;margin:0 0 19px 0;}

#ps h1 {background:url(../images/hed_services.gif) no-repeat;width:84px;height:13px;text-indent: -9999px;margin:0 auto 22px auto;}
#ps h2 {background:url(../images/hed_products.gif) no-repeat;width:84px;height:12px;text-indent: -9999px;margin:38px auto 22px auto;}
#ps h3 {font-weight:bold;font-size:11px;margin:0 0 4px 0;}

#ps p {line-height:21px!important;text-align:justify;}
#ps span {float:left;width:54px;height:54px;margin:5px 10px 0 0;}

#services_col1 {float:left;width:292px;margin:0 0 51px 0;}
#services_col2 {float:right;width:625px; margin:19px 0 0 0;}

#services_block_left {width:292px;float:left;}
#services_block_right {width:292px;float:right;}

.services_pad {padding:55px 0 0;}
.services_TextImage{float:left; margin-top:5px; margin-right:10px;}
#web {background:url(../images/services_thumb1.gif) no-repeat;}
#system {background:url(../images/services_thumb2.gif) no-repeat;}
#bespoke {background:url(../images/services_thumb3.gif) no-repeat;}
#seo {background:url(../images/services_thumb4.gif) no-repeat;}
#consulting {background:url(../images/services_thumb5.gif) no-repeat;}
#storefront {background:url(../images/services_thumb6.gif) no-repeat;}
#warehouse {background:url(../images/services_thumb7.gif) no-repeat;}
#cms {background:url(../images/services_thumb8.gif) no-repeat;}

#products{overflow:auto;}
#products_col1 {float:left;width:292px;margin:0 42px 0 0;}
#products_col2 {float:left;width:292px;}
#products_col3 {float:right;width:292px;}
/*-----------------------------------------------------------------------*/

/*-----------------------------Our Work----------------------------------*/

/*carousel*/
.anythingSlider {width:960px;height:234px;position:relative;margin:45px auto 120px;clear:both;}
.anythingSlider .slider_wrapper {width:825px;overflow:hidden;height:255px;margin:0 0 0 65px;position:absolute;}
.anythingSlider .slider_wrapper ul {width:99999px;list-style:none;position:absolute;margin:0;}
.anythingSlider ul li {display:block;float:left;padding:0;height:255px;width:825px;margin:0;}
.anythingSlider ul li p {clear:left;padding:27px 0 0 0; text-align:justify;}
.anythingSlider ul li img {float: right;}
.anythingSlider .arrow {display:block;height:200px;width:67px;background:url(../images/arrows.jpg) no-repeat 0 0;text-indent:-9999px;position:absolute;top:65px;cursor:pointer;}
.anythingSlider .forward {background-position:0 0;right:-36px;}
.anythingSlider .back {background-position: -67px 0;left: -36px;}
.anythingSlider .forward:hover {background-position:0 -200px;}
.anythingSlider .back:hover {background-position:-67px -200px;}

#thumbNav {position:relative;top:323px;text-align:center;float:right;}
#thumbNav a {color:#fff;font:12px Courier;padding:4px 6px 0px 4px;font-weight:bold;display:inline-block;width:11px;height:17px;margin:0 5px 0 0;background:#2da4b8;text-align:center;}
#thumbNav a:hover {background:#e9e9e9;color:#000;}
#thumbNav a.cur {background:#e9e9e9;color:#000;}

#start-stop {float:left;background:#2da4b8;background-repeat:repeat-x;color:#000;font-weight:bold;padding:2px 5px;width:40px;text-align:center;top:323px;position:absolute;left:0;}
#start-stop.playing {background-color:#e9e9e9;}
#start-stop:hover {background-image: none;}

/*Prevents*/
.anythingSlider .slider_wrapper ul ul {position:static;margin:0;background:none;overflow:visible;width:auto;border:0;}
.anythingSlider .slider_wrapper ul ul li {float:none;height:auto;width:auto;background:none;}
/*-------*/

/*Clients*/
.slider_wrapper ul li p a.client_link
{
   font-size:11px;line-height:18px;color:#2da4b8;text-decoration:underline;
}

#foremost .heading {background:url(../images/carousel/foremost.jpg) no-repeat;width:244px;height:108px;text-indent: -9999px;float:left;}
#foremost span {background:url(../images/carousel/foremost_img.jpg) no-repeat;height:278px;width:286px;float:right; margin:0 0 0 30px;}
#foremost_url {background:url(../images/carousel/foremost_url.gif) no-repeat; width:228px; display:block; height:12px; margin:50px 0 0 0; text-indent:-9999px;}

#retailtribe .heading {background:url(../images/carousel/retailtribe_logo.jpg) no-repeat;width:218px;height:28px;text-indent: -9999px;float:left;}
#retailtribe span {background:url(../images/carousel/retailtribe_img.jpg) no-repeat;height:244px;width:423px;float:right;}
#retailtribe_url {background:url(../images/carousel/retailtribe_url.gif) no-repeat; width:218px; display:block; height:13px; margin:50px 0 0 0; text-indent:-9999px;}

#medihelp .heading {background:url(../images/carousel/medihelp.gif) no-repeat;width:199px;height:67px;text-indent: -9999px;float:left;}
#medihelp span {background:url(../images/carousel/medihelp_img.jpg) no-repeat;height:271px;width:354px;float:right; margin:0 0 0 30px;}
#medihelp_url {background:url(../images/carousel/medihelp_url.gif) no-repeat; width:211px; display:block; height:12px; margin:20px 0 0 0; text-indent:-9999px;}

#nurture .heading {background:url(../images/carousel/nurture.gif) no-repeat;width:250px;height:73px;text-indent: -9999px;float:left;}
#nurture span {background:url(../images/carousel/nurture_img.jpg) no-repeat;height:249px;width:363px;float:right; margin:0 0 0 20px;}
#nurture_url {background:url(../images/carousel/nurture_url.gif) no-repeat; width:253px; display:block; height:12px; margin:50px 0 0 0; text-indent:-9999px;}

#netcare .heading {background:url(../images/carousel/fsintel.gif) no-repeat;width:192px;height:63px;text-indent: -9999px;float:left;}
#netcare span {background:url(../images/carousel/fsintel_img.jpg) no-repeat;height:240px;width:394px;float:right; margin:0 0 0 20px;}
#netcare_url {background:url(../images/carousel/netcare_url.gif) no-repeat; width:237px; display:block; height:12px; margin:60px 0 0 0; text-indent:-9999px;}

#amrod .heading {background:url(../images/carousel/amrod.gif) no-repeat;width:258px;height:73px;text-indent: -9999px;float:left;}
#amrod span {background:url(../images/carousel/amrod_img.jpg) no-repeat;height:250px;width:381px;float:right; margin:0 0 0 20px;}
#amrod_url {background:url(../images/carousel/amrod_url.gif) no-repeat; width:186px; display:block; height:18px; margin:50px 0 0 0; text-indent:-9999px;}

#digital .heading {background:url(../images/carousel/digital.gif) no-repeat;width:170px;height:67px;text-indent: -9999px;float:left;}
#digital span {background:url(../images/carousel/digital.jpg) no-repeat;height:250px;width:375px;float:right; margin:0 0 0 30px;}
#digital_url {background:url(../images/carousel/digital_url.gif) no-repeat; width:254px; display:block; height:18px; margin:50px 0 0 0; text-indent:-9999px;}

#reggies .heading {background:url(../images/carousel/reggies.gif) no-repeat;width:187px;height:81px;text-indent: -9999px;float:left;}
#reggies span {background:url(../images/carousel/reggies_img.jpg) no-repeat;height:269px;width:391px;float:right; margin:0 0 0 30px;}
#reggies_url {background:url(../images/carousel/reggies_url.gif) no-repeat; width:203px; display:block; height:18px; margin:50px 0 0 0; text-indent:-9999px;}

#vitality .heading {background:url(../images/carousel/vitality.gif) no-repeat;width:149px;height:94px;text-indent: -9999px;float:left;}
#vitality span {background:url(../images/carousel/vitality_img.jpg) no-repeat;height:275px;width:426px;float:right; margin:0 0 0 30px;}
#vitality_url {background:url(../images/carousel/discovery_url.gif) no-repeat; width:220px; display:block; height:12px; margin:50px 0 0 0; text-indent:-9999px;}

/*-------*/

#our_work_bottom{overflow:auto;}
#proudofclients {width:640px;height:270px;margin:43px 0 0 0;float:left;background:url(../images/hr_vertical.gif) repeat-y right;}
#proudofclients span {background:url(../images/proud_of_clients.gif) no-repeat;width:617px;height:270px;display:block;}
#quote {width:283px;height:305px;float:right;margin:48px 0 0 0;}


.next_link {width:150px;height:10px;text-indent: -9999px;overflow:hidden;margin:20px auto 0 auto; }
.next_step a {background:url(../images/next-step-link.gif) no-repeat;display:block;line-height:22px!important;}
.next_step a:hover {background-position: 0 -10px;}

#slideshow {
   position:relative;
   height:305px;
}

#slideshow IMG {
    position:absolute;
    top:0;
    left:0;
    z-index:8;
    opacity:0.0;
}

#slideshow IMG.active {
    z-index:10;
    opacity:1.0;
}

#slideshow IMG.last-active {
    z-index:9;
}
.sites
{
    clear:both;
}
.warpshop
{
    float:left;
    padding:42px 0 0 1px;
    border:0px;
    height:89px;
}
.warphost
{
    padding:42px 0 0 0;
    float:right;
    border:0px;
     height:89px;
}
.host-link
{
    height:41px;width:217px;position:absolute;bottom:107px;margin:0 0 0 370px;
}
.shop-link
{
    height:41px;width:217px;position:absolute;bottom:107px;margin:0 0 0 140px;
}
.foot-hr
{
    background:url(../images/hr_rep.gif) repeat-x;height:3px;clear:both;
    margin:41px 0 0 0;
}
/*-------------------------------------------------------------------------*/

#recaptcha_image
{
	width:315px!important;
	margin:0 0 0 -3px!important;
	
}
#recaptcha_image img
{
	width:305px!important;

}
.recaptcha_image_cell
{
	width:322px!important;
	border:dotted 1px #000!important;
}


#recaptcha_table
{
	display:table;
	table-layout:fixed;
	width:392px!important;
	border:none!important;
}
#recaptcha_response_field
{
	width:311px!important;
	border:dotted 1px #000!important;
	margin:0 0 0 -3px!important;
	font-size:11px!important;
	padding:3px!important;
}
#recaptcha_logo
{display:none!important;
	
}
#recaptcha_tagline
{margin:0 0 0 -30px!important;
	
}
/* Remove reCaptcha button images  */
#recaptcha_reload_btn img {
display:none!important;
}
#recaptcha_switch_audio_btn img {
display:none!important;
}
#recaptcha_whatsthis_btn img {
display:none!important;
}
/* Add user created button images */
#recaptcha_reload_btn {
background: url(../images/refresh.png) no-repeat !important;
display:block;
height:18px;
width:25px;
}
#recaptcha_switch_audio_btn {
background: url(../images/audio.png) no-repeat !important;
display:block;
height:18px;
width:25px;
}
#recaptcha_whatsthis_btn {
background: url(../images/help.png) no-repeat !important;
display:block;
height:18px;
width:25px;
}
.at15t_compact.at300bs
{

}
.bottom-graph-container 
{
	padding: 40px 0 0;
	clear:both; height:49px; text-align: center;
}

.bottom-graph-container img 
{
	display: inline-block; vertical-align: middle;
}
