@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');

/* <weight>: Use a value from 100 to 900
<uniquifier>: Use a unique and descriptive class name

.montserrat-<uniquifier> {
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}


/* CSS RESET
===================================
/* 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, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}


/* END OF CSS RESET
=================================== */

@-ms-viewport { width:device-width; }
@viewport { width:device-width; }

html { font-size:62.5%; /* font-size 1em = 10px on default browser settings */ }
body, html { height:100%; }

body {
	background-color: rgba(255,255,255,1.0);
	font-family: "Montserrat", sans-serif;
	font-size:1.6rem;
}

h1, h2, h3, h4, h5, h6 { font-weight:700; hyphens:none; padding:0.2em 0; }

h1 { font-size:4rem; }
h2 { font-size:3.5rem; }
h3 { font-size:2.8rem; }
h4 { font-size:2.2rem; }
h5 { font-size:2rem; }
h6 { font-size:1.8rem; }


p { font-size:1.6rem; line-height:1.5em; font-weight:400; margin:0; padding:1em 0; color:#111; }
a { color:#035169; font-weight:700; text-decoration:none; transition:400ms; }
a:hover { color:#111; text-decoration:underline; }

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible { outline:3px solid #F27151; outline-offset:2px; }

b, strong { font-weight:700; }
em { font-style:italic; }

ul { padding:0 0 0 2em; margin:0; }
ul li { list-style-type:disc; padding:0.8em 0; }

ol { list-style-type:decimal; padding:0 0 0 2em; }
ol li { list-style-type:decimal; padding:0.8em 0; line-height:1.25em; }
ol ol { list-style-type:lower-alpha; }
ol ol li { list-style-type:lower-alpha; }

ul.holiday-list { padding:0; margin:0 0 1em; list-style-type:none; }
ul.holiday-list li { padding:0.4em 0.4em 0.4em 0; margin:0; list-style-type:none; display:inline-block; color:#fff; }

.single-post ul.holiday-list li { color:#333; }

table { margin:1em 0; }
table caption { font-weight:600; padding:0.8em; background-color: lightgray; }
table th { font-weight:600; }

figure { margin:1em 0; }

.center { text-align:center; }

.large-txt { font-size:2rem; }
.xl-txt { font-size:2.6rem; }

hr.wp-block-separator { border:none; width:100% !important; margin:3em; }

.flex { display:flex; }


/* Styles for the phone class on click to call links. Don't want these to look like links on the desktop version */
.phone { text-decoration:none; color:#444; font-weight:700; }
.phone:hover { text-decoration:none; }



/* Button Styles */
.btn a {
  padding:1em 2em;
  margin:0 auto;
  text-align:center;
  transition:300ms;
  border-radius:3rem;
  display:block;
}
.btn a:hover { text-decoration:none!important; }

.sm { width:30%; }
.md { width:50%; }
.lg { width:75%; }

.drkorange a { background-color:rgba(229,118,87,1.0); color:#000; }
.drkorange a:hover { background-color:rgba(150,51,23,1.0); color:#fff; }

.drkblue a { background-color: #164657; color: #fff !important; }
.drkblue a:hover { background-color:#000; }


/* TO THE TOP BUTTON */
#topbtn {
    display:none;
    position:fixed;
    bottom:2em;
    right:3em;
    z-index:999;
    background-color:rgba(3,81,105,1.0);
    color:#fff;
    padding:1em;
    border:none;
    border-radius:1em;
    cursor:pointer;
}
#topbtn svg { transform:translate(0, -20%) rotate(180deg); vertical-align:middle; width:1.6rem; }
#topbtn svg path { stroke:none; stroke-width:0 !important; fill:#fff; }


/* Home Page */
body.home article { background-image: url(/wp-content/uploads/2020/10/hi-bg-image-sm.jpg); background-repeat:no-repeat; background-position:50% 50%; background-size:cover; }
.hp { flex-direction:row; gap:2em; justify-content:center; align-items:flex-start; flex-wrap:nowrap; padding:2em 2em 0; }
.home .entry-content { background-color:rgba(255,255,255,0.9); padding:2em; width:65%; order:1; }

.home .side-col { width:30%; order:2; }
.home .side-col h2 { padding:1em 0 0; }



/* Header */
header { background-color:rgba(233,233,233,1.0); display:flex; flex-wrap:wrap; flex-direction:row; justify-content:space-between; align-items:center; padding:1em 2em 0; }
header #branding { order:1; width:15%; }
header #search { order:2; width:70%; text-align:right; }
header #menu { order:3; width:100%; }

#branding #site-title a {
	background-image:url(/wp-content/uploads/2020/10/hawaii811-logo.png);
    background-repeat:no-repeat;
    width:220px;
    height:0;
	padding:100px 0 0;
	overflow:hidden;
	display:block;
    font-size:1%;
    line-height:1%;
}


.search-field { padding:1em; font-size:1.4rem; height:auto; color:#666; border:1px solid #ccc; width:80%; }
.search-submit { background-color:#164657; border:none; padding:1em; font-size:1.4rem; font-weight:600; color:#fff; text-transform:uppercase; }

.menu > li:focus-within > ul.sub-menu { opacity:1; pointer-events:auto; }

.menu .current-menu-item > a,
.menu .current-menu-ancestor > a { text-decoration:underline; text-underline-offset:4px; }


.menu { display:flex; flex-direction:row; justify-content:space-between; width:100%; padding:0; margin:0; list-style-type:none; }
#menu-item-33 .sub-menu { left:auto; right:0; }
.sub-menu { display:none; position:absolute; top:4em; left:0; background-color:#164657; width:320px; padding:0; margin:0; list-style-type:none; z-index:200; }
.menu li:hover .sub-menu { display:block; }

.menu li { position:relative; padding:0; margin:0; list-style-type:none; }
.menu li a { font-size:1.4rem; line-height:1.5em; color:#111; text-transform:uppercase; display:block; padding:2em; word-wrap:break-word; hyphens:none; }
.menu li a:hover { background-color:#164657; color:#fff; text-decoration:none; }


.menu .current-page-parent a { background:#164657; color:#fff; }
.menu li.current-menu-item a { background:#164657; color:#fff; }


.sub-menu li { padding:0; margin:0; list-style-type:none; }
.sub-menu li a { color:#fff; }
.sub-menu li a:hover { background-color:#3897b8; }

.menu .current-page-parent .sub-menu .current-menu-item a { background-color:#3897b8; color:#fff; }



/* Mobile Nav */
.hamburger-container,
.menu-mobile-menu-container,
#nav-toggle { display:none; }

.hamburger-container { position:fixed; left:0; top:0; width:100%; background-color: #164657; z-index:220; }

.hamburger-container label { cursor:pointer; display:flex; flex-direction:row; align-items:center; flex-wrap:nowrap; gap:1em; padding:1em; }
.hamburger-container label .menu-txt { font-size:1.6rem; font-weight:600; color:#fff; display:block; text-transform:uppercase; }

.hamburger-container label .navigation_icon { position:relative; margin:0; }

.hamburger-container label .navigation_icon,
.hamburger-container label .navigation_icon::before,
.hamburger-container label .navigation_icon::after {
    display:block;
    width:3rem;
    height:3px;
    background-color:#fff;
}

.hamburger-container label .navigation_icon::before,
.hamburger-container label .navigation_icon::after {
    content:'';
    position:absolute;
    left:0;
    transition:all 200ms;
}

.hamburger-container label .navigation_icon::before { top:-1rem; }
.hamburger-container label .navigation_icon::after { top:1rem; }


.navigation_checkbox:checked+#navigation_button .navigation_icon { background-color:transparent; }
.navigation_checkbox:checked+#navigation_button .navigation_icon::before { top:0; transform:rotate(135deg); }
.navigation_checkbox:checked+#navigation_button .navigation_icon::after { top:0; transform:rotate(-135deg); }


.menu-mobile-menu-container.active { width:100%; padding:0 2em;  background-color: #164657; position:fixed; top:3em; z-index:200; display:block; }

.menu-mobile-menu-container button { background-color:transparent; border:none; color:#fff; font-size:2rem; }


.menu-mobile-menu-container.active .mobile { display:block; padding:1em 0; }
.menu-mobile-menu-container ul { list-style-type:none; padding:0; margin:0; }
.menu-mobile-menu-container ul li { list-style-type:none; display:flex; flex-direction:row; justify-content:space-between; flex-wrap:wrap; }
.menu-mobile-menu-container ul li a { color:#fff; font-size:2rem; }
.menu-mobile-menu-container ul li a:hover { text-decoration:none; }

.menu-mobile-menu-container .sub-menu { position:relative; top:0; background-color:#0c2c38; width:100%; padding:0; }
.menu-mobile-menu-container .sub-menu li { }
.menu-mobile-menu-container .sub-menu li a { font-size:1.6rem; padding:1em; width:100%; text-decoration:none; }
.menu-mobile-menu-container .sub-menu li a:hover { text-decoration:none; }

.mobile .current-menu-item > a,
.mobile .current-menu-ancestor > a { text-decoration:underline; text-underline-offset:4px; }

.mobile .current-page-parent .sub-menu .current-menu-item a { background-color:#3897b8; color:#fff; }



/* Flex Items */
.half { flex-direction:row; gap:4em; justify-content:space-between; flex-wrap:nowrap; }
.half > div { width:50%; }

.buttons { flex-direction:row; gap:2em; flex-wrap:wrap; }
.buttons p { width:45%; }

.videos { flex-direction:row; flex-wrap:wrap; gap:2em; margin:2em 0; }
.videos div { flex-basis:40%; }
.videos div h3 { margin:0 0 1em; }

.locators { flex-direction:row; gap:4em; flex-wrap:wrap; }
.locators div { flex-basis:25%; }

.person { flex-direction:row; gap:4em; flex-wrap:wrap; margin:3em 0 0; }
.person div { width:30%; }

.generic { flex-direction:row; flex-wrap:wrap; }
.generic div { width:40%; }

.location { flex-direction:row; flex-wrap:nowrap; gap:4em; }
.location .info { order:2; flex-basis:30%; }
.location .form { order:1; flex-basis:60%; }


/* Secondary Pages */
article header { background-color:transparent; display:inline-block; padding:0; }


.entry-content { padding:5vw; }
.content-extra { background-color:#ddd; padding:2em; }



.seminars { background-color:rgba(36,124,132,0.95); box-shadow:1px 2px 6px rgba(0,0,0,0.6); padding:1.5em; color:#fff; text-align:center; }
.seminars p { color:#fff; padding:0.5em 0; }

.seminar-table { width:100%; }
.seminar-table th, .seminar-table td { padding:1em; text-align:left; border:1px solid #999; }





.cta { margin:0 0 1em; }
.cta h2 { font-size:2.8rem; }
.cta a { background:#164657; box-shadow:1px 2px 6px rgba(0,0,0,0.6); padding:1em 2em; display:block; color:#fff; text-decoration:none; line-height:1.25em; text-align:center; }
.cta a:hover { background:#111; }
.cta a em { font-size:1.8rem; font-weight:300; font-style:normal; display:block; }




.online-dashboards { background-color: rgb(201, 227, 235, 1.0); display:flex; flex-direction:row; flex-wrap:wrap; justify-content:center; align-items:center; padding:2em; }

.online-dashboards div.img { width:30%; }
.online-dashboards div.content { width:40%; padding:2em; }
.online-dashboards .btn a { font-size:1.8rem; text-transform:uppercase; }



.white { background-color:#fff;  padding:1em; border:1px solid #333; color:#000; text-transform:uppercase; font-weight:700; }
.pink { background-color:#f9c; padding:1em; border:1px solid #333; color:#000; text-transform:uppercase; font-weight:700; }
.red { background-color:#a71f1f; padding:1em; border:1px solid #333; color:#fff; text-transform:uppercase; font-weight:700; }
.yellow { background-color:#ff0; padding:1em; border:1px solid #333; color:#000; text-transform:uppercase; font-weight:700; }
.orange { background-color:#f90; padding:1em; border:1px solid #333; color:#000; text-transform:uppercase; font-weight:700; }
.blue { background-color:#1a3d7a; padding:1em; border:1px solid #333; color:#fff; text-transform:uppercase; font-weight:700; }
.purple { background-color:#90f; padding:1em; border:1px solid #333; color:#fff; text-transform:uppercase; font-weight:700; }
.green { background-color:#155d1a; padding:1em; border:1px solid #333; color:#fff; text-transform:uppercase; font-weight:700; }


 details {
    width:100%;
    padding:1em 0;
    margin:1em 0;
    border-bottom:2px dotted #ccc;
}
details summary {
    cursor:pointer;
    width:100%;
	position: relative;
	display: flex;
	flex-direction: row;
	align-items: center;
}

summary p { order:2; width:95%; }
summary::before { content:"\002B"; font-size:3rem; order:1; width:4%; margin:0 1em 0 0; }
summary::marker { list-style:none; }


.registration {
    display:flex;
    flex-direction:row;
    justify-content:flex-start;
    flex-wrap:wrap;
    gap:2em;
    margin:1em 0;
    padding:0;
    list-style-type:none;
}
.registration  li { list-style-type: none; margin:0; padding:0; }

.registration li a {
    padding:1em;
    font-size:2rem;
    background-color:#164657;
    color:#fff;
    text-decoration:none;
    transition:300ms;
    display:block;
}
.registration li a:hover,
.registration li.current-menu-item a { background-color: #3897b8; }

/* LAZY LOAD YOUTUBE VIDEO FALLBACK STYLES */
.lite-youtube-fallback {
	aspect-ratio:16 / 9; /* matches YouTube player */
	display:flex;
	justify-content:center;
	align-items:center;
	flex-direction:column;
	gap:1em;
	padding:1em;
	background-color:#000;
	color:#fff;
	text-decoration:none;
}

/* right-facing triangle "Play" icon */
.lite-youtube-fallback::before {
	display:block;
	content: '';
	border:solid transparent;
	border-width:2em 0 2em 3em;
	border-left-color:red;
}

.lite-youtube-fallback:hover::before { border-left-color:#fff; }

.lite-youtube-fallback:focus { outline:2px solid red; }





/* Single Post Page - Random One Page */

.single-post article, .error404 article { padding:5vw; min-height:65vh; }
.single-post .entry-content, .error404 .entry-content { padding:0; }

.single-post article h1 { padding:1em 0; }





/*
======================
FORMS
======================
*/

.forminator-required { color:red; }
.forminator-error-message { font-size:1.2rem; background-color:#f9e4E8; color:#e04562; display:block; padding:1em; }

.forminator-response-message.forminator-show.forminator-success { background-color:beige; padding:1em; margin:0 0 1em; outline:none; }
.forminator-response-message.forminator-show.forminator-success:focus, .forminator-response-message.forminator-show.forminator-success:active { outline:none; }
.forminator-response-message.forminator-show.forminator-success p { color:#333; padding:1em; }


.forminator-row button.forminator-button { background-color:#164657; text-decoration:none; transition:400ms; color:#fff; font-size:2rem; font-weight:600; padding:1em; border:none; }
.forminator-row button.forminator-button:hover { background-color:#3897b8; text-decoration:none; }

.forminator-row .forminator-field label { margin:1em 0; display:block; }
.forminator-row .forminator-field input.forminator-input { border:1px solid #ccc; padding:1em; width:100%;; }

.forminator-row .forminator-field-radio .forminator-label { padding:0 0 0.5em; display:block; }


.law { border:1px solid #ccc; padding:1em; margin:1em 0; }




/* Search Page */
.search article { padding:2em 5vw; }
.search header.header { background-color:transparent; display:block; padding:2em 5vw; }


.extra-info {
    background-color:#01837B;
    background-image:url(/wp-content/uploads/2021/01/palm-tree.png);
    background-repeat:no-repeat;
    background-position:0 0;
    display:flex;
    flex-direction:row;
    justify-content:center;
    gap:4em;
    padding:2em;
    position:relative;
}
.palm-tree { position:absolute; left:0; bottom:0; }
.extra-info div { width:45%; }
.extra-info div h2 { color:#fff; padding:0 0 1em; font-size:2.2rem; }
.extra-info div p { font-size:1.4rem; color:#fff; padding:0 0 1em; }
.extra-info div a { color:#fff; }
.extra-info div a:hover { color:#111; }


footer { background-color: rgba(0,0,0,1.0); color:#fff; text-align:center; padding:2em; }

.menu-bottom { margin:0 0 1em; }

.social-media, .social-media li { list-style-type: none; padding:0; margin:0; }

footer .social-media .fb a {
	background-image: url(/wp-content/uploads/2026/04/facebook-ico.png);
	background-repeat: no-repeat;
	background-position: 50% 100%;
	padding:0 0 2em;
	display:block;
	color:#fff;
	text-decoration:none;
}

#copyright { font-size:1.3rem; }