/* ----------INFACT Design Consultancy--------- */
/* 		www.infact.co.nz	      	*/
/* 	  Written by J Broad, D Ollivier	*/

/* --------------------- Basics ----------------------- */
	body, html {
		color: #4d4d4d;
		font-family: Verdana, Helvetica, Arial, sans-serif;
		font-size: 12px;
		text-decoration: none;
		margin: 0px;
		padding: 0px;
		background-color: #ffffff;
	}

	h1 {
		font-size: 16px;
	}

	h2 {
		font-size: 12px;
		font-weight: bold;
		margin: 0px;
		text-align: center;
		color: #B7B8BA;
	}

	a.h2 {
		font-size: 12px;
		font-weight: bold;
		margin: 0px;
		text-align: center;
		color: #B7B8BA;
	}

	h3 {
		font-size: 11px;
		font-weight: bold;
		margin: 0px;
		margin-left: 5px;
		margin-top: 3px;
	}

	a.h3 {
		font-size: 11px;
		font-weight: bold;
		color: #4d4d4d;
		text-decoration: none;
	}

	p {
		display: block;
		clear: both;
		width: 100%;
		color: #4d4d4d;
		font-family: Verdana, Helvetica, Arial, sans-serif;
		margin-left: 20px;
	}
/* ----------------------------------------------------- */

/* --------------- FRAMES / CONTAINERS ---------------- */
	div#container {
		position: absolute;
		top: 0px;
		left: 50%;
		margin-left: -450px;
		width: 900px;
		height: 100%;
		overflow: hidden;
	}

	div#menu {
		margin-left: auto;
		margin-right: auto;
		margin-top: 30px;
		margin-bottom: auto;
		width: 595px; /* 80 * 7buttons 560, + spacer(5)*7 = 630*/
		height: 420px;
		background-repeat: no-repeat;
		overflow: visible;
	}

	div#logo {
		position: relative;
		float: right;
		background-image: url(i/logo.png);
		width: 265px;
		height: 36px;
		margin-top: 476px;
		margin-right: 20px;
		overflow: visible;
		background-repeat: no-repeat;
		visibility: visible;
	}
	a.menuLogo {
		width: 265px; height: 36px; text-indent: -10000em;
		display: block; overflow: hidden;
	}

/* ---------------- CONTENT DEFINES ---------------- */

	div#contentContainer {
		visibility: hidden;
		height: 376px;
		width: 5px;
		background-image: url(i/contentBorder.png);
		position: absolute;
		top: 80px;
		left: 100px;
		z-index: 2;
		text-align: left;
		overflow: hidden;
	}
	div#content {
		width: 100%;
		height: 100%;
		margin: 5px;
	}

	div.contentScroll {
		width: 99.7%;
		height: 99.5%;
		_width: 101.5%;
		_height: 99.5%;
		overflow-y: auto;
		overflow: -moz-scrollbars-vertical;
		overflow-x: hidden;
		position: relative;
		top: -5px;
		left: -5px;
		margin: 1px;
	}

	div.contentOneThirdL {
		position: relative;
		width: 32%;
		_width: 33%;
		height: 363px;
		_height: 365px; 		/* IE Hacks */
		float: left;
		overflow: hidden;
		/*border: 1px gray solid;*/
		z-index: 2;
		margin-left: 3px;
	}
	div.contentTwoThirdsR {
		position: relative;
		width: 65%;
		height: 363px;
		_height: 365px; 		/* IE Hacks */
		margin-right: 9px;
		_margin-right: 0px;		/* IE Hacks */
		float: right;
		overflow: hidden;
		/*border: 1px gray solid;*/
	}
	div.contentTitleLogo {
	}
	img.contentTitleLogo {
		border: 0px;
		width: 75px;
		height: 13px;
		float: left;
	}
	div.contentSubtitle {
		float: left;
		height: 13px;
		margin-left: 10px;
	}
	div.contentInfoBullet {
		width: 90px;
		height: 14px;
		float: left;
	}
	div.contentInfo {
		width: 130px;
		height: 14px;
		float: left;
		clear: right;
	}

	div.contentOneThirdBottomImage {
		width: 100%;
	}
	img.contentOneThirdBottomImage {
		border: 0px;
		width: 215px;
		position: absolute;
		left: 50%;
		margin-left: -107px;
		bottom: 20px;
	}

	div.contentAddress {
		clear: both;
		margin: 0px 0px 0px 15px;
	}

	div.contentSmPie {
		margin: 10px 0px 20px 0px;
		/*border: 1px gray solid;*/
		clear: both;
		height: 65px;
	}
	div.contentSmPieTxt {
		margin-left: 10px;
		font-size: 10px;
		float: left;
		/*border: 1px gray solid;*/
	}
	img.contentSmPieImg {
		float: left;
		font-size: 10px;
		margin-left: 10px;
		/*border: 1px gray solid;*/
	}
	a.contentSmPieLnk {
		text-decoration: none;
	}
	a.contentSmPieLnk:hover {
		color: #9d9d9d;
	}

	div.p {
		margin: 5px 0px 5px 5px;
		width: 90%;
		text-align: justify;
		clear: both;
	}
	a.contentThumbImages {
		width: 50px;
		height: 50px;
		margin-left: 2px;
		float: left;
		background-position: 0px 0px;
		display: inline;
	}
	a.contentThumbImages:hover {
		background-position: 50px 0px;
	}
	div.contentThumbHolder {
		width: 250px;
		position: absolute;
		left: 50%;
		margin-left: -110px;
		clear: both;
		/*border: 1px green solid;*/
	}

	a.contentBackArrow {
		width: 20px;
		height: 20px;
		display: block;
		position: absolute;
		bottom: 15px;
		left: 15px;
	}

	.contentFormLabel {
		display: block;
		margin-right: 10px;
		font-size: 12px;
	}

	.contentFormTextInput {
		width:	200px;
		height:	18px;
	}

	.contentFormTextArea {
		width: 280px;
		height: 190px;
	}

	.contentHeadshot {
		width: 200px;
		height: 220px;
		margin-left: 10px;
		margin-bottom: 10px;
		/*border: 1px grey solid;*/
		overflow: hidden;
		display: block;
	}

	a.contentSmallLink {
		color: #4d4d4d;
		text-decoration: underline;
	}

	div.contentResumeHeader {
		margin: 2px;
		text-align: right;
		width: 100%;
		height: 20px;
		font-size: 10px;
	}

	div.contentResumeSubTitle {
		margin-left: 20px;
		margin-top: 20px;
		border-bottom: 2px gray solid;
		font-size: 11px;
	}

	.contentResumeP {
		text-align: justify;
		font-size: 11px;
		margin: 5px;
	}

	.contentResumeTitleJ {
		font-size: 16px;
	}
	.contentResumeTitleAREDBROAD {
		font-size: 13px;
	}
	.contentResumeTitleC {
		font-size: 14px;
	}
	.contentResumeTitleURRVIT {
		font-size: 12px;
	}

	.contentResumeList {
		font-size: 10px;
		margin-left: 20px;
		text-align: justify;
		margin-top: 5px;
	}

	div#contentPortfolioSelect {
		color: #bebebe;
		font-size: 12px;
		text-align: center;
		display: block;
		position: absolute;
		top: 150px;
		left: 250px;
		height: 50px;
		width: 300px;
		z-index: 50;
		overflow: visible;
	}

	div#contentServicesSelect {
		color: #bebebe;
		font-size: 12px;
		text-align: center;
		display: block;
		position: absolute;
		top: 150px;
		left: 250px;
		height: 50px;
		width: 300px;
		z-index: 50;
		overflow: visible;
	}
/* --------------------------------------------------------------- */

/* ------------------------- BUTTONS MENU ------------------------ */
	a.menuCommon {
		background-repeat: no-repeat;
		text-decoration: none; color: white;
		font-weight: bold; font-family: bold; font-family: Verdana, Helvetica, Arial;
		display: block; overflow: hidden;
		width: 80px; height: 376px;
		font-size: 14px;
	}
	div.menuCommon {
		width: 80px; height: 374px; _height: 374px; overflow: hidden; float: left;
		position: absolute; top: 30px; z-index: 4;
	}

	img.menuSpacer {
		width: 1px;
		height: 353px;
	}

	div#menuYellow { top: 30px; }
	a#menuYellowA { background-image: url(i/menuYellow.png); }
	a#menuYellowA:hover { background-position: -80px 0px; }

	div#menuOrange { top: 5px; }
	a#menuOrangeA { background-image: url(i/menuOrange.png); }
	a#menuOrangeA:hover { background-position: -80px 0px; }

	div#menuRed { top: 40px; }
	a#menuRedA { background-image: url(i/menuRed.png); }
	a#menuRedA:hover { background-position: -80px 0px; }

	div#menuPink { top: 15px; }
	a#menuPinkA { background-image: url(i/menuPink.png); }
	a#menuPinkA:hover { background-position: -80px 0px; }

	div#menuPurple { top: -5px;	}
	a#menuPurpleA { background-image: url(i/menuPurple.png); }
	a#menuPurpleA:hover { background-position: -80px 0px; }

	div#menuBlue { top: 30px; }
	a#menuBlueA { background-image: url(i/menuBlue.png); }
	a#menuBlueA:hover { background-position: -80px 0px; }

	div#menuGreen { top: 20px; }
	a#menuGreenA { background-image: url(i/menuGreen.png); }
	a#menuGreenA:hover { background-position: -80px 0px; }
/* --------------------------------------------------------- */


/* -------------------------- home CSS -------------------*/
	div#homeContainer {
		position: absolute;
		top: 60px;
		left: 50%;
		margin-left: -425px;
		width: 850px;
		height: 430px;
		overflow: hidden;
		visibility: hidden;
		/*border: 1px gray solid;*/
	}

	div#homeTitleImg {
		position: absolute;
		top: 15px;
		left: 50%;
		margin-left: -240px;
		display: block;
		width: 480px;
		text-align: center;
	}

	div.homeTitle  {
		position: absolute;
		top: 50px;
		left: 50%;
		margin-left: -240px;
		display: block;
		width: 480px;
		font-size: 17px;
		font-weight: bold;
		letter-spacing: 0.3em;
		text-align: center;
	}

	div.homeSubtitle {
		position: absolute;
		left: 50%;
		margin-left: -200px;
		display: block;
		width: 400px;
		font-size: 15px;
		font-style: italic;
		text-align: center;
	}

	div.homeQuestion {
		position: absolute;
		top: 100px;
		left: 50%;
		margin-left: -200px;
		display: block;
		width: 400px;
		font-size: 12px;
		font-style: italic;
		height: 23px;
	}

	a.homeLink {
		text-decoration: none;
		font-weight: bold;
		color: #4d4d4d;
	}
	a.homeLink:hover {
		text-decoration: underline;
		font-weight: bold;
	}
/* -------------------------------------------------------- */



/* -------------------------- PORTFOLIO ---------------------*/
	h2#portfolioImageTitle { }

	div#portfolioImage {
		width: 230px;
		height: 335px;
		margin-left: 7px;
		margin-top: 3px;
		overflow: visible;
	}
/* -------------------------------------------------------- */


/* -------------------------- NEWS CSS ---------------------*/
	div#newsContainer {
		position: relative;
		width: 605px;
		height: 80%;
		margin-left: 40px;
		z-index: 2;
	}
	div.newsMenuItem {
		width: 100%;
		/*border: 1px green solid;*/
		margin-top: 5px;
		overflow: hidden;
	}
	div.newsMenuTitle {
		/*border: 1px orange solid;*/
		margin-right: 45px;
	}
	a.newsMenuTitle {
		font-size: 12px;
		text-align: right;
		display: block;
		text-decoration: none;
		color: #4d4d4d;
	}
	a.newsMenuTitle:hover { text-decoration: underline; }

	div.newsMenuDate {
		/*border: 1px purple solid;*/
		text-align: right;
		margin-right: 45px;
		font-size: 10px;

	}
	div.newsMenuIcon {
		float: right;
		width: 27px;
		height: 27px;
		margin-top: -27px;
		margin-right: 10px;
	}
	a.newsMenuIconLink {
		background-image: url(i/pdfIcon.jpg);
		/*border: 1px blue solid;*/
		display: block;
		width: 27px;
		height: 27px;
		background-position: 0px -27px;
	}
	a.newsMenuIconLink:hover { background-position: 0px 0px; }