@import "reset.css"/*tpa=http://www.m2mprojects.co.za/reset.css*/;
@import "ddsmoothmenu.css"/*tpa=http://www.m2mprojects.co.za/ddsmoothmenu.css*/;

body {
	margin			: 0;
	padding			: 0;
	font-family		: Arial, Helvetica, sans-serif;
	font-size		: 12px;
	text-decoration	: none;
	background		: #636466;
	color			: #666;
	line-height		: 1.4em;
}
/*----- Wrapper ----------------------------------------------------*/
#wrapper {
	position		: relative;
	width			: 840px;
	margin			: 0 auto;
	padding			: 0 55px;
	background		: #fff;	
}
#contactUs {
	position		: fixed;
	left			: 0;
	top				: 170px;
	width			: 28px;
	height			: 99px;
}
#header {
	width			: 840px;
	height			: 132px;
}
#logo {
	float			: left;
	width			: 182px;
	height			: 132px;
}
/*---- rightHeader ---------------------------------------------------------*/
#rightHeader {
	float			: right;
	margin			: 20px 0 0 0;
}
#search {
	float			: right;
	width			: 210px;
}
input#ajaxSearch_input {
	float			: left;
	width			: 111px;
	height			: 14px;
	padding			: 3px 10px;
	margin			: 0 5px 0 0;
	font-size		: 10px;
	color			: #666;
	border			: none;
	background		: url(search_input_bg.gif)/*tpa=http://www.m2mprojects.co.za/search_input_bg.gif*/ no-repeat top left;
}
input#ajaxSearch_submit {
	float			: left;
}
#slogan {
	margin			: 50px 0 0 0;
	font-size		: 20px;
	font-weight		: bolder;
	color			: #008265;
	text-align		: right;
}
#slogan i {
	font-size		: 13px;
	font-weight		: normal;
	color			: #00b259;
}

/*---- Home Showcase --------------------------------------------------------------*/
#showcaseWrapper {
	position		: relative;
	width			: 840px;
	z-index			: 1;
	overflow		: hidden;
}
#showcase {
	position		: relative;
	height			: 264px;
	overflow		: hidden;
	z-index			: 1;
}
#pages {
	position		: absolute;
	height			: 20000em;
}
#showcase .page {	
	width			: 621px;
	height			: 264px;
}
#showcase .scrollable {
	position		: relative;
	width			: 621px;
	height			: 264px;
	overflow		: hidden;
}
#showcase .scrollable .items {
	width			: 20000em;
	position		: absolute;
	clear			: both;
	z-index			: 1;
}
#showcase .item {
	position		: relative;
	float			: left;
	cursor			: pointer;
	width			: 621px;
	height			: 276px;
	
}
#showcase .item img.slide {
	position		: relative;
	z-index			: 1;
}	
#showcase .item .itemContent {
	position		: absolute;
	top				: 0;
	left			: 0;
	width			: 511px;
	height			: 120px;
	padding			: 144px 100px 40px 30px;
	z-index			: 9999;
	color			: #fff;
	background		: url(slide_overlay.png)/*tpa=http://www.m2mprojects.co.za/slide_overlay.png*/ no-repeat top left;
}
#showcase .item .itemContent h2 {
	font-size		: 22px;
	font-style		: italic;
	padding			: 0 0 10px 0;
}
#showcase .item .itemContent p {
	font-size		: 14px;
}

	/* showcase navigator */
#showcaseMenu {
	position		: absolute;
	right			: 0;
	top				: 0;
	padding			: 0px !important;
	margin			: 0px !important;
	z-index			: 9;
}	
#showcaseMenu li {
	position		: relative;
	text-align		: right;
	color			: #fff;
	font-size		: 12px;
	height			: 58px;
	list-style-type	: none;
	padding			: 15px 10px 15px 60px;
	margin			: 0;
	width			: 195px;
	cursor			: pointer;
	vertical-align	: bottom;
}	
#showcaseMenu li#link1 {
	background		: url(link1_bg.png)/*tpa=http://www.m2mprojects.co.za/link1_bg.png*/ no-repeat top right;
}
#showcaseMenu li#link2 {
	background		: url(link2_bg.png)/*tpa=http://www.m2mprojects.co.za/link2_bg.png*/ no-repeat top right;
}
#showcaseMenu li#link3 {
	background		: url(link3_bg.png)/*tpa=http://www.m2mprojects.co.za/link3_bg.png*/ no-repeat top right;
}
#showcaseMenu li:hover {
	background-color: #444;
}
#showcaseMenu li.active {
	position		: relative;
	right			: 10px;
}
#showcaseMenu li h2 {
	font-size		: 17px;
	font-weight		: bolder;
	padding			: 5px 0 5px 0;
	text-transform	: uppercase;
}
#showcaseMenu li p {
	font-style		: italic;
	line-height		: 1em;
}
/*----- Content Wrapper --------------------------------------------------------*/
#contentWrapper {
	width			: 840px;
	padding			: 25px 0 0 0;
	overflow		: hidden;
}
/*----- Home Content ------------------------------------------------------------------*/
#contentHome {
	float			: left;
	width			: 574px;
	padding			: 2px 45px 0 0;
	color			: #2e2e31;
	overflow		: hidden;
}
#contentHome p {
	font-size		: 13px;
}
#homeBoxes {
	width			: 574px;
	margin			: 30px 0 0 0;
}
#homeBoxes .box {
	width			: 170px;
	float			: left;
	padding			: 0 15px 0 15px;
	border-left		: 1px dotted #FF0000;
}
#homeBoxes .box.first {
	border-left		: none;
	padding			: 0 15px 0 0;
}
#homeBoxes .box.last {
	padding			: 0 0 0 15px;
}
#homeBoxes .box  h2 {
	font-size		: 20px;
	color			: #008265;
	font-weight		: normal;
	padding			: 0 0 10px 0;
}
#homeBoxes .box  p {
	color			: #666;
	line-height		: 1.5em;
	padding			: 0 0 10px 0; 
	font-size		: 12px;
}
#homePageDowloads {
	margin			: 20px 0 0 0;
	padding			: 30px 0 0 0;
	border-top		: 1px dotted #FF0000;
	color			: #666;
}
#homePageDowloads p {
	padding			: 10px 0 0 0;
}
#homePageDowloads a {
	color			: #666;
	text-decoration	: none;
}
/*------- Home RightSidebar -----------------------------------------------------*/
#rightSidebar {
	float			: left;
	width			: 221px;
}
.module {
	width			: 221px;
	margin			: 0 0 20px 0;
	background		: #CCCCCC;
}
.module div.module_content {
	display			: block;
	width			: 181px;
	height			: 29px;
	line-height		: 29px;
	padding			: 0 20px;
	color			: #fff;
	background		: url(module_heading_bg.gif)/*tpa=http://www.m2mprojects.co.za/module_heading_bg.gif*/ no-repeat top left;
}
.module h3  {
	float			: left;
}
.module div.module_content a {
	cursor			: pointer;
	float			: right;
	margin			: 5px 0 0 10px;
}
.module div {
	padding			: 0 20px;
}
.module div p {
	padding			: 0 0 10px 0;
	font-size		: 11px;
}
.module div img {
	padding			: 0 0 10px 0;
}
/*------ Scrollable elements ------------------------------------------------------*/
#rightSidebar .scrollableBox {
	position		: relative;
	overflow		: hidden;
	width			: 221px;
	height			: 120px;
	padding			: 20px 0 0 0;
}
#rightSidebar .featuredProjects  .scrollableBox {
	width			: 221px;
	height			: 210px;
}
.featuredProjects  img {

}
.scrollableBox .itemsBox {
	width			: 20000em;
	position		: absolute;
	clear			: both;
}
.itemsBox div {
	float			: left;
	width			: 181px;
}

/*------ SubMenu ------------------------------------------------------------------*/
#subMenu {
	width			: 220px;
	float			: left;
	margin			: 0 40px 20px 0;
}
#subMenu ul li {
	display			: block;
	width			: 220px;
	margin			: 0 0 2px 0;	
	vertical-align	: bottom;
}
#subMenu ul li a:link, #subMenu ul li a:visited {
	display			: block;
	width			: auto;
	padding			: 3px 10px;
	background		: #FF0000;
	color			: #fff;
	font-size		: 11px;
	text-decoration	: none;
}
#subMenu ul li a:hover, #subMenu ul li.active a {
	background		: #b6d267;
	color			: #2e2e31;
}
#subMenu ul li.active ul  li{
	margin			: 0;
}
#subMenu ul li.active ul  li a:link, #subMenu ul li.active ul  li a:visited {
	color			: #7c7c7d;
	background		: #DFF0E0;
}
#subMenu ul li.active ul  li a:hover, #subMenu ul li.active ul  li.active a {
	color			: #303032;
	background		: #97CE9A;
}
/*------ Content --------------------------------------------------------------------*/
#content {
	float			: left;
	width			: 580px;
	padding			: 2px 0 30px 0;
}
/*----- Sitemap ----------------------------------------------------------------------*/
#sitemap ul li ul {
	padding			: 0 0 0 20px;
}
/*----- Typography ---------------------------------------------------------------*/
h1 {
	display			: block;
	font-size		: 24px;
	font-weight		: bolder;
	color			: #00b259;
	padding			: 0 0 15px 0;
	line-height		: 1em;
}
p {
	padding			: 0 0 15px 0;
}
#content  a:link, #content  a:visited {
	color			: #1fb25a;
	text-decoration	: none;
	font-weight		: bolder;
}
#content  a:hover {
	text-decoration	: underline;
}
#content ul li {
	padding			: 0 0 5px 10px;
	color			: #999;
	background		: url(bullet.png)/*tpa=http://www.m2mprojects.co.za/bullet.png*/ no-repeat left 5px;
}	
/*------ Project Lists & Project view --------------------------------------------------------------*/
#projectList {
	width			: 580px;
	overflow		: hidden;
}
.project {
	position		: relative;
	float			: left;
	width			: 115px;
	height			: 188px;
	margin			: 0 10px 10px 0;
	padding			: 10px 11px 10px 11px;
	background		: #dff0e1;
}
.project img {
	display			: block;
	padding			: 0 0 5px 0;
}
.project.marginLess {
	margin			: 0 0 10px 0;
}
.project .readon {
	position		: absolute;
	bottom			: 15px;
	left			: 10px;
}
p.projectHeader {
	padding			: 0 0 5px 0;
	overflow		: hidden;
}
p.projectHeader span {
	display			: block;
	float			: left;
	width			: 80px;
	color			: #53b276;
	font-weight		: bolder;
}
/*------ Ditto pagination ---------------------------------------------------------*/
#pagination {
	padding			: 10px 0 0 0;
}
span.ditto_currentpage, #content a.ditto_page:hover {
	display			: block;
	float			: left;
	width			: 17px;
	height			: 17px;
	margin			: 0 5px 0 0;
	color			: #fff;
	text-align		: center;
	font-size		: 10px;
	background		: url(ditto_current_page_bg.gif)/*tpa=http://www.m2mprojects.co.za/ditto_current_page_bg.gif*/ no-repeat top left;
}
#content a.ditto_page:link, #content a.ditto_page:visited {
	display			: block;
	float			: left;
	width			: 17px;
	height			: 17px;
	color			: #fff;
	margin			: 0 5px 0 0;
	text-align		: center;
	font-size		: 10px;
	background		: url(ditto_page_link_bg.gif)/*tpa=http://www.m2mprojects.co.za/ditto_page_link_bg.gif*/ no-repeat top left;
	text-decoration	: none;
}
#content a.ditto_page:hover {
	background		: url(ditto_current_page_bg.gif)/*tpa=http://www.m2mprojects.co.za/ditto_current_page_bg.gif*/ no-repeat top left;
}
#content a.ditto_previous_link {
	float			: left;
	margin			: 0 5px 0 0;
}
/*------- Directors & News List -----------------------------------------------------------*/
.directors, .newsItemWrapper {
	width			: 560px;
	padding			: 10px;
	margin			: 0 0 10px 0;
	background		: #dff0e1;
	overflow		: hidden;
}
.directors img, .newsItemWrapper img.newsImg {
	float			: left;
	width			: 115px;
	height			: 150px;
	margin			: 0 15px 0 0;
}
.newsItemWrapper img.newsImg {
	width			: 125px;
	height			: 83px;
}
.director {
	float			: left;
	width			: 425px;
}
.newsItem {
	float			: left;
	width			: 415px;
}
.director h2, .newsItem h2 {
	font-size		: 13px;
	font-weight		: bolder;
	color			: #008265;
}
.newsItem h2 {
	padding			: 0 0 10px 0;
}
.director h3 {
	font-size		: 13px;
	font-weight		: normal;
	color			: #1fb25a;
	padding			: 0 0 10px 0;
}
/*------ Archive ----------------------------------------------------------------------*/
div.reflect_archive_list {
	padding			: 0 0 20px 0;
}
div.reflect_archive_list ul li ul {
	padding			: 0 0 0 20px;
}
/*------ Slideshow gallery ---------------------------------------------------------*/
#gallery {
	margin			: 0 0 10px 0;
}
/*------ Forms  --------------------------------------------------------------------*/
.errors {
	padding			: 0 0 20px 0;
	color			: #9dc435;
}
form table input.invalid_value, form table input.required_value, form table textarea.required_value {
	border			: 1px solid #9dc435;
}
form table td, form table th {
	padding			: 0 0 10px 0;
	vertical-align	: top;
}
form input.text, form textarea, form select {
	border			: 1px solid #ccc;
	background		: url(input-bg.gif)/*tpa=http://www.m2mprojects.co.za/input-bg.gif*/ repeat-x top left;
	padding			: 3px;
	font-size		: 12px;
	font-family		: Arial;
}
form select {
	width			: 134px;
}
#hi_robot {
	display			: none;
}
form span {
	padding			: 0 0 0 5px;
	color			: #9dc435;
}
/*------ Map ------------------------------------------------------------------*/
#map {
	width			: 840px;
	height			: 276px;
	clear			: both;
	overflow		: hidden;
}
#maplinks {
	display			: none;
}
/*----- Footer ----------------------------------------------------------------*/
#footer {
	width			: 840px;
	height			: 113px;
	background		: url(footer_bg.gif)/*tpa=http://www.m2mprojects.co.za/footer_bg.gif*/ no-repeat top left;
	overflow		: hidden;
}
#footerLogos {
	margin			: 50px 0 0 50px;
}
#footerLogos ul li {
	display			: block;
	float			: left;
	margin			: 0 10px 0 0;
}
#footerBottom {
	width			: 830px;
	margin			: 0 auto 20px auto;
	padding			: 10px 60px;
	color			: #fff;
	font-size		: 11px;
}
#footerBottom ul {
	float			: right;	
}
#footerBottom #credits {
	float			: left;
}
#footerBottom #credits a:link, #footerBottom #credits a:visited {
	text-decoration	: none;
	color			: #B6D5CB;
}
#footerBottom #credits a:hover {
	text-decoration	: underline;
}
#footerBottom ul li {
	display			: block;
	float			: left;
	margin			: 0 0 0 20px;
}
#footerBottom ul li  a:link, #footerBottom ul li  a:visited {
	display			: block;
	color			: #fff;
	text-decoration	: none;
	font-weight		: bolder;
	font-size		: 11px;
}
#footerBottom ul li  a:hover {
	text-decoration	: underline;
}

#backToTop {
	margin			: 50px 0 0 0;
	cursor			: pointer;
	display			: none;
}
/*---- Client grid -----------------------------------------------------------------*/
.client_grid_item {
	float			: left;
	width			: 270px;
	height			: 125px;
	padding			: 10px 0 0 0;
	margin-right	: 40px;
	text-align		: center;
	overflow		: hidden;
}
.client_grid_item img {
	margin			: 0 0 10px 0;	
}
.client_grid_item  p {
	display			: block;
	padding			: 5px 10px;
	text-align		: left;
	background		: #C0DDD5;
	color			: #666;
	font-size		: 11px;
}