/* ------------- Base Setup Styles -------------- */
body { position: relative; background-color: #f2ebe7; color: #000; font: 500 20px/1.5 "figtree", sans-serif; counter-reset: section; overflow-x: hidden; }
p { margin-top: 1em; margin-bottom: 1em; }
a { cursor: pointer; text-decoration: none; color: #118F99; }
a:hover { color: #e96081; }
p a:not([class^=btn]) { color: #118F99; text-decoration: underline; }
p a:not([class^=btn]):hover { color: #e96081; }
hr { position: relative; display: table; clear: both; margin: 40px auto; width: 100%; height: 1px; background-color: #e96081; }
*:focus, a:focus, button:focus, input:focus { outline-width: medium; outline-color: #118F99 !important; }

/* ------------- Text Styles -------------- */
h1, h2, h3, h4, h5, h6 { margin: 0; position: relative; }
#page-title h1, .h1 small { color: #000; font: 600 15px/1 "figtree", sans-serif; display: block; margin: 10px auto; text-transform: uppercase; }
#page-title h1, #banner h1 small{opacity: .3;}
#page-title h1:only-child, h2#append, .h1 { color: #e96081; font: 700 60px/1 "roca", sans-serif; }
h2, .h2, .dividerLead, .more-to-explore span { color: #118f99; font: 700 50px/1 "roca", sans-serif; position: relative; }
h3, .h3 { color: #118F99; display: block; position: relative; font: 700 30px/1.1 "roca", sans-serif; }
.h4, .toggle h2, .toggle h3 { color: #000; display: block; position: relative; font: 400 24px/1.25 "figtree", sans-serif; }
.fo-title { color: #2e2112; font: 600 19px/1 "figtree", sans-serif; display: block; text-transform: uppercase; text-align: center; letter-spacing: 1.9px; margin-bottom: 15px; }
.text-white, .h1 .text-white { color: #fff; }

/* ------------- Buttons -------------- */
[class^=btn] { position: relative; z-index: 1; display: inline-block; vertical-align: middle; cursor: pointer; text-align: left; transition: 0.3s all; font: 700 16px/1.2 "figtree", sans-serif; color: #000; letter-spacing: 1.6px; text-transform: uppercase; min-width: 240px; margin: 10px; padding: 20px 70px 20px 25px; border-radius: 31.5px; box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16); background-color: #fff; }
[class^=btn]::after { content: ""; position: absolute; right: 10px; top: 50%; transform: translateY(-50%); width: 47px; height: 47px; background: #e96081 url("assets/images/arrow-btn.png") center/20px auto no-repeat; border-radius: 50%; }
[class^=btn]:hover { color: #118F99; }
[class^=btn]:hover:after { background-color: #118F99; }
[class^=btn].green::after, .divider-block:nth-of-type(6n+1) .btn::after { background-color: #9bbe27; }
[class^=btn].green:hover, .divider-block:nth-of-type(6n+1) .btn:hover { color: #118F99; }
[class^=btn].green:hover:after, .divider-block:nth-of-type(6n+1) .btn:hover:after { background-color: #118F99; }
[class^=btn].blue::after { background-color: #118F99; }
[class^=btn].blue:hover { color: #e96081; }
[class^=btn].blue:hover:after { background-color: #e96081; }
[class^=btn].dark-blue::after { background-color: #004369; }
[class^=btn].dark-blue:hover { color: #118F99; }
[class^=btn].dark-blue:hover:after { background-color: #118F99; }
.btn-alt { background-color: #118F99; color: #fff; }
.btn-alt:hover { background-color: #e96081; color: #fff; }
.btn-alt:hover:after { background-color: #118F99; }
.btn-thr { background-color: #9bbe27; }
.btn-thr:hover { background-color: #118F99; }
.btn.togg { color: #fff; background-color: #118F99; }
.btn.togg:after { background-color: #9bbe27; transform: translateY(-50%) rotate(90deg); }
.btn.togg:hover { background-color: #e96081; color: #fff; }
.btn.togg:hover:after { background-color: #118F99; }
.toggle-panel { margin-top: 36px; }
.toggle-flex .btn.togg { text-align: center; padding: 20px 15px; padding-bottom: 30px; min-width: 0; flex: 1; letter-spacing: 0.5px; }
.toggle-flex .btn.togg::after { right: auto; top: auto; bottom: -23px; left: 50%; transform: translateX(-50%) rotate(90deg); }
.toggle-flex { display: flex; align-items: flex-start; flex-wrap: nowrap; gap: 10px; }
.btn.togg.active:after{transform: translateY(-50%) rotate(270deg)}
.toggle-flex .btn.togg.active:after{transform:translateX(-50%) rotate(270deg)}
form [class^=btn] { width: auto; }


/* --- header ---- */

@keyframes logo-sway {
    0%, 100% { transform: rotate(-4deg); }
    50%       { transform: rotate(4deg); }
}
.insurance-bar { display: none; padding: 2px; text-transform: uppercase; color: #fff; text-align: center; font-size: 14px; background-color: #118F99; }
header { position: fixed; z-index: 100; left: 0; top: 0; width: 100%; background-color: transparent; transition: 0.3s all; }
header:focus-within { z-index: 500; }
    .logo-icon, footer .logo, .expect-tree img { animation: logo-sway 3s ease-in-out infinite; transform-origin: bottom center; }

header .logo { position: relative; z-index: 1; }
header .pho { text-transform: uppercase; color: #fff; font: 700 17px/1 "figtree", sans-serif; position: relative; }
header .pho span { font-weight: 500; }
header .phy { display: block; text-transform: uppercase; color: #fff; font-size: 17px; position: relative; letter-spacing: 1.7px; }
header .pho:hover, header .phy:hover { color: #e96081; }
header .phy i, header .pho i { color: #9bbe27; font-size: 15px; position: absolute; left: 0; top: 50%; transform: translateY(-50%); }
header li a { font-weight: 400; font-family: "figtree", sans-serif; }
header nav .active { box-shadow: inset 0 -3px 0 0 #118F99; }
#hd-top { background-color: #004369; padding: 10px; }
#hd-top > div { max-width: 1150px; margin: 0 auto; justify-content: center; }
#hd-top .bull { color: #e47b1f; margin: 0 20px; font-size: 28px; }
.header-social { display: flex; gap: 5px 10px; }
.header-social > a { background-color: rgba(0, 0, 0, 0.33); height: 31px; width: 31px; display: flex; align-items: center; justify-content: center; border-radius: 50%; color: #fff; font-size: 16px; }
@media (min-width:1026px) {
  header .logo { display: flex; flex: 0 0 auto; align-items: start; margin-right: 20px; }
  header .logo .logo-text { margin-top: 60px; margin-left: 20px; }
  .place-nav { max-width: 1350px; margin: 0 auto; padding: 10px; display: flex; justify-content: space-between; align-items: center; }
  nav { display: flex !important; flex: 0 1 660px; background: #fff; border-radius: 999px; display: flex; align-items: stretch; border: 1px solid #d0d0d0; }
  nav, nav ul li, nav ul li a { position: relative; }
  nav > ul { padding: 0; margin: 0; flex: 0 1 auto; width: 100%; display: flex; list-style: none; }
  nav ul ul { margin: auto; list-style: none; display: flex; justify-content: space-around; }
  nav ul li a { display: block; color: #fff; }
  nav ul li a:hover { color: #9bbe27; }
  nav > ul > li { flex: 1 1 auto; text-align: center; display: flex; align-items: stretch; border-right: 1px solid #d0d0d0; }
  nav > ul > li > a { width: 100%; padding: 14px 10px; font-size: 14px; font-weight: 700; text-transform: uppercase; color: #000; }
  nav > ul > li > a button { color: #000; display: none !important; }
  nav > ul > li:hover > a { color: #9bbe27; }
  #main-nav > a.ra { background-color: #f47b20; color: #fff !important; padding: 0 30px; display: flex; align-items: center; flex-shrink: 0; border-radius: 0 999px 999px 0; font: 700 13px/1 "figtree", sans-serif; text-transform: uppercase; letter-spacing: 0.04em; white-space: nowrap; }
  #main-nav > a.ra:hover { background-color: #e0670b; color: #fff !important; }
  nav ul li:hover > ul { display: block; visibility: visible; animation-name: fadeIn; animation-duration: 0.25s; animation-fill-mode: both; }
  nav ul ul { display: none; min-width: 280px; width: 100%; padding: 0; position: absolute; z-index: 3; top: 100%; left: 0; text-align: left; background-color: #118F99; box-shadow: 10px 17.3px 25px rgba(0, 0, 0, 0.2); }
  nav > ul > li:last-child ul { right: 0; left: auto; }
  nav ul ul li > a { padding: 10px 12px; font-size: 14px; line-height: 1.3; text-transform: none; }
  nav ul ul li:hover > a { background-color: #9bbe27; color: #fff; }
  nav ul ul ul { left: 100%; top: 0; background-color: #e96081; }
  nav ul ul ul li button i:before { content: "\e825" !important; }
  nav ul ul ul ul { top: auto; left: 0px; position: relative; display: block; box-shadow: none; background-color: #e3335d; }
  nav ul ul ul ul li a { padding-left: 2em; padding-left: 2em; }
  nav ul ul ul ul li a { background-color: #e43c65; }
  nav ul ul ul ul li:hover a { background-color: #78941e; }
  .has-submenu span > a, .has-submenu button { display: inline-block; }
  .has-submenu.open > ul { display: block; }
  .has-submenu.open > ul *:focus { background-color: rgba(255, 255, 255, 0.2); }
  nav li button { display: inline-block; }
}
.fix-nav header { position: fixed !important; background-color: #F2EBE7; animation-duration: 1s; animation-fill-mode: both; z-index: 100; }
.fix-nav header .logo { margin-top: -60px; }
.fix-nav header .logo .logo-icon { max-height: 100px; }
.fix-nav header .logo .logo-text { display: none; }
@media (max-width:1025px) {
body.page_index header{background-color: transparent;}
.logo-icon, footer .logo{animation: none;}
  .insurance-bar { display: block; }
  #hd-top { display: none; }
  .hd-info { display: none; align-items: center; margin-right: 10px; justify-content: flex-end; text-align: center; }
  .nav-down { background-color: #F2EBE7; }
.nav-down { background-color: #F2EBE7  !important;}
  header .pho { font-size: 30px; }
  header .logo { display: flex; align-items: start; padding: 10px; gap: 10px; }
  header .logo .logo-icon{  max-height: 135px;
    margin-left: -10px;
    margin-top: 10px;}
  header .logo .logo-text { max-height: 45px;
    margin-top: 0;
    margin-left: -20px; }
  #main-nav, header .hd-btns, header [class^=btn] { display: none; }
  .nav-up { transform: translateY(-100%); }
  header nav ul { display: none; }
  body, header, .mean-container .mean-nav { transition: all 0.3s; }
  body { right: 0; }
  .attach header { position: fixed !important; box-shadow: 0 3px 7px rgba(24, 23, 24, 0.35); }
  .attach header .top-nav { display: none !important; }
  body.mean-active header { left: -80%; }
  body.mean-active { overflow: hidden; right: 80%; }
  body.mean-active:before { z-index: 98; content: ""; opacity: 0.7; background-color: #000; position: absolute; left: 0; right: 0; top: 0; bottom: 0; background-image: none; height: inherit; }
  body.mean-active .mean-container .mean-nav { right: 0; }
  .mean-container { display: flex !important; flex-flow: row nowrap; align-items: start; justify-content: space-between; }
  .mean-container .mean-bar { background-color: #118F99; width: 50px; min-height: 50px; display: flex; flex-direction: column; justify-content: center; align-items: center; margin-left: 8px; }
  .mean-container .meanmenu-reveal { display: block; color: #fff; }
  .mean-container a.meanmenu-reveal.meanclose i:before { transform: rotate(45deg); font-size: 60px; content: "+"; margin: -5px 0 0 8px; }
  .mean-container .mean-bar .icon-menu { position: relative; display: table; transition: 0.3s all; z-index: 1; margin-top: 15px; }
  .mean-container .meanmenu-reveal .icon-menu:before { font-size: 30px; content: "|||"; transform: rotate(90deg) scaleY(1.6); letter-spacing: 3.2px; }
  .mean-container .mean-bar .icon-menu:after, .mean-container .meanmenu-reveal.meanclose:after { content: "MENU"; font-style: normal; position: absolute; left: 48%; transform: translateX(-50%); top: -13px; letter-spacing: 1px; font-size: 0.55em; font-weight: 700; }
  .mean-container .meanmenu-reveal.meanclose i:before { transform: rotate(45deg); font-size: 60px; content: "+"; margin: -5px 0 0 8px; }
  .mean-container .meanmenu-reveal.meanclose:after { content: "CLOSE"; bottom: 5px; }
  .mean-container .mean-nav { position: fixed; right: -80%; margin: 0; top: 0; bottom: 0; width: 80%; overflow: auto; display: flex; flex-flow: column; justify-content: flex-start; background-color: #118F99; }
  .mean-container .mean-nav ul { font-size: 16px; padding: 0; margin: 0; width: 100%; list-style-type: none; }
  .mean-container .mean-nav ul li { position: relative; width: 100%; }
  .mean-container .mean-nav ul li a { display: block; padding: 1em 5%; padding-right: 58px !important; margin: 0; text-align: left; color: #fff; border-top: 1px solid rgba(255, 255, 255, 0.5); text-decoration: none; text-transform: uppercase; }
  .mean-container .mean-nav ul li li a { padding: 1em 10%; border-top: 1px solid #f1f1f1; border-top: 1px solid rgba(255, 255, 255, 0.25); opacity: 0.75; text-shadow: none !important; visibility: visible; }
  .mean-container .mean-nav ul li.mean-first a { border-top: none; margin-top: 0; }
  .mean-container .mean-nav ul li.mean-last a { border-bottom: none; margin-bottom: 0; }
  .mean-container .mean-nav ul li li li a { padding: 1em 15%; }
  .mean-container .mean-nav ul li li li li a { padding: 1em 20%; }
  .mean-container .mean-nav ul li li li li li a { padding: 1em 25%; }
  .mean-container .mean-nav ul li a:hover { background: #252525; background: rgba(255, 255, 255, 0.1); }
  .mean-container .mean-nav ul li a.mean-expand { width: 48px; line-height: 50px; font-size: 20px; padding: 0 !important; text-align: center; position: absolute; right: 0; top: 0; z-index: 2; background: rgba(255, 255, 255, 0.1); border: none !important; border-left: 1px solid rgba(255, 255, 255, 0.4) !important; border-bottom: 1px solid rgba(255, 255, 255, 0.4) !important; }
  .mean-container .mean-nav ul li a.mean-expand:before { content: "\e825"; font-family: "fontello"; font-weight: 400; margin: 0; font-style: normal; }
  .mean-container .mean-nav ul li .mean-expand.mean-clicked:before { content: "\e83a"; }
  .mean-remove { display: none !important; }
  .mean-nav .social { min-height: 66px; background-color: rgba(0, 0, 9, 0.1); margin: 0; padding: 10px 5px; justify-content: center; }
  .mean-nav .fo-title { color: #fff; text-align: center; }
  .mean-nav .hours { display: block; text-align: center; color: #fff; padding: 10px; margin: 10px auto auto; }
  .mean-nav .hours p { display: table; text-align: left; font-size: 15px; margin: 10px auto 0; color: #fff; }
}

/* ------------- Custom Video -------------- */

/* ------------- Play Button -------------- */
.play { cursor: pointer; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; color: #000; font: 700 15px/1 "figtree", sans-serif, sans-serif; text-transform: uppercase; letter-spacing: 1.5px; text-align: center; transition: 0.3s all; z-index: 5; }
.play i { width: 85px; height: 85px; border-radius: 50%; background-color: #fff; display: block; color: #000; display: inline-flex; align-items: center; justify-content: center; font-size: 30px; margin: 10px; transition: 0.3s all; }
.play i:before { margin: auto; padding-left: 5px; }
.play:hover { color: #e96081; }
.play:hover i { background-color: #e96081; color: #fff; }
.play svg { display: table; margin: 0 auto; }
.play:hover svg #Polygon_5 { fill: #fff; }

/* ------------- Close Button -------------- */
#interior-banner .close,
[data-embed] .close,
[data-vimeo] .close {
    cursor: pointer;
    line-height: 1;
    background-color: #118F99;
    color: #fff;
    padding: 8px;
    text-transform: uppercase;
    z-index: 5;
}
#interior-banner .close i, [data-embed] .close i, [data-vimeo] .close i { font-style: normal; font-size: 1.5em; line-height: 1; vertical-align: middle; display: inline-block; margin-bottom: 5px; }
#interior-banner .close:focus, [data-embed] .close:focus, [data-vimeo] .close:focus { background-color: #0c646b; }
#interior-banner .close:hover, [data-embed] .close:hover, [data-vimeo] .close:hover { background-color: #1b1b1b; color: #fff; }
#interior-banner .close, [data-embed] .close { position: absolute; top: 0; right: 0; }
#interior-banner .close i:before, [data-embed] .close i:before { transform: rotate(45deg); }
.read-section { position: relative; }
.read { padding: 5px; display: flex; align-items: center; justify-content: space-between; margin: 5px; font-weight: 600; font-size: 14px; letter-spacing: 2.8px; text-transform: uppercase; max-width: 170px; width: 100%; position: relative; z-index: 5; transition: 0.3s; }
.read .text { margin: 0 auto; }
.read .icon { color: #fff; background-color: #118F99; transition: 0.3s; border-radius: 50%; height: 43px; width: 43px; display: flex; align-items: center; justify-content: center; }
.read .icon img + img { display: none; }
.read-text { width: 100%; display: none; }
.read:hover { color: #e96081; }
.read:hover .icon { background-color: #e96081; }
.read.active .icon img { display: none; }
.read.active .icon img + img { display: block; }
.read.active + .read-text { display: block; }

/* ----------- Banner ----------- */
#banner { position: relative; min-height: 100vh;}
#banner figure { position: relative; }
#banner figure:after { content: ""; position: absolute; top: 0; bottom: 0; left: 0; right: 0; background-color: #f2ebe7; opacity: 0.6; }
#banner:after { content: ""; z-index: 5; background-image: url(assets/images/wave-banner.png); position: absolute; bottom: -5px; left: -10px; right: -10px; height: 226px; background-size: 100% 100%; background-repeat: no-repeat; background-position: center top; pointer-events: none; }
#banner article { z-index: 50; text-align: center; position: absolute; bottom: 60px; width: 100%; padding: 10px; }
#banner.playing { z-index: 100; min-height: auto;}
#banner.playing article { position: relative; transform: none; left: 0; top: 0; }
#banner.playing figure { margin: 0; min-height: auto;}
#banner.playing figure:after { content: none; }
#banner.playing:after { content: none; }
#banner .play { opacity: 0; }
#banner:hover .play { opacity: 1; }
#banner .h2 { font-size: 69px; color: #e96081; margin-bottom: 40px; margin-top: 20px; }
#banner .links { font-weight: 600; letter-spacing: 1.6px; color: #118F99; text-transform: uppercase; }
#banner .links a { color: #118F99; }
#banner .links a:hover { color: #e96081; }
#banner .links span { margin: 0 5px; }
@media (max-width:1024px) {
#banner{margin-bottom: 100px; min-height: auto;}
#banner figure{min-height: auto;}
  #banner figure video{width: unset;
  max-width: unset;
  height: 600px;}
  #banner article { position: relative; transform: none; left: 0; top: 0; top: 20px; }
  #banner:after { bottom: 140px; }
  #banner .play { cursor: pointer; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
#banner .links a{font-size: 16px;}
#banner .links{max-width:500px; margin: 0 auto;}
}
@media (max-width:768px) {
  #banner video{margin-left: -300px;}
}
