@import url('common.css');

/*
 * --- HOME PAGE ---------------------------------------------
 */
body#home {
	min-height: 636px;
}

/* IE fix */
* html body#home {
	height: 636px;
}

#panels {
	width: 154px;
	height: 340px;
	margin-right: 0px;
	margin-left: auto;
}
#panels p {
	line-height: 12px;
	font-size: 10px;
	margin-bottom: 0px;
	text-align: right;
	margin-right: 0px;
	margin-left: auto;
	font-weight: bold;
}
#panel1, #panel2, #panel3 {
	width: 149px;
	height: 78px;
	padding-top: 4px;
	padding-right: 5px;
	background-image: url(../images/pic_TheBigidea.jpg);
	background-repeat: no-repeat;
	margin-bottom: 9px;
}
#panel2 {
	background-image: url(../images/pic_ThinkGlobal.jpg);
}
#panel3 {
	background-image: url(../images/pic_EasytoUse.jpg);
	margin-bottom: 0px;
	height: 79px;
	padding-top: 3px;
	line-height: 11px;
}
#panel3 p {
	line-height: 11px;
}

/* --- Bottom Panel ---- */
.box1 {
/*	padding-top: 8px;
	width: 182px;
	padding-left: 12px;
	float: left; */
	padding-top: 8px;
	width: 177px;
	padding-left: 8px;
	float: left;
	cursor: pointer;
}
.box2 {
	width: 175px;
  	min-height: 60px;
	border-left-width: 1px;
	border-left-style: dotted;
	border-left-color: #666666;
	float: left;
	padding-top: 8px;
	padding-left: 22px;
	padding-right: 6px;
	cursor: pointer;
}

/* IE fix */
* html .box2 {
	height: 60px;
}
.box1 img, .box2 img {
	margin-right: 5px;
}
.box1 p, .box2 p {
	padding-top: 10px;
}
div.box1 a:hover, div.box2 a:hover {
	text-decoration: none;
}

/* slide out Boxes */
.dropmenu {
	margin-right: 1px;
	margin-bottom: 1px;
}
.dropmenuborder {
	background-color: #111111;
	height: 183px;
	padding-top: 12px;
	padding-left: 12px;
	padding-right: 6px;
	vertical-align: top;
	border-bottom: 1px solid #666666;
	border-right: 1px solid #666666;
	border-left: 1px solid #666666;
}
.dropmenuborder img {
	margin-right: 8px;
}
.dropmenu a {
	line-height: 18px;
}
body#home div#bottom-frame div.dropmenu p, 
body#contact div#bottom-frame div.dropmenu p {
	color: #CCCCCC;
}
body#home div#bottom-frame div.dropmenu p.smaller, 
body#contact div#bottom-frame div.dropmenu p.smaller {
	font-size: 11px;
	line-height: 13px;
}
.dropmenu a {
	color: #FF0000;
}
.dropmenu a:link, .dropmenu a:visited, .dropmenu a:active {
	color: #FF0000;
}
.dropmenu a:hover {
	color: #FF0000;
}
/* end of slide out sub-menu styles */
/*
 * -----------------------------------------------------------------------------------------------------------
 */

/*
 * --- ETHOS PAGE ---------------------------------------------
 */
#containing-frame {
	width: 1003px;
	margin: 0 auto;
}
body#ethos #main-frame {
	width: 803px;
	padding-top: 12px;
	border-top-width: 1px;
	border-top-style: dotted;
	border-top-color: #666666;
	margin: 0;
	height: 352px;
}
body#ethos div#bottom-frame {
	width: 803px;
	margin: 0;
	border-top-width: 1px;
	border-top-style: dotted;
	border-top-color: #666666;
}
body#ethos div#mid-col2 {
	width: 578px;
}

/*
 * --- PORTFOLIO LANDING PAGE ---------------------------------------------
 */
body#portfolio #mid-col {
	width: 817px;
	clear: right;
}
body#portfolio #mid-col-frame {
	width: 815px;
	height: 338px;
	border: 1px solid #323232;
}
#mid-col-cellA {
	width: 144px;
	float: left;
}
#mid-col-cellB {
	width: 381px;
	float: left;
	text-align: center;
}
#mid-col-cellC {
	width: 290px;
	float: left;
	clear: right;
}

/* Pop up boxes (reveal) */
.port_pop-up {
	width: 282px;
	height: 324px;
	border: 1px solid #686868;
	margin-top: 6px;
}
.port_pop-up p {
	margin-top: 281px;
	margin-left: 12px;
	margin-bottom: 0px;
	color: #CCCCCC;
}
#Commercial1 {
	background-image: url(../images/GalleryImages/commercial/comm1.jpg);
	background-repeat: no-repeat;
}
#Commercial2 {
	background-image: url(../images/GalleryImages/commercial/comm2.jpg);
	background-repeat: no-repeat;
}
#Auckland {
	background-image: url(../images/GalleryImages/auckland.gif);
	background-repeat: no-repeat;
}
#Pauatahanui {
	background-image: url(../images/GalleryImages/pauatahanui.gif);
	background-repeat: no-repeat;
}
#Hanmer {
	background-image: url(../images/GalleryImages/Hanmer_Marra.jpg);
	background-repeat: no-repeat;
}
#Hanmer2 {
	background-image: url(../images/GalleryImages/Hanmer_Rodney.jpg);
	background-repeat: no-repeat;
}
#Rotoiti {
	background-image: url(../images/GalleryImages/rotoiti.jpg);
	background-repeat: no-repeat;
}
#res1 {
	background-image: url(../images/GalleryImages/residential/res1.jpg);
	background-repeat: no-repeat;
}
#res2 {
	background-image: url(../images/GalleryImages/residential/res2.jpg);
	background-repeat: no-repeat;
}
#res3 {
	background-image: url(../images/GalleryImages/residential/res3.jpg);
	background-repeat: no-repeat;
}
#res4 {
	background-image: url(../images/GalleryImages/residential/res4.jpg);
	background-repeat: no-repeat;
}
#res5 {
	background-image: url(../images/GalleryImages/residential/res5.jpg);
	background-repeat: no-repeat;
}
#res6 {
	background-image: url(../images/GalleryImages/residential/res6.jpg);
	background-repeat: no-repeat;
}
#res7 {
	background-image: url(../images/GalleryImages/residential/res7.jpg);
	background-repeat: no-repeat;
}
#res8 {
	background-image: url(../images/GalleryImages/residential/res8.jpg);
	background-repeat: no-repeat;
}
#community1 {
	background-image: url(../images/GalleryImages/community/community1.jpg);
	background-repeat: no-repeat;
}
#community2 {
	background-image: url(../images/GalleryImages/community/community2.jpg);
	background-repeat: no-repeat;
}

#mid-col-cellA h1 {
	font-size: 12px;
	text-transform: uppercase;
	line-height: 28px;
	background-color: #000000;
	background-image: url(../images/header_bk.jpg);
	background-repeat: repeat-x;
	padding-left: 20px;
	margin-bottom: 0px;
	color: #CCCCCC;
}
#mid-col-cellA h2 {
	font-size: 12px;
	line-height: 18px;
	background-color: #000000;
	background-image: url(../images/header_arrow.jpg);
	background-repeat: no-repeat;
	margin-left: 24px;
	margin-bottom: 5px;
	background-position: right;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #4C4C4C;
	margin-bottom: 0px;
}
div#mid-col-cellA h2 a:link, div#mid-col-cellA h2 a:visited, div#mid-col-cellA h2 a:active {
	text-decoration: none;
	color: #FFFFFF;
}
div#mid-col-cellA h2 a:hover {
	text-decoration: none;
	color: #FF0000;
}
.box3 {
	width: 817px;
	border-left-width: 1px;
	border-left-style: dotted;
	border-left-color: #666666;
	padding-top: 15px;
	clear: both;
}
.innerbox_left {
	width: 100px;
	padding-left: 18px;
	float: left;
	color: #CCCCCC;
}
.innerbox_right {
	width: 680px;
	padding-left: 18px;
	float: left;
	clear: right;
	margin-bottom: 6px;
}
.custom {
	width: 382px;
	color: #FFFFFF;
}
.custom p {
	color: #FFFFFF !important;
}

div#bottom-frame div.innerbox_right p {
	line-height: 18px;
	margin-bottom: 10px;
}
body#portfolioSub div.sub_innerbox_left p {
	color: #CCCCCC;
}
body#portfolio div.innerbox_right p.hr-solid,
body#portfolioSub div.innerbox_right p.hr-solid {
	line-height: 1px;
	margin-bottom: 6px;
}

/*
 * --- PORTFOLIO SUB PAGES ---------------------------------------------
 */
body#portfolioSub #mid-col {
	width: 520px;
	clear: right;
}
body#portfolioSub #mid-col-frame {
	width: 518px;
	height: 338px;
	border: 1px solid #323232;
}
body#portfolioSub #right-col {
	width: 297px;
	float: left;
	clear: right;
}
#thumbs {
	width: 284px;
	height: 340px;
	margin-right: 0px;
	margin-left: auto;
}
.thumb-frame {
	width: 70px;
	height: 70px;
	padding: 5px;
	border: 1px solid #666666;
}
.thumb-frame a {
	cursor: default;
}

.sub_innerbox_left {
	width: 500px;
	padding-left: 18px;
	float: left;
}
div#bottom-frame div.sub_innerbox_left p {
	line-height: 18px;
	margin-bottom: 10px;
}
.sub_innerbox_right {
	width: 280px;
	padding-left: 18px;
	float: left;
	clear: right;
}
.infoBox {
	width: 268px;
	height: 41px;
	background-image: url(../images/button-BKground.jpg);
	background-repeat: no-repeat;
	margin-top: 15px;
	font-size: 11px;
	padding-top: 11px;
	padding-left: 10px;
}
.infoBox p {
	margin: 0px;
}
.infoBox p.txt-grey {
	font-size: 12px;
}

/*
 * --- 'COMMERCIAL' PORTFOLIO SUB PAGES ---------------------------------------------
 */
.hoverHide {
	display: none;
}
.hoverShow {
	display: block; 
}
.hoverShow h1 {
	text-transform: uppercase;
}

/*
 * --- ETHOS ---------------------------------------------
 */
body#ethos h1 {
	margin-bottom: 0px;
}
body#ethos .box3 {
	width: 598px;
}
body#ethos .innerbox {
	width: 598px;
}
body#ethos .box3 div.hr-solid {
	width: 616px;
}

/*
 * --- DESIGN ---------------------------------------------
 */
.flash-frame {
	border: 1px solid #666666;
	width: 358px;
	margin-left: 10px;
	margin-top: 10px;
}
div#mouseOver_col-left .innerbox {
	width: 395px;
	padding-left: 18px;
	float: left;
	clear: right;
	padding-right: 20px;
}
div#mouseOver_col-right {
	width: 382px;
	float: left;
	clear: right;
}
div#mouseOver_col-right div#thumbs {
	width: 382px;
	height: 340px;
	margin-right: auto;
	margin-left: 0px;
}
div#mouseOver_col-right div#thumbs .thumb-frame {
	width: 80px;
	height: 80px;
}

/*
 * --- SUSTAIN ---------------------------------------------
 */
div.image-box .thumb-frame {
	width: 115px;
	height: 115px;
	margin-left: auto;
	margin-right: 0px;
	margin-bottom: 12px;
}

/*
 * --- CONTACT ---------------------------------------------
 */
body#contact #mid-col-frame {
	width: 815px;
}
#contactLeft_cell {
	width: 158px;
	height: 298px;
	border-right: 1px dotted #666666;
	padding-left: 20px;
	padding-right: 230px;
	margin-top: 20px;
	float: left;
}

* html #contactLeft_cell {
	width: 157px;
}

#contactRight_cell {
	width: 322px;
	margin-left: 20px;
	margin-top: 20px;
	padding-top: 25px;
	float: left;
}
#contactTextCellA {
	color: #CCCCCC;
	width: 120px;
	float: left;
}
#contactTextCellB {
	width: 200px;
	float: left;
}
#contactTextCellA p, 
#contactTextCellB p {
	margin-bottom: 4px;
	font-size: 14px;
}
 
/*
/* Cursor Trail Pop-ups
*/
#trailimageid
{
	font-size: 0.75em;
	position: absolute;
	display: none;
	left: 0px;
	top: 0px;
/*  width: 400px;  */
	height: 0px;
	z-index: 200;
}
#trailWindow
{
	font-size: 0.75em;
	position: absolute;
	display: none;
	left: 0px;
	top: 0px;
	height: 0px;
	z-index: 200;
}