@charset "UTF-8";
/* CSS Document */

/* STYLE GUIDE ----------------------------- 

colors:
	#173f74				dark blue
	#7d7d7d				dark gray
	#af1f24				solar red
	#818285				materials gray
	#0072bc				fc blue

fonts:
	Arial				1st Primary
	Helvetica			2nd Primary
	Verdana				3rd Primary
	Sans-Serif			4th Primary

/* END ------------------------------------- */


/* HOKU CORP ------------------------------- */

div#hokucorp{
	margin:0 auto;
	width:825px;
	background-color:#fff;

}

div#hokucorp .breadcrumb{
	font-size:10px;
	margin:15px 0 0 10px;

}

div#hokucorp .breadcrumb li{
	list-style:none;
	display:inline;
	padding-right:3px;
}

div#hokucorp .breadcrumb .mark{
	background:url(../../assets/images/icon/breadcrumb_arrow.gif) no-repeat;
	padding-left:18px;
}

div#hokucorp .content-mgr{}

/* LEFT CONTENT ----------------------------------- */

div#hokucorp .left-content{
	background-color:#ebebeb;
	border-bottom:5px solid #d7d7d7;
	margin:25px 0 30px 25px;
	width:225px;
	
}

div#hokucorp .left-content h1{
	font-size:14px;
	color:#fff;
	background-color:#1d516a;
	border-bottom:1px solid #fff;
	border-top:1px solid #fff;
	padding:7px 0 7px 15px;
	margin:0;
	
}


div#hokucorp .left-content .news-events{
	padding:15px;

}



/* RIGHT CONTENT ----------------------------------- */

div#hokucorp .right-content{
	float:right;
	padding:25px 25px 30px 0;
	width:520px;

}

div#hokucorp .right-content img{
	float:left;
	margin:0 12px 5px 0;
}

div#hokucorp .right-content .company-overview{}
div#hokucorp .right-content .company-overview .division{
	float:right;
	width:135px;
	
}

div#hokucorp .right-content .company-overview .division img{
	display:block;
	width:125px;
	height:67px;
	border:1px solid #ccc;
	padding:1px 3px 2px;
	margin-bottom:10px;
	

}

div#hokucorp .right-content .company-overview .desc{
	float:left;
	width:365px;
	
}

div#hokucorp .right-content .timeline{
	margin-top:25px;
	border-top:1px solid #d7d7d7;
	padding:15px 0;
}

div#hokucorp .right-content .timeline img{
	float:right;
	margin:0 0 0 15px;
	border:1px solid #ccc;
	padding:4px;

}



/* DEFAULT OPEN LAYOUT ----------------------------------- */
div#hokucorp .open-layout{
	padding:25px 25px 10px;

}


/* DEFAULT TWO-COLUMN LAYOUT ----------------------------------- */
div#hokucorp .two-layout{
	padding:25px 25px 10px;

}

div#hokucorp .two-layout .timeline{
	margin-top:25px;
	border-top:1px solid #d7d7d7;
	padding:15px 0;
}

div#hokucorp .two-layout .timeline img{
	float:right;
	margin:0 0 0 15px;
	border:1px solid #ccc;
	padding:4px;

}


div#hokucorp .two-layout .sect-a{
	width:620px;
	
}

div#hokucorp .two-layout .sect-b{
	float:right;
	width:135px;
}

div#hokucorp .two-layout .sect-b img{
	padding:5px;
	border:1px solid #ccc;
	margin-bottom:10px;
	
}


/* DEFAULT TWO-COLUMN WIDE LAYOUT  ----------------------------------- */
div#hokucorp .two-layout-wide{
	padding:25px 25px 10px;
	
}

div#hokucorp .two-layout-wide .sect-c{
	float:right;
	width:300px;
	margin-left:35px;
	-margin-right:32px;
}

div#hokucorp .two-layout-wide .sect-d{
	margin-right:335px;
}




/* DEFAULT THREE-COLUMN LAYOUT ----------------------------------- */
div#hokucorp .three-layout{
	padding:10px 25px 30px;
	
}

div#hokucorp .three-layout .sect-1{
	float:right;
	width:235px;
	padding:10px;
	border:1px solid #ccc;
	
}

div#hokucorp .three-layout .sect-2{
	float:left;
	width:235px;
	padding:10px;
	border:1px solid #ccc;
	
}

div#hokucorp .three-layout .sect-3{
	margin:0 265px;
	padding:10px;
	border:1px solid #ccc;
	
}




/* END ------------------------------------- */




/* MAP ----------------------------------- */

div#map{
	padding:10px 15px 0;
	border-top:5px solid #005764;
	
}


/* END ----------------------------------- */



/* TIMELINE ----------------------------------- */

div#timeline{
	width:775px;
	height:575px;
	margin:25px 0 15px;
	
}

div#timeline .left_navigation{
	float:left;
	width:150px;
	margin-right:35px;
	-margin-right:32px;
	padding:15px 15px 5px;
	background:#f4f4f4;
	border:1px solid #e5e5e5;
	
	
}

div#timeline .left_navigation h2{
	margin-top:0;
	border-bottom:1px solid #e5e5e5;
}

div#timeline .left_navigation ul{
	margin-left:10px;
	padding-bottom:15px;
	
}


div#timeline .right_image{ height: 575px;}


div#timeline_date{}
div#timeline_date h2{
	margin:0 0 10px;
}
div#timeline_date img{
	display:block;
	border:1px solid #e5e5e5;
	padding:5px;
	
}

div#flashcontent{}




/* END ----------------------------------- */


/* CLASSES ----------------------------------- */

.self-clear{
	overflow:hidden;
}

* * body .self-clear{
	height:1%;
}

.clear{
	clear:both;

}


.line-break{
	display:block;
	border-top:1px solid #d7d7d7;
	padding:15px 0 0;
	margin-top:5px;
		
}

.gray-border{
	border:2px solid #e5e5e5;
	background-color:#f7f7f7;
	padding:15px 18px 5px;
	margin-top:25px;
	
}

.gray-border h2{
	margin-top:0;
	
}

.button{
	color:#fff;
	background-color:#1d516a;
	border:1px solid #1d516a;
	padding:1px 4px;

}

.button a{
	color:#fff;
	background-color:#1d516a;
	border:1px solid #1d516a;
	padding:6px 10px;

}

.button a:hover{
	background-color:#006470;
	border:1px solid #1d516a;
}


.lt-bg{
	background-color:#ebebeb;
	padding:10px 15px;
	
}

.caption{
	font-size:10px;
	color:#666;
	padding:5px 5px 15px;
}

.highlight{
	color:#f26521;
}

.indent{
	text-indent:8px;
}


/* EXPANDO ----------------------------------- */

.expando{}
.expando ul{
	margin:0;
	padding:0;
}
.expando li{
	padding:0 0 5px;
	list-style:none;
}

.expando li li{
	list-style:square;
	margin-left:15px;
	padding-left:0;
}

.expando img{
	float:right;
	margin:0 0 10px 25px;
}

.expando .expando-open{
	background:url(../../assets/images/icon/minus.gif) no-repeat left;
	padding-left:13px;
}		

.expando .expando-closed {
	background:url(../../assets/images/icon/plus.gif) no-repeat left;
	padding-left:13px;
}
/* END ------------------------------ */



/* ICON CLASSES ------------------------------ */

.icon {
	background-repeat:no-repeat;
	background-position:0 auto;
	text-decoration:none;
	padding:0 14px;
	
}

.icon.blue-arrow{
	background-image:url(../../assets/images/icon/arrow.gif);
}

.icon.time-line{
	background-image:url(../../assets/images/icon/time.gif);
}

.icon.email-alert{
	background-image:url(../../assets/images/icon/news.gif);
	
}
.icon.back-up{
	background-image:url(../../assets/images/icon/up-arrow.gif);
	margin:50px 25px 0;
}
.icon.download{
	background-image:url(../../assets/images/icon/download.gif);
}
.icon.print{
	background-image:url(../../assets/images/icon/print.gif);
}
.icon.mail{
	background-image:url(../../assets/images/icon/mail.gif);
}
.icon.pdf{
	background-image:url(../../assets/images/icon/adobe_icon.gif);
}
.icon.briefcase{
	background-image:url(../../assets/images/icon/briefcase.gif);
}
.icon.audio{
	background-image:url(../../assets/images/icon/audio.gif);
}


/* SHAREHOLDERS.COM CLASSES OVERRIDE ------------------------------ */
.contentlink{
	font-weight:bold;
}
/* END ------------------------------ */


/* END ------------------------------ */

/* FOOTER ------------------------------ */

div#footer{
	padding:10px;
	margin-top:25px;
	border-top:2px solid #1d516a;

}


div#footer p{
	font-size:10px;
	
}

div#footer a{
	font-size:10px;
}


































