/* global styles */
	html {
		 overflow: scroll;
	}

	body{
		margin: 0px;
		padding: 0px;
		background: #FFF url(../images/bgCitronSite.jpg) repeat-x scroll 0 0;
		
		font:normal 12px/100% Verdana, Arial, Helvetica, sans-serif;
		color:#000;font:normal 12px/150% Verdana, Arial, Helvetica, sans-serif;
	}
	
	td, th{
		font-family: Verdana, Arial, Helvetica, sans-serif;
	}
	
	p{
		margin: 0 0 1em 0;
	}
	
	a{
		outline: none;
	}
/* /global styles */

/* outer wrappers styles */
	#OuterWrapper{
		width: 886px;
		padding: 8px 0px 7px 0px;
		margin: 20px auto;
		position:relative;
	}
	
	#MainWrapper{
		width: 876px;
		height: 567px;
		padding: 0px 0px 0px 0px;
		background: #FFF;
	}
	
	#MainWrapper[id]{
		background: url(../images/bgWrapperSides.png) 0px 0px repeat-y;
		padding: 0px 8px 0px 2px;
		height: auto;
		min-height: 567px;
	}
	
	#OuterWrapper .TopBg{
		width: 886px;
		height: 8px;
		overflow:hidden;
		position: absolute;
		left: 0px;
		top: 0px;
	}
	
	#OuterWrapper .TopBg[class]{background: url(../images/bgWrapperTop.png) 0px 0px no-repeat;}
		
	#OuterWrapper .BtmBg{
		width: 886px;
		height: 7px;
		overflow:hidden;
		/*position: absolute;
		left: 0px;
		bottom: 0px;*/
	}
	
	#OuterWrapper .BtmBg[class]{background: url(../images/bgWrapperBtm.png) 0px 0px no-repeat;}
/* /outer wrappers styles */

/* header */
	#Header{
		width:100%;
		height:89px;
		position:relative;
		z-index:10
	}
	
	/* logo */
		h1#Logo{
			margin: 0px;
			position:absolute;
			top:15px;
			left:44px;
			z-index:1000
		}
		
		h1#Logo a{
		}
		
		h1#Logo a img{
			border: none;
		}
	/* /logo */
	
	/* main nav */
		.MainNavWrapper{
			position: absolute;
			z-index: 10;
			top: 55px;
			right: 0px;
			width: 544px;
			height: 34px;
			background: #058289 url(../images/bgMainNav.jpg) 0px 0px no-repeat;
		}
		
		
		ul#MainNav{
			position: absolute;
			top: 0px;
			right: 0px;
			z-index: 1000;
			margin: 0px 0px 0px 0px;
			padding: 0px 0px 0px 0px;
			list-style-type: none;			
			height: 34px;
		}
		
		/* nav level 1 */
			ul#MainNav li.ItemLevel1{
				float: left;
				margin: 0px 0px 0px 0px;
				padding: 0px 2px 0px 0px;
				position: relative;
				height:30px;
				
				background: url(../images/sepMainNav.gif) 100% 60% no-repeat;
				font: normal 15px/30px Verdana, Arial, Helvetica, sans-serif;;
				color: #FFFFFF;
			}
			
			ul#MainNav li.ItemLevel1.first{}
			ul#MainNav li.ItemLevel1.last{background-image: none}
			
			ul#MainNav a.LinkLevel1{
				display: block;
				float: left;
				height:30px;
				font: normal 15px/30px Verdana, Arial, Helvetica, sans-serif;;
				color: #FFFFFF;
				padding: 0px 12px 0px 12px;
				text-decoration: none
			}
			
			ul#MainNav li.ItemLevel1.first a.LinkLevel1{}
			ul#MainNav li.ItemLevel1.last a.LinkLevel1{}
			ul#MainNav a.LinkLevel1 span{}
			ul#MainNav a.LinkLevel1:hover{color:#F9EF6A}
			ul#MainNav li:hover a.LinkLevel1, ul#MainNav li.sfHover a.LinkLevel1{color:#F9EF6A}
			ul#MainNav a.LinkLevel1:hover span{}
			ul#MainNav li:hover a.LinkLevel1 span, ul#MainNav li:sfHover a.LinkLevel1 span{}
			ul#MainNav a.LinkLevel1.selected{color:#F9EF6A}
			ul#MainNav a.LinkLevel1.selected span{}
		/* / nav level 1 */
		
		/* nav level 2 */
			ul#MainNav ul.NavLevel2{
				margin: 0px 0px 0px 0px;
				padding: 0px 0px 0px 0px;
				list-style-type: none;
				position: absolute;
				left: -1px;
				top: -1000px;
				height: 26px;
				overflow:hidden;	
				background:#62AB36;
			}
			
			ul#MainNav li.ItemLevel1:hover ul.NavLevel2, ul#MainNav li.sfHover ul.NavLevel2{
				top: 34px;
			}
			
			ul#MainNav li.ItemLevel2{
				display: inline;
			}
			
			ul#MainNav li.ItemLevel2.first{}
			ul#MainNav li.ItemLevel2.last{}

			ul#MainNav a.LinkLevel2{
				display: block;
				float: left;
				height: 26px;
				font: normal 14px/26px Arial, Helvetica, sans-serif;
				color: #BBBCBF;
				background: #62AB36 url(../images/sepMainNav2.gif) 100% 50% no-repeat;
				color: #FFF;
				padding: 0px 12px 0px 9px;
				text-decoration: none;
				white-space:nowrap
				
			}
			
			ul#MainNav li.ItemLevel2.first a.LinkLevel2{}
			ul#MainNav li.ItemLevel2.last a.LinkLevel2{background-image: none; padding: 0px 8px 0px 9px;}
			
			ul#MainNav a.LinkLevel2 span{}
			ul#MainNav a.LinkLevel2:hover{color:#F9EF6A}
			ul#MainNav a.LinkLevel2:hover span{}
			ul#MainNav a.LinkLevel2.selected{}
			ul#MainNav a.LinkLevel2.selected span{}
		/* / nav level 2 */
	/* /main nav */
/* /header */

/* content wrapper */
	.ContentWrapper{
	}
/* /content wrapper */

/* main content */
	.MainContent{
		padding: 0px 0px 0px 0px;
		height: 483px;
		margin: 0px 0px 0px 0px;
		width:100%;
		position:relative;
		z-index:0
	}
	
	.MainContent[class]{
		height:auto;
		min-height: 483px;
	}
	
	/*body#index .MainContent{background: url(../images/index.gif) 100% 0% no-repeat;}*/
	body#fresh_ideas .MainContent{background: url(../images/fresh_ideas.gif) 100% 0% no-repeat;}
	body#the_team .MainContent{background: url(../images/the_team.gif) 100% 0% no-repeat;}
	body#mission_and_focus .MainContent{background: url(../images/mission_and_focus.gif) 100% 0% no-repeat;}
	body#insights .MainContent{background: url(../images/insights.gif) 100% 0% no-repeat;}
	body#contact .MainContent{background: url(../images/contact.gif) 100% 0% no-repeat;}
	
	.InnerContent{
		width: 512px;
		padding: 93px 0px 0px 69px;
		font:normal 12px/150% Verdana, Arial, Helvetica, sans-serif;	
		color: #000;
	}
	
	body#index .InnerContent{width: 512px;}
	body#fresh_ideas .InnerContent{width: 460px;}
	body#the_team .InnerContent{width: 400px;}
	body#mission_and_focus .InnerContent{width: 512px;}
	body#insights .InnerContent{width: 440px;}
	body#contact .InnerContent{width: 512px;}
	
	body#index .HomePresentation{
		position: absolute;
		top: 0px;
		right: 0px;
		width:342px;
		height: 483px;
		z-index:0;
		background: url(../images/index.gif) 100% 0% no-repeat;
	}
	
	.InnerContent h1, #PortfolioIndex h1{
		font:normal 17px/100% Verdana, Arial, Helvetica, sans-serif;	
		color: #058289;
		margin: 0px 0px 20px 0px;
	}
	
	.InnerContent h2, #PortfolioIndex h2{
		font:bold 12px/150% Verdana, Arial, Helvetica, sans-serif;	
		color: #62AB36;
		margin: 0px 0px 0px 0px;
	}
	
	.InnerContent h3{
		font:bold 12px/150% Verdana, Arial, Helvetica, sans-serif;	
		color: #058289;
		margin: 0px 0px 0px 0px;
	}
	
	.InnerContent p{
		margin: 0px 0px 20px 0px;
	}
	

/* /main content */

/* homepage */
	.HomeContentCol{
		float: left;
		width: 255px;
		margin: 0px 0px 50px 0px;
		color:#058289;
		font:normal 12px/200% Verdana, Arial, Helvetica, sans-serif;
	}
	
	.HomeContentCol h2{
		font:normal 22px/100% Verdana, Arial, Helvetica, sans-serif;
		margin: 0px 0px 5px 0px;
	}
	
	.HomeContentCol p{
			margin: 0px 42px 0px 2px;
	}	

	ul.HomeFeatured{
		margin: 0px 0px 0px 0px;
		padding: 0px 0px 0px 0px;
		list-style-type: none;
		width: 450px;
	}
	
	ul.HomeFeatured li{
		display:block;
		float:left;
		padding: 0px 0px 0px 0px;
		margin: 2px;
	}

	ul.HomeFeatured li a{
		border:1px solid #CDCDCD;
		display:block;
		float:left;
		padding: 0px 0px 0px 0px;
	}
	
/* /homepage */

/* contact page */
	#contact address{
		font-weight: normal;
		font-style:normal;
		display: block;
		margin: 0px 0px -20px 0px;
	}
	
	#contact address .highlighted{
		color: #62AB36;
	}
	
	.ContactForm label{
		color: #62AB36;
		font-weight: bold;
		width:155px;
		float: left;
	}
	
	.ContactForm form{
		margin: 20px 0px 0px 0px;
	}
	
	.ContactForm .txtInput{
		border: 1px solid #CCC;
		margin: 0px 0px 5px 0px;
		padding: 1px 2px 1px 2px;
		width: 218px;
	}
	
	.ContactForm textarea{
		width: 218px;
		border: 1px solid #CCC;
		padding: 1px 2px 1px 2px;
		overflow: auto;
	}
	
	.PortfolioIndexThumbnails {
		float: left;
		width: 200px;
	}


		.PortfolioIndexThumbnails ul{
			margin: 3px 0px 0px 0px;
			padding: 0px 0px 0px 135px;
			list-style-type: none;
			width: 530px;
		}
		
		.PortfolioIndexThumbnails ul li{
			display: inline;
		}
		
		.PortfolioIndexThumbnails ul li a{
			display: block;
			width: 46px;
			height: 46px;
			border: 1px solid #CDCDCD;
			margin: 0px 5px 5px 0px;
			float: left;
		}


	
	.ContactForm .btnInput{
		font:bold 14px/16px Arial, Helvetica, sans-serif;
		height: 20px;
		border: 1px solid #CCC;
		background: #058289;
		color: #FFFFFF;
		text-align: center;
		text-transform: uppercase;
		padding: 0px 5px 0px 5px;
		margin: 5px 5px 10px 0px;
		width:auto;
	}
	
	.notice_error{
		color: #F00;
		padding: 2px 5px 2px 24px;
		border: 1px solid #F00;
		background: #FBD2D9 url(../images/icError.png) 4px 4px no-repeat;
		margin: 0px 0px 5px 0px;
		width: 348px;
	}
	
	.notice{
		color: #009933;
		padding: 2px 5px 2px 24px;
		border: 1px solid #009933;
		background: #D7FFE3 url(../images/icSuccess.png) 4px 4px no-repeat;
		margin: 0px 0px 5px 0px;
		width: 348px;
	}
/* /contact page */

/* portfolio pages */
	#Portfolio{
		width: 800px;
		margin: 43px 0px 10px 69px;
		position:relative;
	}

	#PortfolioIndex{
		width: 800px;
		margin: 43px 0px 10px 69px;
	}

	
	/* portfolio main section */
		#PortfolioMainSection{
			width: 608px;
		}
		
		#PortfolioMainSection h1{
			margin: 0px 0px 0px 0px;
			font:normal 14px/100% Arial, Helvetica, sans-serif;
			color: #058289;
			height:27px;
			float:left;
			width: 475px;
		}
		
		#PortfolioMainSection h1 #ProjectName{
			padding: 0px 20px 0px 0px;
		}
		
		#PortfolioMainSection h1 #ProjectName.loading{
			background: #FFF url(../images/ajax_loader.gif) 100% 50% no-repeat;		
		}		
		
		#PortofioItemWrapper{
			width: 600px;
			position:relative;
			padding: 0px 8px 8px 0px;
			clear: both;
		}
		
		#PortofioItemWrapper .PortfolioMainImage{
			width:598px;
		}
		
		#PortofioItemWrapper img{
			display: block;
		}
		
		#PortofioItemWrapper .PortfolioItemTopRightBg{
			width: 8px;
			height: 8px;
			overflow: hidden;
			position: absolute;
			top: 0px;
			right: -1px;
		}
		
		#PortofioItemWrapper .PortfolioItemTopRightBg[class]{
			right: 0px;
		}
		
		#PortofioItemWrapper .PortfolioItemBtmBg{
			width: 608px;
			height: 8px;
			overflow: hidden;
			position: absolute;
			bottom: -1px;
			left: 0px;
		}
		
		#PortofioItemWrapper .PortfolioItemBtmBg[class]{
			bottom: 0px;
		}
		
		#PortfolioPagination{
			font:normal 13px/128% Arial, Helvetica, sans-serif;
			text-align:right;
			padding: 0px 6px 0px 0px;
			float:left;
		}
		
		#PortfolioPagination a{
			padding: 3px 5px 3px 5px;
			border: 1px solid #058289;
			color: #058289;
			text-decoration: none;
		}

		#PortfolioPagination a:hover{
			background-color: #058289;
			color: #FFF;
		}

	/* /portfolio main section */
	
	/* portfolio nav section */
		#PortfolioNavSection{
			width: 164px;
			position: absolute;
			right: 0px;
			top:0px;
		}
		
		ul#PortfolioThumbnails{
			margin: 27px 0px 0px 0px;
			padding: 0px 0px 0px 0px;
			list-style-type: none;
			width: 164px;
		}
		
		ul#PortfolioThumbnails li{
			width: 48px;
			height: 48px;
			overflow:hidden;
			margin: 0px 5px 5px 0px;
			float: left;
		}
		
		ul#PortfolioThumbnails li a{
			display: block;
			width: 46px;
			height: 46px;
			overflow:hidden;
			border: 1px solid #CDCDCD;
		}
		
		ul#PortfolioThumbnails li a.selected{
			/*border: 1px solid #058289;*/
			border: 1px solid #6BAF41;
		}
		
		ul#PortfolioSectionsNav{
			clear:both;
			margin: 0px 0px 0px 0px;
			padding: 10px 0px 0px 0px;
			list-style-type: none;		
		}
		
		ul#PortfolioSectionsNav li{
			font:normal 13px/128% Arial, Helvetica, sans-serif;
			margin: 0px 0px 2px 0px;
		}
		
		ul#PortfolioSectionsNav li a{
			color: #058289;
			text-decoration: none;
		}
		
		ul#PortfolioSectionsNav li a:hover{
			text-decoration: underline;
		}		
	/* /portfolio nav section */
	
/* /portfolio pages */

/* footer */
	#Footer{
		border-top: 1px solid #EBEBEB;
		height: 35px;
		margin: 0px 35px 0px 35px;
	}
	
	#Footer .Copyright{
		font:normal 10px/30px Verdana, Arial, Helvetica, sans-serif;
		color: #4FA5CB;
	}
/* /footer */