body {
	font-size: 62.5%;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #FFFFFF;
	margin:0;
	padding:0 ;
	line-height:1.5em;
}
.clear {
	clear:both;
}
/* STYLING ----------------------------------------------------- */
.high {
	color:#FFF100;
}
.grey {
	color:#666666;
}
.large {
	font-size:2em;
	color:#FFFFFF;
}
.largeYellow {
	font-size:2em;
	color:#FFF100;
	line-height:1.7em;
    width: 234px;
}
.homeDark {
	color:#197609;
}
ul {margin: 0;padding: 0;padding-left: 2.2em;}
li {list-style-image: url(assets/images/general/bullet_red.gif);font-size: 1em;line-height:1.5em;}
ul.clientsList {margin: 0;padding: 0;}
.clientsList li {
	list-style-image: none;
	list-style-type: none;
	line-height:1.8em;
}
.exLineHeight {
	line-height:2em;
}
/* LINKS -----------------------------------------------------*/
a:link, a:visited {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 1em;
	color: #FFFFFF;
	text-decoration: none;
	border:0;
}
a:hover {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 1em;
	color: #FFF100;
	text-decoration: underline;
	border:0;
}
a.grey:link, a.grey:visited {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 1em;
	color: #666666;
	text-decoration: none;
	border:0;
}
a.grey:hover {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 1em;
	color: #FFFFFF;
	text-decoration: underline;
	border:0;
}
a.red:link, a.red:visited {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 1em;
	color: #CC0000;
	text-decoration: none;
	border:0;
}
a.red:hover {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 1em;
	color: #CC0000;
	text-decoration: underline;
	border:0;
}
a.green:link, a.green:visited {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 1em;
	color: #23720D;
	text-decoration: none;
	border:0;
}
a.green:hover {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 1em;
	color: #23720D;
	text-decoration: underline;
	border:0;
}
a.blue:link, a.blue:visited {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 1em;
	color: #0B1561;
	text-decoration: none;
	border:0;
}
a.blue:hover {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 1em;
	color: #0B1561;
	text-decoration: underline;
	border:0;
}
/*STRUCTURE  -----------------------------------------------------*/

#pdfbutton {

width:103px;
float:right;
}


#footer {
	width:949px;
	margin:0 auto;
	text-align:left;
}
.footerPad {
	padding:0px 0px 0px 620px;
	line-height:1.3em;
	font-size:0.9em;
}
.footerPadCard {
	padding:0px 0px 0px 620px;
	line-height:1.3em;
	font-size:0.9em;
}
.footerYellow {
	color:#FFFF00;
	font-weight:bold;
}
 #horizon {
	background-color: transparent;
	position: absolute;
	/*top: 20px; to make it float vertically - A */
	top: 110px;
	left: 20px;
 }
 /* following rules are invisible to IE 5 \*/
 #horizon {
   /*top: 48%;
   margin-top: -240px; to make it float vertically - B */
   left: 0px;
   width: 100%;
   text-align: center;
   min-width: 950px; 
 }
 /* end IE 5 hack */ 
#oneHundredWrapper {
	position: relative;
	text-align: center;
	width: 100%;
	height: 511px;
	margin: 0px auto;
	background-position: center;
	background-repeat: no-repeat;
}
#mainWrapper {
	width:949px;
	margin:0 auto;
	text-align:left;
}
#contentBg {
	width:894px;
	height:511px;
	float:right;
}
.mainContent {
	position:absolute;
}
.footnote {
	position:absolute;
	width:320px;
	height:37px;
	z-index:1;
	left: 563px;
	top: 457px;
/*	border:1px solid #000000;*/
}
.logo{
	position:absolute;
	width:120px;
	height:37px;
	left: 774px;
	top: 0px;
	z-index:1;
/*	border:1px solid #000000;*/
}
#clientsFeature {
	position:relative;
	min-width: 950px;
	z-index:2;
}
#clientsFeatureIn {
	position:absolute;
	top:100px;
	left:35px;
	width:355px;
	height:400px;
	z-index:3;
}
#servicesFeature {
	position:relative;
	min-width: 950px;
	z-index:2;
}
#servicesFeatureIn {
	position:absolute;
	top:385px;
	left:44px;
	width:590px;
	height:100px;
	z-index:3;
}
#testimonial {
	position:relative;
	min-width: 950px;
	z-index:2;
}
#testimonialIn {
	position:absolute;
	top:247px;
	left:260px;
	width:355px;
	height:400px;
	z-index:3;
}
#over {
	position:relative;
	background-color:#FF0000;
	min-width: 950px;
	z-index:2;
}
#overContent {
	position:absolute;
	top:0;
	left:50%;
	margin-left:-300px;
	margin-top:10px;
	width:762px;
	height:1061px;
	z-index:3;
	line-height:1.3em;
	background-image: url(../assets/images/recepie_bg/creative_services_branding.png);
}

/*#LiveChat {
	position:absolute;
	top:0;
	left:50%;
	margin-left:-420px;
	margin-top:30px;
	width:73px;
	height:44px;
	z-index:3;
}*/

#overeCommerce {
	position:absolute;
	top:0;
	left:50%;
	margin-left:-300px;
	width:762px;
	height:1061px;
	z-index:3;
	line-height:1.3em;
	background-image: url(../assets/images/recepie_bg/creative_services_branding.png);
}

#overeCommerceLeft {
	float:left;
	width:270px;
	color:#ffffff;
	
}

#overeCommerceRight {
	float:right;
	width:270px;
	color:#ffffff;
	
}

.eCommerceTitles {
font-size:18px;
color:#FEB91E;
}

.eCommerceTitlesBlue {
font-size:18px;
}

.overContentCommercePad {
	padding:250px 100px 20px 90px;
}



ul.uleCommerce {
list-style-image: none;
	list-style-type:circle;
}

ul.uleCommerce li {
list-style-image: none;
	list-style-type:circle;
}




#overeshot {
	position:absolute;
	top:0;
	left:50%;
	margin-left:-300px;
	margin-top:10px;
	width:733px;
	height:1010px;
	z-index:3;
	line-height:1.3em;
	background-repeat:no-repeat;
	background-image: url(assets/images/eshot.png);
}

.overContentPad {
	padding:300px 100px 20px 90px;
}
.overContentPadNews {
	padding:80px 100px 20px 90px;
}

.overContentPadMap {
	padding:250px 100px 20px 90px;
}


#overContentServices {
	position:absolute;
	top:0;
	left:50%;
	margin-left:-420px;
	margin-top:0px;
	width:874px;
	height:1024px;
	z-index:3;
}
.overContentPadShort {
	padding:225px 100px 20px 90px;
}
.overContentLeft {
	float:left;
	width:180px;
	/*background-color:#669900;*/
}
.overContentRight {
	float:right;
	width:370px;
	/*background-color:#003366;*/
}
.newsletterLinkLeft {
	float:left;
	width:286px;
	height:141px
	/*background-color:#669900;*/
}
.newsletterLinkRight {
	float:right;
	width:266px;
	height:141px;
	text-align:right;
	/*background-color:#003366;*/
}
.newsLinkLeft {
	float:left;
	width:498px;
	/*background-color:#669900;*/
}
.newsLinkRight {
	float:right;
	width:54px;
	text-align:right;
	/*background-color:#003366;*/
}
.overContentLeftNews1 {
	float:left;
	width:286px;
	height:350px;
	/*background-color:#669900;*/
}
.overContentRightNews2 {
	float:right;
	width:266px;
	height:350px;
	/*background-color:#003366;*/
}
.overContentLeftNews3 {
	padding-left:15px;
	float:left;
	width:286px;
	height:395px;
	/*background-color:#669900;*/
}
.overContentRightNews4 {
	float:right;
	width:266px;
	height:395px;
	/*background-color:#003366;*/
}


.testimonialOpen {
	background-image: url(assets/images/general/quote_open.gif);
	background-repeat: no-repeat;
	background-position: left top;
}
.testimonialClose {
	background-image: url(assets/images/general/quote_close.gif);
	background-repeat: no-repeat;
	background-position: right bottom;	
}
.testimonialOpen p {
	padding-left:60px;
	padding-right:35px;
}





.servicePad {
	width:220px;
	height:320px;
	padding-top:207px;
	padding-left:250px;
	
}
.servicePad a:hover {
	text-decoration:none;
	color:#FFFFFF;
}
.service a, .service a:visited, {    
	width:220px;  
	height:289px;
}
.service {
	width:220px;
	height:17px;
	float:left;
	cursor:hand;
	/*background-color:#6699CC;*/
}
.service2 {
	width:220px;
	height:22px;
	float:left;
	cursor:hand;
	/*background-color:#6699CC;*/
}
/*.services {  
	width:158px;  
	height:138px;
}  
.services a, .services a:visited, .services a:hover {  
	display:block;  
	width:100%;  
	height:100%;  
	text-decoration:none;
	color:#FFFFFF;
}*/
.contactlink{
	position:absolute;
	width:103px;
	height:83px;
	z-index:10;
	left: 678px;
	top: 329px;/*	border:1px solid #000000;*/
}
.playlink{
	position:absolute;
	width:103px;
	height:83px;
	z-index:10;
	left: 41px;
	top: 76px;/*	border:1px solid #000000;*/
}
.portfoliolink{
	position:absolute;
	width:103px;
	height:84px;
	z-index:20;
	left: 736px;
	top: 380px;/*	border:1px solid #000000;*/
}
.moreinfolink{
	position:absolute;
	width:103px;
	height:83px;
	z-index:30;
	left: 633px;
	top: 400px;/*	border:1px solid #000000;*/
}
.homelink{
	position:absolute;
	width:120px;
	height:37px;
	z-index:1;
	left: 923px;
	top: 19px;/*	border:1px solid #000000;*/
}
.textContent_page_turn {
	margin:390px 0px 0px 40px;	
	width:949px;
}

.texteshot {
	padding-top:178px;
	text-align:left;
	width:480px;
	float:left;
	clear: both;
}


.title {
	margin-top:150px;
}
.textContent {
	text-align:left;
	width:350px;
	margin:0px 0px 0px 545px;
/*	border:1px solid #000000;*/
}
.textContentSap {
	text-align:left;
	width:317px;
	margin:0px 0px 0px 570px;
/*	border:1px solid #000000;*/
}

.textContentHome {
	text-align:left;
	width:391px;
	margin:0px 0px 0px 500px;
}
.textContentNoTitle {
	text-align:left;
	width:350px;
	margin-left:545px;
	margin-top:130px;
}


/* NAVIGATION ----------------------------------------------------- */
body#mango #tmango a,
body#services #tservices a,
body#portfolio #tportfolio a,
body#about #tabout a,
body#testimonials #ttestimonials a,
body#clients #tclients a,
body#contact #tcontact a { 
background-position:0 -71px;
}
#navIndex {
	top:0; 
	right:0;
	width:55px;
	float:left;
}
#nav {
	margin:0;
	padding:0;
	height: 497px;
	overflow:hidden;
	list-style:none;
	display: block;
	width:55px;
}
#nav li {
	margin:0;
	padding:0;
	list-style:none;
	display: block;
	float:left;	
}
#nav a {
	float:left;
	padding: 71px 0 0 0;
	overflow:hidden;
	height: 0px !important;
	height: /**:80px; ?* for IE5/Win only*/
}
#nav a:hover {background-position:0 -142px;}
#nav a:active, #nav a.selected {background-position:0 -71px;}

#tmango a {width:949px;height:110px;background:url(assets/images/nav/nav_home.gif) top left no-repeat;	}
#tservices a {width:949px;height:110px;background:url(assets/images/nav/nav_services.gif) top left no-repeat;	}
#tportfolio a {width:949px;height:110px;background:url(assets/images/nav/nav_portfoilo.gif) top left no-repeat;}
#tabout a {width:949px;height:110px;background:url(assets/images/nav/nav_about.gif) top left no-repeat;	}
#ttestimonials a {width:949px;height:110px;background:url(assets/images/nav/nav_testimonials.gif) top left no-repeat;}
#tclients a {width:949px;height:110px;background:url(assets/images/nav/nav_clients.gif) top left no-repeat;}
#tcontact a {width:949px;height:110px;background:url(assets/images/nav/nav_contact.gif) top left no-repeat;}






.webfolioContent {
	position:absolute;
	top: -18px;
	height: 2573px;
}

/*coda slider */

#wrapper {
    width: 1000px;
	height:511px;
}

#slider {
    margin: 0;
}

.scroll {
float:left;
    width: 860px;
	height:580px;
    overflow: auto;
    overflow-x: hidden;
    position: relative;
}

.scrollContainer div.panel {
 padding: 15px;
    height: 370px;
    width: 860px;
	}
	

ul.navigation {
    list-style: none;
    margin: 0;
	    margin-left: -22px;
    color: #FFFFFF;
	font-size:10px;
}

ul.navigation li {
    list-style:none;
    display:inline;
	font-weight:bold;
	float: left;
}

ul.navigation a {
    padding: 5px;
    text-decoration: none;
}

ul.navigation a:hover {

color: #FFF100;
	font-size:10px;
}

ul.navigation a.selected {
color: #FFF100;
	font-size:10px;
}


.scrollButtons {
    position: absolute;
    top: 100px;
    cursor: pointer;
}

.scrollButtons.left {
display:none;
    left: -20px;
}

.scrollButtons.right {
display:none;
    right: -20px;
}

.hide {
    display: none;
}


#tab1 a { background:#187606;}
#tab2 a { background:#329A32}
#tab3 a { background:#FFBA00}
#tab4 a { background:#FF6000}
#tab5 a { background:#FF0000}
#tab6 a { background:#CF0000}


/*webportfolio button*/

#overContentWeb {
	position:absolute;
	top:82px;
	left:50%;
	margin-left:-300px;
	margin-top:10px;
	width:766px;
	z-index:3;
}

ul.navigation2 {
    list-style: none;
    margin: 0;
	    margin-left: -22px;
    color: #FFFFFF;
	font-size:10px;
}

ul.navigation2 li {
    list-style:none;
    display:inline;
	font-weight:bold;
	float: right;
}

ul.navigation2 a {
    padding: 5px;
    text-decoration: none;
}

ul.navigation2 a:hover {

color: #FFF100;
	font-size:10px;
}

ul.navigation2 a.selected {
color: #FFF100;
	font-size:10px;
}