/* =TITLESEARCH
====================================================================== */
#titleSearch { margin-bottom: 5rem; }

#titleSearch h1 { font-size: 2.4rem; margin-top: 1rem; margin-top: 2rem; }

#titleSearch h1 .olelo { display: block; font-size: 7rem; margin-top: -1rem; }

#titleSearch .input-group { margin-top: 2rem; }

#titleSearch .input-group input { font-size: 2rem; }

#titleSearch .input-group button { padding-left: 2rem !important; padding-right: 2rem !important; font-size: 2.2rem; }

#titleSearch .linksBelowSearch { margin-top: 1rem; font-size: 1.6rem; }

@media (min-width: 768px) { #titleSearch { margin-top: 8rem; margin-bottom: 20rem; } #titleSearch h1 { color: white; font-family: 'Montserrat', sans-serif; } #titleSearch h1 span:nth-child(2) { display: block; font-size: 8rem; margin-left: 2rem; } #titleSearch h1 span:nth-child(3) { margin-left: 4rem; } #titleSearch .input-group { margin-left: 4rem; } #titleSearch .linksBelowSearch { margin-left: 4rem; color: white; } #titleSearch .linksBelowSearch a { color: white; font-size: 1.8rem; } }

/* =HOME SECTIONS
====================================================================== */
#indexContent #homeFooter, #indexContent section { padding-bottom: 18rem; position: relative; z-index: 100; }

#indexContent #homeFooter .clip, #indexContent section .clip { position: absolute; width: 100%; clip-path: polygon(0 30%, 100% 20%, 100% 100%, 0 100%); top: -20rem; height: 40rem; }

#indexContent #homeFooter h2, #indexContent section h2 { font-family: 'Montserrat', sans-serif; font-size: 4rem; margin-bottom: 3rem; color: white; }

#indexContent #homeFooter .tile, #indexContent section .tile { text-align: center; color: #333333; padding-top: 0.75rem; text-decoration: none; opacity: 0.8; transition: all 0.2s ease-out; margin-top: 3rem; font-family: 'Montserrat', sans-serif; }

#indexContent #homeFooter .tile span:first-child, #indexContent section .tile span:first-child { font-size: 5rem; margin-bottom: 1rem; --fa-primary-opacity: 0.60; }

#indexContent #homeFooter .tile span:last-child, #indexContent section .tile span:last-child { font-size: 2rem; display: block; }

#indexContent #homeFooter .tile:hover, #indexContent section .tile:hover { opacity: 1; transition: all 0.2s ease-out; }

#indexContent #homeFooter .hoverEffect, #indexContent section .hoverEffect { top: 0; box-shadow: none; transition: all 0.2s ease-out; transition-property: top, box-shadow; }

#indexContent #homeFooter .hoverEffect:hover, #indexContent section .hoverEffect:hover { top: -4px; box-shadow: 0px 4px 8px rgba(38, 38, 38, 0.2); transition: all 0.2s ease-out; transition-property: top, box-shadow; }

#indexContent #homeFooter .sectionBg, #indexContent section .sectionBg { position: absolute; top: -15rem; right: 0; width: 25rem; height: 25rem; background-repeat: no-repeat; background-size: contain; z-index: -5; }

#indexContent #homeFooter .okina, #indexContent section .okina { font-family: 'Mali', cursive; }

#indexContent #homeFooter a.anchor, #indexContent section a.anchor { display: block; position: relative; top: -15rem; visibility: hidden; }

#indexContent #homeFooter #bgCredit, #indexContent section #bgCredit { display: none; }

#indexContent section:first-child { padding-top: 0; }

@media (min-width: 768px) { #indexContent #homeFooter, #indexContent section { padding-top: 5rem; padding-bottom: 15rem; } #indexContent #homeFooter .clip, #indexContent section .clip { clip-path: polygon(0 50%, 100% 20%, 100% 100%, 0 100%); } #indexContent #homeFooter .sectionBg, #indexContent section .sectionBg { top: -24rem; width: 40rem; height: 40rem; } #indexContent #homeFooter #bgCredit, #indexContent section #bgCredit { display: block; color: #FFF; margin-bottom: 1rem; } #indexContent #homeFooter #bgCredit span, #indexContent section #bgCredit span { display: block; } }

@media (min-width: 992px) { #indexContent #homeFooter, #indexContent section { padding-top: 15rem; padding-bottom: 25rem; } #indexContent #homeFooter .sectionBg, #indexContent section .sectionBg { width: 70rem; height: 70rem; } }

/* =HOME
====================================================================== */
#home { background-color: transparent; }

#home .card { margin-bottom: 3rem; }

#home .card h3 { font-size: 3rem; font-family: 'Montserrat', sans-serif; }

#home .card h4 { font-size: 2rem; font-family: 'Montserrat', sans-serif; }

#home #home-latestNews { font-size: 1.8rem; background-color: rgba(255, 255, 255, 0.9); }

#home #home-latestNews .list-group-item { background-color: transparent; }

#home #home-latestNews .newsItem .newsTitle { display: block; font-size: 1.8rem; }

#home #home-latestNews .newsItem .newsInfo { display: block; margin-bottom: 1rem; }

#home #homeLinks .homeLink { position: relative; text-align: center; background-color: #207fa1; border-radius: 0.25rem; display: block; padding: 1.5rem 1rem; color: white; margin: 0.5rem; text-decoration: none; transition: all 0.2s ease-out; }

#home #homeLinks .homeLink span { font-weight: bold; }

#home #homeLinks .homeLink span:first-child { font-size: 4rem; margin-bottom: 1rem; }

#home #homeLinks .homeLink span:last-child { display: block; font-size: 1.6rem; }

#home #homeLinks .homeLink:hover { background-color: #16576e; transition: all 0.2s ease-out; }

#home #home-governor { min-height: 20rem; background-repeat: no-repeat; background-size: 20rem auto; background-position: right bottom; background-color: #207fa1; border-bottom-right-radius: 0; text-decoration: none; transition: all 0.2s ease-out; }

#home #home-governor h3 { color: white; font-size: 3rem; text-decoration: none; }

#home #home-governor span { margin-top: 2rem; color: white; font-size: 2.2rem; padding-right: 15rem; display: block; }

#home #home-governor:hover { background-color: #16576e; transition: all 0.2s ease-out; }

#home #covid19 { background-color: #F5D25A; min-height: 15rem; background-size: 13rem; background-position: 1rem 1rem; background-repeat: no-repeat; text-decoration: none; transition: all 0.2s ease-out; }

#home #covid19 h3 { margin-left: 150px; color: #000; font-size: 3rem; text-decoration: none; }

#home #covid19 span { margin-top: 2rem; margin-left: 150px; color: #000; font-size: 2.2rem; display: block; }

#home #home-charting { min-height: 10rem; background-color: #B75340; text-decoration: none; transition: all 0.2s ease-out; }

#home #home-charting img { height: 8rem; float: left; margin-right: 2rem; }

#home #home-charting h4 { color: white; font-size: 2rem; text-decoration: none; }

#home #home-charting:hover { background-color: #873e2f; }

#home #home-weather { -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; overflow-x: hidden; color: white; text-decoration: none; position: relative; }

#home #home-weather .island { margin-top: 2rem; }

#home #home-weather .island .islandName { font-weight: bold; display: block; font-size: 1.8rem; }

#home #home-weather .island .islandDegree { font-size: 2.5rem; font-weight: bold; }

#home #home-weather .badge { font-size: 1.3rem; }

#home #home-surf { -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; overflow-x: hidden; color: white; text-decoration: none; position: relative; }

#home #home-surf .forecast { font-size: 1.5rem; }

#home #home-surf .island { margin-top: 2rem; }

#home #home-surf .island .islandName { font-weight: bold; display: block; font-size: 1.8rem; }

#home #home-surf .island .islandForecast { font-size: 2.5rem; font-weight: bold; }

#home #home-surf .badge { font-size: 1.3rem; }

#home .sectionBg { top: 30rem !important; }

#home #home-popularServices { background-color: rgba(255, 255, 255, 0.9); }

#home #home-popularServices .list-group-item { background-color: transparent; }

#home #home-popularServices .serviceItems .serviceItem .serviceName { font-size: 1.8rem; display: block; }

#home #home-popularServices .serviceItems .serviceItem .serviceInfo .serviceCount { font-size: 4rem; font-weight: bold; }

#home #home-popularServices .serviceItems .serviceItem .serviceInfo small { font-size: 1.44rem; }

#home #twitterFeeds { min-height: 1689px; margin-top: 3rem; }

#home .clip { background-color: white; z-index: -5; top: 10% !important; width: 100%; }

#home .homeBg { position: absolute; z-index: -5; height: 80%; width: 100%; top: 28%; background-color: white; }

#home .more { font-size: 1.6rem; }

@media (min-width: 768px) { #home #weather .islandDegree { float: right; } #home #twitterFeeds { min-height: 563px; } #home .clip { top: 12% !important; } }

@media (min-width: 992px) { #home #twitterFeeds { margin-top: 10rem; } #home .clip { top: 10% !important; } }

.webp #home #home-governor { background-image: url("/assets/webp/elements/home/governor_green.webp"); }

.webp #home #covid19 { background-image: url("/assets/webp/elements/home/covid19.webp"); }

.webp #home-weather { background: linear-gradient(rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8)), url("/assets/webp/elements/home/weather.webp") no-repeat center center; }

.webp #home-surf { background: linear-gradient(rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8)), url("/assets/webp/elements/home/surf.webp") no-repeat center center; }

.webp .sectionBg { background-image: url("/assets/webp/elements/home/honu.webp"); }

.no-webp #home #home-governor { background-image: url("/assets/images/elements/home/governor_green.png"); }

.no-webp #home #covid19 { background-image: url("/assets/images/elements/home/covid19.png"); }

.no-webp #home-weather { background: linear-gradient(rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8)), url("/assets/images/elements/home/weather.jpg") no-repeat center center; }

.no-webp #home-surf { background: linear-gradient(rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8)), url("/assets/images/elements/home/surf.jpg") no-repeat center center; }

.no-webp .sectionBg { background-image: url("/assets/images/elements/home/honu.png"); }

/* =GOVERNMENT
====================================================================== */
#governmentSection { background-color: #29a0cb; }

#governmentSection .clip { background-color: #29a0cb; z-index: -5; }

.webp #governmentSection .sectionBg { background-image: url("/assets/webp/elements/home/adult_and_child.webp"); }

.no-webp #governmentSection .sectionBg { background-image: url("/assets/images/elements/home/adult_and_child.png"); }

/* =BUSINESS
====================================================================== */
#businessSection { background-color: #73a240; }

#businessSection .clip { background-color: #73a240; z-index: -5; }

.webp #businessSection .sectionBg { background-image: url("/assets/webp/elements/home/fish.webp"); }

.no-webp #businessSection .sectionBg { background-image: url("/assets/images/elements/home/fish.png"); }

/* =RESIDENTS
====================================================================== */
#residentsSection { background-color: #c38a0f; }

#residentsSection .clip { background-color: #c38a0f; z-index: -5; }

.webp #residentsSection .sectionBg { background-image: url("/assets/webp/elements/home/man.webp"); }

.no-webp #residentsSection .sectionBg { background-image: url("/assets/images/elements/home/man.png"); }

/* =VISITORS
====================================================================== */
#visitorsSection { background-color: #b75340; }

#visitorsSection .clip { background-color: #b75340; z-index: -5; }

.webp #visitorsSection .sectionBg { background-image: url("/assets/webp/elements/home/boat.webp"); }

.no-webp #visitorsSection .sectionBg { background-image: url("/assets/images/elements/home/boat.png"); }

/* =FOOTER
====================================================================== */
#homeFooter { background-color: #515151; color: white; padding-bottom: 5rem !important; }

#homeFooter .clip { background-color: #515151; z-index: -5; }

#homeFooter .sectionBg { top: 0 !important; right: 2rem !important; width: 30rem !important; height: 30rem !important; z-index: -5; }

#homeFooter .footerSection { margin-bottom: 4rem; }

#homeFooter .footerHeader { font-size: 2.2rem; font-family: 'Montserrat', sans-serif; margin-bottom: 2rem; }

#homeFooter ul { list-style-type: none; padding-left: 0; }

#homeFooter ul li { font-size: 1.6rem; margin-top: 1rem; }

#homeFooter ul li a { color: white; text-decoration: none; }

#homeFooter .footerBottomLinks { margin-bottom: 1rem; }

#homeFooter .footerBottomLinks hr { border-color: rgba(255, 255, 255, 0.2); }

#homeFooter .footerBottomLinks a { display: block; padding-top: 1.5rem; padding-bottom: 1.5rem; color: #C3C3C3; transition: all 0.2s ease-out; text-decoration: none; }

#homeFooter .footerBottomLinks a span:first-child { margin-right: 1rem; font-size: 3rem; vertical-align: middle; }

#homeFooter .footerBottomLinks a span:last-child { font-size: 1.8rem; }

#homeFooter .footerBottomLinks a:hover { color: white; transition: all 0.2s ease-out; }

#homeFooter .copyright { margin-top: 1rem; }

#homeFooter .copyright span { display: block; }

#homeFooter .copyright a { color: white; text-decoration: none; }

@media (min-width: 768px) { #homeFooter .footerBottomLinks > div { text-align: center; } #homeFooter .footerBottomLinks a { text-align: center; } #homeFooter .footerBottomLinks a span:first-child { margin-right: 0; } #homeFooter .footerBottomLinks a span:last-child { display: block; } #homeFooter .sectionBg { right: 10em !important; } }

@media (min-width: 992px) { #homeFooter .footerBottomLinks a span:first-child { margin-right: 1rem; } #homeFooter .footerBottomLinks a span:last-child { display: inline-block; } }

.webp #homeFooter .sectionBg { background-image: url("/assets/webp/elements/footer/footerSeal.webp"); }

.no-webp #homeFooter .sectionBg { background-image: url("/assets/images/elements/footer/footerSeal.png"); }

/*# sourceMappingURL=home.css.map */