/*  public/css/kualono_main3.css
	created by kaliko 2016-01-01
	mod by kaliko 2017-01-03, 2016-11-25, 2016-01-01 */

/* css reset - mahalo iā eric meyer
   http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126, License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section { display: block; }
body { line-height: 1; }
ol { margin-left: 2rem; }
ul { list-style: none; margin-left: 2rem; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
table { border-collapse: collapse; border-spacing: 0; }

.cf:before,.cf:after{content:"";display:table}.cf:after{clear:both}.cf{zoom:1}
/* Kualono v3.0 */
html { }
body {
	background: #fff url(../img/bg_body.jpg) top left no-repeat;
	font-family: "Arial", "Arial Sans Unicode", "Arial Unicode MS", Helvetica, Arial, sans-serif;
	font-size: 16px;
	line-height: 1.429;
	margin: 0;
	padding: 0;
	text-align: left;
	}

img { border: none; }

h2, h3, h4, h5, h6 { font-weight: 400; line-height: 1.1; margin-bottom: 0.8rem; }
h2 { font-size: 1.4rem; font-weight: 600; color:#B4211C; line-height: 1.2em; margin: 0 0 10px 0; padding: 0; }
h3 { font-size: 1.2rem; font-weight: 600; color: #333; margin: 20px 0 0 0; padding: 0;  }
h4 { font-size: 1.1rem; color: #333; margin: 20px 0 0 0; padding: 0;  }

nav { width: 20%; margin-top: 10px; }

article {
	font-size: 1.2rem;
	display: block;
	float: left;
	width: 80%;
	position: absolute;
	left: 22%;
	top: 160px;
	clear: both;
}

::-moz-selection { background: #F6CF74; color: #fff; }
::selection { background: #F6CF74; color: #fff; }

details { margin-top: 30px;}
summary { font-size: 15px; font-weight: bold; color: #2d7944; margin: 0; padding: 0;}
strong { font-weight: 600; }

#wrapper { margin: 0; padding: 0;  }

#head { margin: 46px 0 0 20px; width: 97%; height: auto;  }
#head a.inoakahua { font-family: 'Oswald'; font-size: 3.8rem; font-weight: 700; color: #B4211C; margin: 0 20px 0 6px; text-decoration: none; }
#head span.inoakula { font-size: 1.5rem; color: #B4211C; margin: 0; }


#content { }
#content p { margin-bottom: 1.5rem; }
#content a { color: #A51E1A; }
#content a:hover { color: #FF0000; border-bottom: 1px solid #ccc; }
#content li { margin-bottom: 1em; }
#content img { border: none; width: auto; max-width: 100%; height: auto; }
#content img.bordergrey { border: 1px solid #ccc; width: auto; }

/* will deprecate in future version. */
.kino, .narrowcolumn, .widecolumn { clear: left; display:inline; }
td.td2 p.p2 { margin-left:4px; }
div#toolTip { }
div#toolTip p { }
div#toolTip p em { }

/* content */

#content .haw
{	clear: left;
	width: 45%;
	float: left;
	margin-bottom:6px;
	padding-right:2%;
}
#content .eng
{
	width: 45%;
	float: left;
	margin-bottom:6px;
	padding-right:2%;
	padding-left:1%;
	margin-right: 3px;
}

#content .wide
{	clear: left;
	width: 98%;
	float: left;
	margin-bottom: 6px;
}

#content .single-lang
{	clear: left;
	width: 80%;
	float: left;
	margin-bottom: 6px;
}

#content h3 { margin: 2rem 0 1rem 0 }

ul.disced li {
	list-style: disc;
	list-style-type: disc;
	margin-left: 2rem;
}

#content img.kiilele {
	width: 38%;
	float: right;
	margin-left: 2rem;
	margin-top: 1rem;
	margin-bottom: 2rem;
}

#content > div.kwo > div.para-fake-list > div > div.haw > p {
	margin-left: 1.4em;
	text-indent: -1.4em;
}

#content > div.kwo > div.para-fake-list > div > div.eng > p {
	margin-left: 1.4em;
	text-indent: -1.4em;
}


/* sidebar nav */
#nav { font-size: 1.0rem; color: #666; background: #F2F4F7; }
#nav ul { margin: 0; padding: 22px 0 0 14px; list-style: none; line-height: auto; }
#nav .nav-cat-title { color: #C4241F; font-weight: bold; display: block; padding: 8px 0px 2px 0px; border-bottom: 1px solid #DBB3AB;}
#nav .subitem { color: #333; font-weight: normal; padding: 2px 0px 2px 16px; }
#nav .subitem a { color: #444; text-decoration: none; }
#nav .subitem a:hover { text-decoration: underline; }

/* special top of page red sub-section navs */
#subnav { 
	margin: 0 0 18px 0;
	padding: 4px;
	font-size: 1rem;
	line-height: 2rem;
	}
	
#subnav.sn-red {
	background-color: rgba( 180, 33, 28, 0.2 );
	}

#subnav.sn-blue {
	background-color: rgba( 49, 91, 218, 1.0 );
	}
	
#subnav ul {
	margin: 0 20px 0 5px;
	padding: 0;
	list-style: none;
	}
#subnav ul li{ display: inline;
	margin: 0;
	padding: 0 8px;
	border-right: 1px solid rgba(0, 0, 0, 0.5);
	}

#subnav ul li:last-of-type { 	border-right: none; }

#subnav.sn-red a { font-weight: bold; color: rgb(163, 30, 25); }

#subnav.sn-blue a { font-weight: bold; color: white; }
p#kwo-subnav-title {
	color: rgba( 49, 91, 218, 1.0 );
	font-size: 1.5rem;
	margin-bottom: 0px;
	}

/* no Kahuawaiola wale nō */
#content .kwo-page-links-block {list-style-type: decimal; font-size: .9em; line-height: 2em; width:90%; color:#476EDE; border-bottom: 1px solid #476ede;}
#content .kwo-page-links-block li a { color: #476EDE; }

#content .kwo h2 {color:#476EDE;}
#content .kwo a { color: #476EDE; }

/* no Kahuawaiola > Kumuwaiwai site gallery wale nō */
#content .weblink2 {
	border-collapse: separate;
	height: auto;
	text-align: center;
	position: static;
	display: inline-table;
	width: 250px;
	margin: 10px;
	padding: 10px;
	z-index: 0;
	border-width: 1px;
	border-style: groove;
	background-color: #ccffff;
	overflow: auto;
	font-size: 0.8em;
}

#content .weblink {
	border-collapse: separate;
	height: auto;
	text-align: center;
	position: static;
	display: inline-table;
	width: 250px;
	margin: 10px;
	padding: 10px;
	z-index: 0;
	text-overflow: clip;
	border-width: 1px;
	border-style: groove;
	background-color: #ffffcc;
	font-size: 0.8em;
}

/* main page footer */
footer {
	height: 50px;
	clear:both;
	background: rgba(0, 0, 0, 0.5);
	font-size: 0.8rem;
	color:#fff;
	text-align: right;
	margin: 0;
	padding: 20px 10px;
	border-top: 1px solid #eee;
display: none;
}

/* fix the footer */
html, body { height: 100%; }

#wrapper { min-height: 100%; }

#content {
	overflow: auto;
	padding-bottom: 50px;
	}  /* must be same height as the footer */


/* kekahi mau mea hou aku ma ke kekona hope loa */
.notice { background-color: rgba(253,231,144,0.61); padding: 2px; }
.bolded { font-weight: bold; }
.leed_green { color: #3e9341; } 

/* media css */

@media screen and (max-width: 700px) {
	nav {width:auto;}
	article {
	font-size: 1.0rem;
	left: 1rem;
	width:auto;
	position: relative;
	top: 2rem;
	}
	#head span.inoakula { display: none; }
}

@media print {
    div#nav {display: none; visibility: collapse;}
    article {
	font-size: 1.0rem;
	left: 1rem;
	width:auto;
	}
	img.backtotop {display: none;}
}