/* ------------- Base Setup Styles -------------- */
body { position: relative; background-color: #f7f4f4; color: #000; font: 400 18px/1.6 "trade-gothic-next", sans-serif; counter-reset: section; overflow-x: hidden; }
p { margin-top: 1em; margin-bottom: 1em; }
a { cursor: pointer; text-decoration: none; color: #ffcf00; }
a:hover { color: #df5f59; }
p a:not([class^=btn]) { color: #2C8CDE; }
p a:not([class^=btn]):hover { color: #df5f59; }
hr { position: relative; display: table; clear: both; margin: 40px auto; width: 100%; height: 1px; background-color: #df5f59; }
*:focus, a:focus, button:focus, input:focus { outline-width: medium; outline-color: #ffcf00 !important; }

/* ------------- Text Styles -------------- */
h1, h2, h3, h4, h5, h6 { margin: 0; position: relative; }
#page-title h1, .h1 small { color: #000; font: 700 14px/1 "trade-gothic-next", sans-serif; display: block; margin: 10px auto; text-transform: uppercase; }
#page-title h1:only-child, h2#append, .h1 { color: #fff; font: 700 75px/1 "din-condensed", sans-serif; }
#interior-banner #page-title h1 { color: #fff; }
h2#append span { color: #ffcf00; }
h2, .h2, .dividerLead, .more-to-explore span { color: #3e4b98; font: 700 60px/1 "din-condensed", sans-serif; text-transform: uppercase; position: relative; }
.h2.big { font-size: 75px; }
.h2 span { color: #DF5F59; }
h3, .h3 { color: #000; display: block; position: relative; font: 700 42px/1.1 "din-condensed", sans-serif; }
.h4, .toggle h2, .toggle h3 { color: #000; display: block; position: relative; font: 400 24px/1.25 "trade-gothic-next", sans-serif; }
.fo-title { color: #3e4b98; font: 700 28px/1 "din-condensed", sans-serif; display: block; text-transform: uppercase; margin-bottom: 20px; }
.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: center; transition: 0.3s all; font: 400 16px/1.2 "trade-gothic-next", sans-serif; color: #fff; text-transform: uppercase; min-width: 285px; margin: 10px; padding: 12px 10px 14px; letter-spacing: 0.8px; background-color: #df5f59; }
[class^=btn]:hover { background-color: #ffcf00; color: #000; }
[class^=btn].small { min-width: 180px; }
.btn-alt { background-color: #feee35; color: #5b5851; }
.btn-alt:hover { background-color: #3E4B98; color: #fff; }
.btn-thr { background-color: #3E4B98; }
.btn-thr:hover { background-color: #ffcf00; }
form [class^=btn] { width: auto; }

/* --- header ---- */
.insurance-bar { display: none; padding: 2px; text-transform: uppercase; color: #fff; text-align: center; font-size: 14px; background-color: #ffcf00; }
header { position: fixed; z-index: 100; left: 0; top: 0; width: 100%; background-color: #fff; transition: 0.3s all; background-color: #3e4b98; }
header:focus-within { z-index: 500; }
header .logo { position: relative; z-index: 1; }
header .logo img { margin: 0; }
header .pho { color: #ffcf00; font: 400 30px/1 "trade-gothic-next", sans-serif; position: relative; }
header .phy { display: block; color: #fff; font-size: 20px; position: relative; }
header .pho:hover, header .phy:hover { color: #df5f59; }
header .phy i, header .pho i { color: #3E4B98; font-size: 15px; position: absolute; left: 0; top: 50%; transform: translateY(-50%); }
header li a { font-weight: 400; font-family: "trade-gothic-next", sans-serif; }
header nav .active { box-shadow: inset 0 -3px 0 0 #ffcf00; }
header .btn { min-width: 230px; }
.hd-right { flex: 0 0 auto; }
.hd-btns { display: flex; flex-wrap: wrap; flex: 0 1 280px; justify-content: space-between; }
.hd-btns [class^=btn] { justify-content: center; align-items: center; min-width: auto; padding: 12px 6px; border-radius: 0; margin: 0; }
.hd-btns [class^=btn]:hover { background-color: #df5f59 !important; }
.hd-btns .ra { flex: 1 1 100%; margin-bottom: 5px; }
.hd-btns .fm, .hd-btns .of { flex: 0 1 49%; padding: 5px; }
.site-btns { position: relative; display: flex; text-align: center; border-radius: 4px; border: 2px solid #fff; max-width: 385px; margin: 10px 0 0 auto; background-image: linear-gradient(to right, #fdcf35, #f143f9 100%); box-shadow: 6px 6px 0 #3e4b98; }
.site-btns > a { padding: 12px; line-height: 1; text-align: center; position: relative; color: #fff; text-transform: uppercase; font-size: 14px; font-weight: 700; letter-spacing: 1.6px; }
.site-btns:before, .site-btns:after { position: absolute; left: 0%; top: 0%; z-index: 2; pointer-events: none; animation: sparkle 2s ease-in-out infinite, chase 6s linear infinite; }
.site-btns:before { content: url(assets/images/deco-star-1.png); }
.site-btns:after { content: url(assets/images/deco-star-2.png); animation-delay: 1s, -3s; }
@keyframes sparkle {
  0%, 100% { transform: translate(-50%, -50%) scale(1) rotate(0deg); opacity: 1; }
  25% { transform: translate(-50%, -50%) scale(1.25) rotate(15deg); opacity: 0.8; }
  50% { transform: translate(-50%, -50%) scale(0.8) rotate(-15deg); opacity: 0.5; }
  75% { transform: translate(-50%, -50%) scale(1.15) rotate(10deg); opacity: 1; }
}
@keyframes chase {
  0% { left: 0%; top: 0%; }
  25% { left: 100%; top: 0%; }
  50% { left: 100%; top: 100%; }
  75% { left: 0%; top: 100%; }
  100% { left: 0%; top: 0%; }
}
.site-btns > a + a { border-left: 1px solid #fff; flex: 0 1 296px; }
.site-btns > a:hover { background-color: #3e4b98; }
@media (min-width:1026px) {
  .place-nav { max-width: 1350px; margin: 0 auto; padding: 20px 10px; display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 24px; align-items: start; }
  .hd-right { max-width: 500px; }
  .hd-left { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 20px; row-gap: 12px; align-items: end; min-width: 0; }
  header .logo { grid-column: 1/2; grid-row: 1/2; }
  nav { grid-column: 1/3; grid-row: 2/3; min-width: 0; margin-top: -8px; }
  .hd-right { grid-column: 2/3; grid-row: 1/2; align-self: start; }
  nav, nav ul li, nav ul li a { position: relative; }
  nav > ul { padding: 0; max-width: 1300px; margin: 0; width: 100%; }
  nav 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: #fff; }
  nav > ul > li { flex: 1 1 auto; text-align: center; }
  nav > ul > li:last-of-type:after { display: none; }
  nav > ul > li > a { padding: 6px; font-size: 20px; font-family: "din-condensed", sans-serif; text-transform: uppercase; color: #fff; font-weight: 700; }
  nav > ul > li > a button { color: #ffcf00; }
  nav > ul > li:hover > a { color: #ffcf00; }
  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; left: 0; text-align: left; background-color: #ffcf00; 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: #3E4B98; color: #fff; }
  nav ul ul ul { left: 100%; top: 0; background-color: #df5f59; }
  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: #d7362e; }
  nav ul ul ul ul li a { padding-left: 2em; padding-left: 2em; }
  nav ul ul ul ul li a { background-color: #d83e37; }
  nav ul ul ul ul li:hover a { background-color: #2f3974; }
  .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; }
}
@media (min-width:1026px) and (max-width:1280px) {
  .place-nav { grid-template-columns: minmax(0, 1fr) 430px; }
  .hd-right { width: 100%; }
  nav > ul { justify-content: space-between; }
  header .pho { font-size: 18px; }
  header .phy { font-size: 16px; }
  header .ra { min-width: 185px; }
  .hd-info { text-align: right; }
  .hd-info .flex { justify-content: end; }
}
.fix-nav header { position: fixed !important; box-shadow: 0 3px 7px rgba(24, 23, 24, 0.35); animation-duration: 1s; animation-fill-mode: both; z-index: 100; }
.fix-nav #hd-top, .fix-nav .fm, .fix-nav .of { display: none; }
@media (max-width:1025px) {
  .insurance-bar { display: block; }
  #hd-top { display: none; }
  .place-nav { padding: 20px; }
  .hd-info { display: none; align-items: center; margin-right: 10px; justify-content: flex-end; text-align: center; }
  header .pho { font-size: 30px; }
  header .logo { padding: 8px; display: block; }
  header .logo img { max-height: 60px; }
  #main-nav, header .hd-btns, header [class^=btn], header .site-btns { display: none; }
  .nav-down { box-shadow: 0 3px 7px rgba(24, 23, 24, 0.2); }
  .nav-up { transform: translateY(-100%); }
  header nav ul { display: none; }
  body, header, .mean-container .mean-nav { transition: all 0.3s; }
  body { right: 0; }
.site-btns::before, .site-btns::after{content: none;}
  .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: center; justify-content: space-between; }
  .mean-container .mean-bar { background-color: #df5f59; width: 51px; min-height: 51px; border-radius: 50%; 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; }
  .mean-container .meanmenu-reveal .icon-menu:before { font-size: 20px; content: "|||"; transform: rotate(90deg) scaleY(1.2); letter-spacing: 3.2px; }
  .mean-container .meanmenu-reveal.meanclose i:before { transform: rotate(45deg); font-size: 40px; content: "+"; margin: -5px 0 0 8px; }
  .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: #3E4B98; }
  .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 .site-btns { display: flex; width: calc(100% - 20px); max-width: none; margin: 10px; border-width: 1px; box-shadow: none; }
  .mean-nav .site-btns > a { flex: 1 1 50%; min-width: 0; padding: 10px 8px; font-size: 11px; letter-spacing: 1px; }
  .mean-nav .site-btns > a + a { flex: 1 1 50%; }
  .mean-nav .social { background-color: rgba(0, 0, 9, 0.1); margin: 0 10px; padding: 10px 5px; justify-content: center; display: flex; flex-wrap: wrap; gap: 8px; }
  .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 "trade-gothic-next", sans-serif, sans-serif; text-transform: uppercase; letter-spacing: 1.5px; text-align: center; transition: 0.3s all; }
.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: #df5f59; }
.play:hover i { background-color: #df5f59; color: #fff; }

/* ------------- Close Button -------------- */
[data-embed] .close, [data-vimeo] .close { cursor: pointer; line-height: 1; background-color: #ffcf00; color: #fff; padding: 8px; text-transform: uppercase; z-index: 5; }
[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; }
[data-embed] .close:focus, [data-vimeo] .close:focus { background-color: #cca600; }
[data-embed] .close:hover, [data-vimeo] .close:hover { background-color: #1b1b1b; color: #fff; }
[data-embed] .close { position: absolute; top: 0; right: 0; }
[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: #ffcf00; 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: #df5f59; }
.read:hover .icon { background-color: #df5f59; }
.read.active .icon img { display: none; }
.read.active .icon img + img { display: block; }
.read.active + .read-text { display: block; }

/* ----------- Banner ----------- */
#banner { position: relative; overflow: hidden; max-height: 538px; }
#banner .slick-banner { position: relative; }
#banner .block { min-height: clamp(360px, 44vw, 560px); }
#banner figure { order: 2; flex: 1 1 44%; margin: 0 0 0 -115px; position: relative; z-index: 1; }
#banner figure img { display: block; width: 100%; height: 100%; object-fit: cover; }
#banner article { max-height: 510px; order: 1; z-index: 2; position: relative; top: auto; left: auto; transform: none; width: auto; flex: 0 1 56%; margin: 0; padding: 40px 40px 150px; display: flex; align-items: start; justify-content: flex-start; text-align: left; background: url("assets/images/bg-banner.png") no-repeat right center/cover; }
#banner article > * { max-width: 620px; margin: 0 auto; }
#banner article .h1 > small { color: #fff; }
#banner article .h2 { color: #fff; font-size: 75px; }
#banner article .h2 span { color: #fef14b; }
#banner > .slick-controls { position: absolute; bottom: 100px; right: 100px; z-index: 4; margin: 0; max-width: none; }
#banner > .slick-controls .slick-arrow { display: none !important; }
#banner > .slick-controls .slick-dots span { height: 30px; width: 30px; font-size: 14px; }
@media (min-width:1401px) {
  #banner article { align-items: center; }
}
@media (max-width:1024px) {
  #banner { max-height: 100%; overflow: visible;}
  #banner figure { margin-left: 0; min-height: 400px; }
  #banner figure img { height: auto; }
  #banner article { min-height: 500px; margin: -150px auto 0; padding: clamp(70px, 18vw, 126px) 24px 30px; display: block; text-align: left; background: url("assets/images/bg-index-banner-mob.png") no-repeat top center/cover; display: flex; align-items: center; justify-content: center; }
  #banner > .slick-controls { position: relative; right: auto; bottom: auto; justify-content: flex-end; margin: 10px auto 0; padding-right: 16px; }
}
@media (max-width:768px) {
  #banner article { margin-top: -150px; padding: clamp(64px, 20vw, 112px) 18px 24px; }
  #banner article .h2 { font-size: 68px; }
  #banner figure{height: 400px;}
  #banner figure img{object-fit: cover; object-position: center; height: 100%;}
}
#below-banner { margin: 0 auto; margin-top: -100px; position: relative; z-index: 6; background-color: #fff; padding: 20px; box-shadow: 0 13px 36px 0 rgba(0, 0, 0, 0.25); font-size: 25px; text-align: center; max-width: 1100px; }
#below-banner > * { max-width: 1024px; margin: 1em auto; }
@media (max-width:1024px) {
  #below-banner { margin: 10px; padding: 20px 10px; }
}
