/* Theme Name: eclipse360 */
/* This is for Fiscal 2024 */

/* Global */
::selection { background: #00abbd; color: #fff; }
.dark-blue { color: #00365b; }
.dark-blue-background { background-color: #00365b; }
.dark-grey { color: #48484A; }
.dark-grey-background { background-color: #48484A; }
.green { color: #a5b48c; }
.green-background { background-color: #a5b48c; }
.grey { color: #ECECEC; }
.grey-background { background-color: #ECECEC; }
.light-blue { color: #B7E2E7; }
.light-blue-background { background-color: #B7E2E7; }
.light-grey { color: #EFF1F2; }
.light-grey-background { background-color: #EFF1F2; }
.light-teal { color: #C3E6EB; }
.light-teal-background { background-color: #C3E6EB; }
.medium-blue { color: #467B96; }
.medium-blue-background { background-color: #467B96; }
.silver { color: silver; }
.silver-background { background-color: silver; }
.steel-blue { color: #467B96; }
.steel-blue-background { background-color: #467B96; }
.teal { color: #00abbd; }
.teal-background { background-color: #07aabc; }
.white { color: #FFFFFF; }
.white-background { background-color: #FFFFFF; }
.yellow { color: #FDB636; }
.yellow-background { background-color: #FDB636; }

.overflow { overflow: hidden !important; }
.block { display: block !important; }
.hidden { display: none !important; }

p { margin-bottom: 20px; }
p:last-of-type { margin: 0; }
p:last-of-type + * { margin-top: 30px; }

html { max-width: 100vw; }
body { font-family: "Open Sans", sans-serif; font-size: 20px; font-weight: 300; line-height: 32px; max-width: 100vw; margin: 0; overflow-x: hidden; }

h1 { font-size: 48px; font-weight: 400; line-height: 65px; }
h2 { font-size: 40px; font-weight: 400; line-height: 65px; margin: 30px 0 10px 0; }
h3 { font-size: 30px; font-weight: 400; line-height: 42px; }
h4 { font-size: 24px; font-weight: 700; line-height: 36px; letter-spacing: 7.2px; text-transform: uppercase; }
.overline { display: inline-block; font-size: 24px; font-weight: 600; line-height: 90px; letter-spacing: 7.2px; margin: 0 0 0 -300px; opacity: 0; transition: all 1s ease-in-out; }
.overline.animated { opacity: 1; margin: 0 0 0 0; }
a { text-decoration: none; transition: all 250ms; color:#00365b; font-weight: 400; }
p { font-size: 20px; font-weight: 400; line-height: 32px; margin: 0 0 20px 0; }
sup { position: relative; top: -6px; font-size: .6em; display: inline-block; margin: -6px 0 0 0; }
strong { font-weight: 700; }

.alignleft { float: left; padding: 0 20px 0 0; }
.alignright { float: right; padding: 0 0 20px 20px; }
.textleft { text-align: left; }
.textcenter { text-align: center; }
.textright { text-align: right; }
.clear { clear: both; }
.bold { font-weight: 600; }
.width-full { position: relative; z-index: 1; max-width: 100% !important; }
.width-large { position: relative; z-index: 1; max-width: 1920px !important; margin: 0 auto !important; }
.width-medium { position: relative; z-index: 1; max-width: 1428px !important; margin: 0 auto !important; }
.width-small { position: relative; z-index: 1; max-width: 1290px !important; margin: 0 auto !important; }
.height-large { height: 90vh; }
.height-medium { height: 75vh; }
.height-small { height: 50vh; }

.animate-text-up { padding-top: 60px; opacity: 0; transition: all 1s ease-in-out; }
.animate-text-up.animated { padding-top: 30px; opacity: 1; }
.animate-title { margin: 60px 0 0 0; transition: all 1s ease-in-out; }
.title-animated { margin: 0 0 0 0 !important; }
.animate-text { margin: 60px 0 0 0; transition: all 1s ease-in-out; }
.text-animated { margin: 0 0 0 0 !important; }

.dividing-line { position: relative; opacity: 0; margin: 0 0 -90px -500px; z-index: 1; transition: all .5s ease-in-out; }
.dividing-line .line { height: 1px; width: 100%; background-color: #FDB733; }
.dividing-line .end { position: absolute; top: -5px; right: -8px; border-radius: 45px; height: 10px; width: 10px; background-color: #FDB733; }
.dividing-line.animated { opacity: 1; margin: 0 0 -90px -50px; }

#content-container { /*height: 300vh;*/ }
section { position: relative; }
.left-column { position: relative; display: inline-block; width: calc(41% - 60px); vertical-align: top; padding: 50px 60px 0 0; margin: 0; left: -100%; opacity: 0; transition: all 1s ease-in-out; }
.section-heading { font-size: 55px; font-weight: 400; line-height: 65px; max-width: 600px; }
.left-column.animated { left: 0; opacity: 1; }
.section-text { position: relative; display: inline-block; width: calc(59% - 30px); vertical-align: top; padding: 50px 30px 0 0; right: -100%; opacity: 0; transition: all 1s ease-in-out; transition-delay: 0.150s; }
.section-text.animated { right: 0; opacity: 1; }
.section-text.no-left-column { width: 100%; padding: 0; }

.button { display: inline-block; color: #FFFFFF; background-color: transparent; font-size: 18px; font-weight: 400; line-height: 36px; padding: 10px 15px; margin: 40px 0 0 0; border: 1px solid #FFFFFF; transition: all .25s ease-in-out; }
.button:hover { background-color: #FFFFFF; color: #00365b; }

.bounce-2 {
    animation-duration: 4s;
    animation-iteration-count: infinite;
    animation-name: bounce-2;
    animation-timing-function: ease;
}

@keyframes bounce-2 {
    0%   { transform: translateY(0); }
    50%  { transform: translateY(-20px); }
    100% { transform: translateY(0); }
}

.bounce-3 {
    animation-duration: 4s;
    animation-iteration-count: infinite;
    animation-name: bounce-3;
    animation-timing-function: ease;
}

@keyframes bounce-3 {
    0%   { transform: translateY(-20px); }
    50%  { transform: translateY(0); }
    100% { transform: translateY(-20px); }
}

/* HEADER */
#header { position: relative; z-index: 10; margin: 0 0 0 0; border-bottom: 1px solid #FFFFFF; }
#header .container { max-width: 1440px; margin: 0 auto; padding: 0 0 0 20px; }
#header .logo { display: inline-block; width: calc(100% - 567px); vertical-align: middle; transition: all .25s;  }
#header .logo img { height: 36px; }
#header .header-title { display: inline-block; color: #FFFFFF; font-size: 18px; font-weight: 600; line-height: 90px; letter-spacing: 5.4px; padding: 0 50px; border-right: 1px solid #FFFFFF; transition: all 1s ease-in-out; }
#header .header-title.animated { margin: 0 0 0 0; }
#header .header-date { display: inline-block; color: #FFFFFF; font-size: 18px; font-weight: 600; line-height: 90px; letter-spacing: 5.4px; padding: 0 50px; }

#video-image { position: relative; top: -115px; left: 0; width: 100vw; height: 85vh; max-height: 1125px; background: url('https://corporateannualreport2021.eclipseserve.ca/wp-content/uploads/2025/05/video.jpg'); background-size: cover; background-position: bottom center; }
#video-image .header-video { position: relative; padding: 0 !important; height: 85vh; }
#video-image .header-video video { height: 100%; width: 100%; object-fit: cover; object-position: bottom center; }
#video-image iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.header-banner { position: absolute; top: 0; left: 0; height: 100%; width: 100%; transition: all .5s ease-in-out; }
.header-banner-text { position: absolute; height: 209px; width: 100%; max-width: 865px; font-size: 75px; line-height: 85px; color: #FFFFFF; font-weight: 300; top: 60%; left: 50%; transform: translate(-50%, -50%); opacity: 0; text-align: center; /*text-shadow: 2px 2px 2px rgba(0,0,0,.5);*/ transition: all 1s ease-in-out; transition-delay: 0.15s; }
.header-banner-text.animated { top: 50%; opacity: 1; }
.header-triangle { position: absolute; bottom: 0; right: 0; height: 204px; width: 169px; background: url('/wp-content/themes/eclipse360/assets/images/header_triangle.png'); }

.side-button { position: absolute; top: 91px; right: -100%; height: 99px; width: 500%; background-color: #FDB733; margin: 0 0 0 0; z-index: 100; opacity: 0; width: 300px; transition: width 1s ease-in-out, right 1s ease-in-out, opacity 1s ease-in-out; }
.side-button.sticky { position: fixed; top: 0; right: 0%; width: 115px; }
.side-button.sticky:hover { width: 300px; }
.side-button.animated { opacity: 1; right: 0%; }
.logged-in .side-button.sticky { top: 32px; }
.side-button-icon { position: absolute; top: 24px; left: 43px; height: 51px; width: 39px; background: url(/wp-content/themes/eclipse360/assets/images/car_download_hover.png); background-size: contain !important; transition: all .5s ease-in-out; }
.side-button-text { position: absolute; font-size: 16px; font-weight: 800; line-height: 20px; letter-spacing: 1.6px; padding: 27px 0 0 115px; color: rgba(0,54,91); transition: all .5s ease-in-out; }
.side-button:hover { width: 360px; }
.side-button:hover .side-button-text { color: #FFFFFF; }
.side-button:hover .side-button-icon { background: url(/wp-content/themes/eclipse360/assets/images/car_download.png); }

.up-arrow { position: fixed; bottom: 140px; right: 10px; background: rgba(26, 81, 117, .7) url('/wp-content/themes/eclipse360/assets/images/white-arrow.png'); height: 62px; width: 62px; z-index: 100; border-radius: 90px; rotate: -90deg; transition: all .5s ease-in-out; }
.up-arrow.sticky { transition: unset; }
.up-arrow.after-animation { transition: unset; }
.logged-in .up-arrow.sticky { bottom: 125px; }

.down-arrow { position: fixed; bottom: 50px; right: 10px; background: rgba(26, 81, 117, .7) url('/wp-content/themes/eclipse360/assets/images/white-arrow.png'); height: 62px; width: 62px; z-index: 100; border-radius: 90px; rotate: 90deg; transition: all .5s ease-in-out; }
.down-arrow.top { rotate: 180deg; }
.down-arrow.sticky { transition: unset; }
.down-arrow.after-animation { transition: unset; }
.logged-in .down-arrow.sticky { bottom: 50px; }

/* BACKGROUND IMAGES */
.bg-image { position: absolute; background-position: center center !important; }
.image-break .bg-image { background-position: center left !important; transition: all 1s ease-in-out; }
.image-break.animated .bg-image { background-position: 85% center !important; }
.image-break .bg-image:nth-child(2) { left: -100px !important; transition: all 1s ease-in-out; }
.image-break.animated .bg-image:nth-child(2) { left: -1px !important; }

/* BAR GRAPHS */
.bar-graph { padding: 30px 10px; }
.bar-graph .content { display: inline-block; width: 38%; vertical-align: top; padding: 30px 129px 0 0; }
.bar-graph .section-heading { width: 100%; padding: 50px 0 0 0; font-size: 30px; font-weight: 400; line-height: 42px; opacity: 0; transition: all 1s ease-in-out; }
.bar-graph .section-heading.animated { opacity: 1; }
.bar-graph .dividing-line .line { bottom: unset; max-width: unset; }
.bar-graph .section-text { width: 100%; padding: 0; }
.bar-graph .lines { position: relative; display: inline-block; width: calc(62% - 129px); vertical-align: top; border-bottom: 1px solid rgba(255,255,255,.5); }
.bar-graph .line-div { display: inline-block; padding: 30px 25px 10px 0; }
.bar-graph .line-div.no-padding { padding: 30px 0 10px 0; }
.bar-graph .line { position: absolute; bottom: 10px; margin: 0 0 0 7px; max-width: 120px; transition: all 2.5s ease-in-out; }
.bar-graph .line.negative { bottom: -150px; }
.bar-graph .line-value.zero-height { opacity: 0; }
.bar-graph .line-value { position: absolute; top: -40px; left: 50%; transform: translateX(-50%); font-weight: 600; display: inline-block; opacity: 1; color: #FFFFFF; transition: all 2.5s ease-in-out; }
.bar-graph.animate .line-value { opacity: 1; }
.bar-graph.smaller-font .line-value { font-size: 16px; }
.bar-graph.smaller-font .line-value.bold-value { font-size: 18px; font-weight: bold; }
.bar-graph.smaller-font .line-value.stacked-values { top: -2px; display: none; }
.bar-graph .line-value.value-inside { top: 10px; }
.bar-graph .line.negative .line-value { top: -40px; }
.bar-graph .line-value .line-text { display: inline-block; font-size: 12px; margin: -1px 0 0 2px; vertical-align: top; }
.bar-graph .line.zero-height { height: 0 !important; }
.bar-graph .line-value .line-value { transform: unset; font-size: 12px; margin: -5px 0 0 0; top: unset; left: unset; }
.bar-graph .benchmark { position: absolute; bottom: 10px; margin: 0 0 0 7px; background-color: transparent !important; transition: all 2.5s ease-in-out;}
.bar-graph .benchmark.zero-height { height: 0 !important; }
.bar-graph .benchmark-line { position: absolute; top: 0; height: 4px; width: 120%; margin: 0 0 0 -10px; background-color: #07aabc; display: inline-block; }
.bar-graph .benchmark .line-value { top: -15px; left: 115%; transform: unset; }
.bar-graph .line-label { position: absolute; bottom: -40px; text-align: center; font-weight: 600; padding: 0 0 0 0; width: 10%; color: #FFFFFF; font-size: 15px; line-height: 20px; }
.bar-graph.smaller-font .line-label { font-size: 16px; padding: 0 0 0 9px; }
.bar-graph .bar-graph-main-legend { display: inline-block; font-size: 16px; padding: 30px 20px 0 0; }
.bar-graph .legend { padding: 10px 0 0 0; font-weight: 600; color: #FFFFFF; }
.bar-graph .legend img { vertical-align: middle; }

.bar-graph .section-heading { left: 0; margin: 60px 0 0 0; }
.bar-graph .section-heading.animated { margin: 0; }
.bar-graph .section-text { left: 0; margin: 60px 0 0 0; }
.bar-graph .section-text.animated { margin: 0; }

#returns { margin: 90px 0 0 0; }
#value-add { margin: 90px 0 0 0; }
#value-add .line-label { bottom: -190px; }

/* COLUMNS */
.columns { position: relative; background-size: cover !important; background-position: center bottom !important; background-repeat: no-repeat !important; }
.columns .background-shape { position: absolute; background-size: contain !important; background-repeat: no-repeat !important; background-position: center center !important; }
.columns .content-div { display: inline-block; width: 35%; padding: 30px 30px 30px 30px; vertical-align: top; }
.columns h2 { font-family: "Open Sans", sans-serif; font-size: 62px; font-weight: 300; line-height: 1.1; padding: 0 !important; }
.columns .columns-title.title-animated { margin: 11vh 0 0 0; }
.columns .columns-text { padding: 10px 0; font-family: "Open Sans", sans-serif; font-size: 18px; line-height: 1.5; }
.columns .columns-text.text-animated { margin: 1vh 30px 0 0; }
.columns .content-div .button:hover { background-color: #FFFFFF !important; color: #FDB636 !important;}
.columns .columns-div { display: inline-block; width: 65%; padding: 30px 30px 30px 30px; }
.columns .column { position: relative; display: inline-block; vertical-align: top; vertical-align: top; }
.columns .column .column-image-div { position: relative; z-index: 1; height: 280px; }
.columns .column .column-image { padding: 0; height: 280px; width: 100%; background-size: cover !important; background-position: top center !important; border-radius: 5px; position: absolute; z-index: 2; }
.columns .column.text-version .column-image { display: inline-block; height: 100%; width: 334px; position: absolute; z-index: 2; }
.columns.animate .column .column-image-underlay { margin: 5px 0 0 0; }
.columns .column.text-version .column-image-div { height: 429px; width: 334px; display: inline-block; }
.columns .column.text-version .column-image { left: 0; }
.columns.animate .column.text-version .column-image-underlay { margin: 0 0 0 5px; }
.columns .column-text-div { position: relative; padding: 20px; margin: -5px 0 0 0; }
.columns .column-text-div::after { content: ''; background: url('/wp-content/themes/eclipse360/assets/images/highlight-corner.png'); height: 50px; width: 50px; position: absolute; bottom: 20px; left: 20px; background-size: contain !important; background-repeat: no-repeat !important; transition: all .25s ease-in-out; }
.columns .column-text-div.animate::after { bottom: 0; left: 0; }
.columns .column.text-version .column-text-div { display: inline-block; height: 429px; padding: 20px 20px 20px 25px; margin: 0 0 0 -5px; border-top-right-radius: 5px; border-bottom-left-radius: 0; vertical-align: top; width: calc(100% - 334px); }
.columns .column-overline { font-family: "Open Sans"_bold, sans-serif; font-size: 18px; line-height: 1.5; text-transform: uppercase; padding: 10px 0 0 0; }
.columns .column-title { font-family: "Open Sans", sans-serif; font-size: 25px; font-weight: 600; padding: 0; }
.columns .column-text { font-family: "Open Sans", sans-serif; font-size: 18px; padding: 5px 0 0 0; margin: 0; line-height: 1.5; }
.columns .column-text .larger { font-size: 36px; font-weight: 600; }
.columns .button { margin: 20px 0 0 0; }
.columns .column-link:hover .button { background-color: #FFFFFF !important; }

/* COUNT UP PIECES */
.column-title-piece { display: inline-block; font-size: 85px; font-weight: 800; line-height: 90px; padding: 30px 0 15px 0; }

/* FANCY BOX */
.fancybox-close-small { margin: 0 !important; }
.fancybox-bg { background-color: rgba(0, 54, 91, 0.5); }
.fancybox-content { padding: 30px; background-color: #00365b; color: #fff; position: absolute; bottom: 20px; right: 20px; width: 540px; max-width: 90%; }
.fancybox-content a { color: #00abbd; }
.compensate-for-scrollbar { margin: 0 !important; }
.fancybox-slide { left: -3%; top: -7%; }

/* FIFTY-FIFTY */
.fifty-fifty { position: relative; margin: 0 !important; }
.fifty-fifty-background-image { position: absolute; left: 0; bottom: 0; height: 773px; width: 100%; background-size: cover !important; background-position: center center !important; }
.fifty-fifty-image-overlay { position: absolute; bottom: 0; left: 0; background-color: rgba(0,0,0,.15); width: 100%; height: 100%; vertical-align: top; border-top-right-radius: 5px; border-bottom-right-radius: 5px; z-index: 3; }
.fifty-fifty-image-stuff { position: absolute; height: 520px; width: 520px; top: 50%; left: 50%; transform: translate(-50%, -50%); }
.fifty-fifty-image-div { position: relative; display: inline-block; width: 50%; vertical-align: top; }
.fifty-fifty-image { position: absolute; background-repeat: no-repeat !important; background-position: center center !important; border-top-right-radius: 5px; border-bottom-right-radius: 5px; height: 100%; width: 100%; z-index: 2; }
.fifty-fifty-image .image-link { position: relative; display: inline-block; height: 100%; width: 100%; z-index: 4; }
.fifty-fifty-image .image-anchor { position: absolute; bottom: 30px; left: 30px; }
.fifty-fifty-image .image-anchor.inverse { left: unset; right: 30px; }
.fifty-fifty-image .image-anchor .image-text { position: absolute; bottom: 110px; white-space: nowrap; left: -7px; transform: rotate(-90deg); font-family: "Open Sans", sans-serif; font-size: 14px; text-shadow: 1px 0 0 #000, 0 -1px 0 #000, 0 1px 0 #000, -1px 0 0 #000; transition: all .25s ease-in-out; }
.fifty-fifty-image .image-anchor .image-line { position: absolute; bottom: 65px; left: 28px; height: 0; width: 1px; background-color: #FFFFFF; transition: all .25s ease-in-out; }
.fifty-fifty-image .image-anchor.inverse .image-text { left: -6px; }
.fifty-fifty-image .image-link:hover .image-text { bottom: 135px; }
.fifty-fifty-image .image-link:hover .image-line { height: 40px; }
.fifty-fifty-image .image-anchor .image-icon { border: 1px solid #FFFFFF; border-radius: 90px; }
.fifty-fifty-image .image-anchor .image-icon.camera-icon { padding: 20px 17px 20px 17px; }
.fifty-fifty-image .image-anchor .image-icon.video-icon { padding: 20px 15px 20px 19px; }
.fifty-fifty-image .image-anchor .image-icon img { height: 16px; width: 22px; }
.fifty-fifty-image-div.inverse { left: 50%; }
.fifty-fifty-image-div.inverse .fifty-fifty-image { border-top-left-radius: 5px; border-bottom-left-radius: 5px; border-right: 0; border-top-right-radius: 0; border-bottom-right-radius: 0; }
.fifty-fifty-image-div.inverse .fifty-fifty-image .fifty-fifty-image-overlay { border-top-left-radius: 5px; border-bottom-left-radius: 5px; border-right: 0; border-top-right-radius: 0; border-bottom-right-radius: 0; }
.fifty-fifty-text { position: relative; display: inline-block; width: 50%; vertical-align: top; }
.fifty-fifty-text.inverse { left: -50%; }
.fifty-fifty-content { position: absolute; top: 50%; transform: translateY(-50%); padding: 0 60px 0 60px; width: 100%; font-family: "Open Sans", sans-serif; font-size: 18px; }
.fifty-fifty-content strong { font-size: 18px; }
.fifty-fifty-content h2 { font-family: "Open Sans", sans-serif; font-size: 62px; font-weight: 300; padding: 0 0 30px 0; line-height: 1.1; }
.fifty-fifty-content h2.larger-heading { font-size: 42px !important; font-weight: 600; display: none; }
.fifty-fifty .text { padding: 10px 0 0 0; }
.fifty-fifty .text p:first-of-type { font-weight: 500; font-size: 22px; }
.fifty-fifty-content .text a { transition: all .25s ease-in-out; }
.fifty-fifty-container a:hover .button { background-color: #FFFFFF !important; }

.fifty-fifty-container a .team .position.bottom-right { transform: rotate(270deg); top: 265px; left: -10px; }
.fifty-fifty-container a:hover .team .position.bottom-right { transform: rotate(360deg); top: 265px; left: -20px; }

.fifty-fifty-container a .team .position.bottom-left { transform: rotate(0deg); top: 265px; left: -20px; }
.fifty-fifty-container a:hover .team .position.bottom-left { transform: rotate(90deg); top: 255px; left: -20px; }

.fifty-fifty-container a .team .position.top-right { transform: rotate(180deg); top: 255px; left: -10px; }
.fifty-fifty-container a:hover .team .position.top-right { transform: rotate(270deg); top: 265px; left: -10px; }

.fifty-fifty-container a .team .position.top-left { transform: rotate(90deg); top: 255px; left: -20px; }
.fifty-fifty-container a:hover .team .position.top-left { transform: rotate(180deg); top: 255px; left: -10px; }

.fifty-fifty-content ul { margin: 30px 0 0 0; }
.fifty-fifty-content .no-paragraph p { margin-bottom: unset; }
.fifty-fifty .button { margin: 40px 10px 0 0; }
.fifty-fifty .button:hover { background-color: #FFFFFF !important; }
.fifty-fifty .button-2 { margin: 10px 0 0 0; }
.fifty-fifty-image-div.team .fifty-fifty-image { max-width: 520px; max-height: 520px; margin: 0; border-radius: 90%; /*top: 50%; transform: translateY(-50%);*/ }
.fifty-fifty-image-div.team .position { height: 275px; width: 275px; border-radius: 0 0 0 120%; transition: all .25s ease-in-out; }
.fifty-fifty-image-div.team.inverse .position { top: 320px; left: 115px; }
.fifty-fifty-content .text.quote { padding: 30px 0 0 60px; position: relative; }
.fifty-fifty-content .text .quote { background: url('/wp-content/themes/eclipse360/assets/images/quotes.png'); background-size: cover !important; background-position: center center !important; background-repeat: no-repeat !important; height: 30px; width: 38px; position: absolute; top: 30px; left: 5px; }
.fifty-fifty-content ul li { background: url('/wp-content/themes/eclipse360/assets/images/list-icon.png'); display: list-item; list-style: none; padding: 0 0 0 25px; margin: 0 0 10px 0; background-size: 15px 15px !important; background-repeat: no-repeat !important; background-position: center left !important; }

.fifty-fifty .fifty-fifty-left { display: inline-block; width: calc(41% - 60px); vertical-align: top; padding: 50px 60px 0 0; }
.fifty-fifty .fifty-fifty-left .fifty-fifty-content { position: unset; transform: unset; padding: 0; font-size: 18px; }
.fifty-fifty .fifty-fifty-left .fifty-fifty-content p { font-size: 24px; font-weight: 400; line-height: 60px; }
.fifty-fifty .quote h2 { font-size: 36px; font-weight: 400; line-height: 36px; width: 100%; padding: 0; }
.fifty-fifty h2 { font-size: 40px; font-weight: 400; line-height: 60px; width: 100%; padding: 0; }
.fifty-fifty h2 strong { font-size: 40px; font-weight: 700; line-height: 60px; }
.fifty-fifty .fifty-fifty-left .section-text { width: 100%; padding: 0; }
.fifty-fifty .fifty-fifty-left .section-text.position { font-size: 18px; font-weight: 600; line-height: 65px; } 
.fifty-fifty .fifty-fifty-right { display: inline-block; width: calc(59% - 30px); vertical-align: top; padding: 50px 30px 0 0; }
.fifty-fifty .fifty-fifty-right .fifty-fifty-content { position: unset; transform: unset; padding: 0; font-size: 18px; }
.fifty-fifty .fifty-fifty-right .fifty-fifty-content p { font-size: 20px; padding: 20px 0 0 0; }
.fifty-fifty .fifty-fifty-right .section-text { width: 100%; padding: 0; }
.fifty-fifty .fifty-fifty-right .section-text.position { font-size: 18px; font-weight: 600; line-height: 65px; }
.fifty-fifty .quote .fifty-fifty-content .section-text p { font-size: 22px; font-weight: 400; line-height: 32px; padding: 20px 0 0 64px; }
.fifty-fifty .quote .fifty-fifty-content .section-text p::before { content: ''; background: url('/wp-content/themes/eclipse360/assets/images/quotes.png'); background-size: cover !important; background-position: center center !important; background-repeat: no-repeat !important; height: 39px; width: 49px; position: absolute; top: 30px; left: 0; }
.fifty-fifty .fifty-fifty-left .section-heading { left: 0; top: 60px; }
.fifty-fifty .fifty-fifty-left .section-heading.animated { top: 0; }
.fifty-fifty .fifty-fifty-left .section-text { left: 0; top: 60px; }
.fifty-fifty .fifty-fifty-left .section-text.animated { top: 0; }
.fifty-fifty .fifty-fifty-right .section-heading { position: relative; left: 0; top: 60px; opacity: 0; transition: all 1s ease-in-out; }
.fifty-fifty .fifty-fifty-right .section-heading.animated { position: relative; top: 0; opacity: 1; transition: all 1s ease-in-out; }
.fifty-fifty .fifty-fifty-right .section-text { left: 0; top: 60px; }
.fifty-fifty .fifty-fifty-right .section-text.animated { top: 0; }

#our-promise .fifty-fifty-left { width: calc(50% - 5px); margin: -70px 0 0 5px; padding: 0; }
#our-promise .fifty-fifty-right { width: 50%; margin: -20px 0 124px 0; padding: 0; }
#our-promise .fifty-fifty-content h2 { font-size: 48px; line-height: 48px; font-weight: 300; }
#our-promise .fifty-fifty-content h2 strong { font-size: 48px; line-height: 48px; font-weight: 700; }
#our-promise .fifty-fifty-right p { max-width: 550px; }
.link-button { font-weight: 600; color: #FFFFFF; border-bottom: 1px solid #FFFFFF; padding: 0 0 10px 0; margin: 80px 0 0 0; max-width: 484px; background: url(/wp-content/themes/eclipse360/assets/images/offsite.png); background-size: 13px 13px !important; background-repeat: no-repeat !important; background-position: 100% center !important; transition: all .5s ease-in-out; }
.link-button:hover { color: #FDB733; border-bottom: 1px solid #FDB733; background: url(/wp-content/themes/eclipse360/assets/images/offsite-gold.png); }

#performance-with-purpose a { color: #00365b; }
#performance-with-purpose a:hover { color: #00ABBD; }

/* FOOTNOTES */
.footnote-background { position: fixed; top: 0; left: 100%; height: 100vh; width: 100vw; background-color: rgba(0, 0, 0, .6); z-index: 100; transition: all .5s ease-in-out; }
.footnote-background.active { left: 0%; }
.footnote-link { font-size: 16px; font-weight: 300; line-height: 90px; transition: all .25s ease-in-out; }
.footnote-link:hover { color: #fdb736; }
.footnotes { position: fixed; top: 50%; left: 200%; width: 65%; background-color: #D9D9D9; font-size: 16px; font-weight: 400; padding: 62px 65px 42px 65px; line-height: 24px; color: #00365B; transform: translate(-50%, -50%); z-index: 300; transition: all .5s ease-in-out; }
.footnotes.active { left: 50%; }
.footnote-close { position: absolute; top: 0; right: 0; background: url('/wp-content/themes/eclipse360/assets/images/close.jpg'); background-size: contain !important; background-position: center center !important; height: 50px; width: 50px; }
.footnote-left { display: inline-block; width: 10px; vertical-align: top; }
.footnote-right { display: inline-block; width: calc(100% - 10px); vertical-align: top; padding: 0 0 10px 0; }
    
.special-footnote { position: relative; z-index: 1; margin: -230px auto 120px auto; max-width: 1025px; }

/* FULL-WIDTH */
.overview { z-index: 1; }
#overview .section-text { padding: 50px 30px 0 0; }
.full-width.ticker .section-text { width: 100%; padding: 0; right: 0; opacity: 1; }
.full-width.ticker .ticker-images { text-align: center; }
.full-width.ticker .ticker-images p { display: inline-block; }
.full-width.ticker .ticker-images img { vertical-align: middle; margin: 60px 45px 0 0; opacity: 0; transition: all .5s ease-in-out; }
.full-width.ticker .ticker-images img.animated { margin: 0 45px 0 0; opacity: 1; }
.ticker-1 img { transition-delay: 0.1s !important; }
.ticker-2 img { transition-delay: 0.2s !important; }
.ticker-3 img { transition-delay: 0.3s !important; }
.ticker-4 img { transition-delay: 0.4s !important; }
.ticker-5 img { transition-delay: 0.5s !important; }
.ticker-6 img { transition-delay: 0.6s !important; }

.aum .fifty-fifty-left { width: calc(50% - 120px); padding: 120px 60px 0 60px; }
.aum .fifty-fifty-right { width: calc(50% - 180px); padding: 120px 60px 0 120px; }
.aum .section-text { width: 100%; padding: 70px 0 40px 100px; }
.aum .section-text .column-title { padding: 0 0 0 20px; }
.aum .section-text .column-title .column-title-piece { font-size: 85px; line-height: 85px; font-weight: 700; }
.aum .section-text .column-title .column-title-piece sup { margin: -20px 0 0 0; }
.aum .section-text .column-subtitle-piece strong { font-size: 26px; line-height: 45px; font-weight: 700; }
.aum .section-text .column-subtitle-piece { font-size: 26px; line-height: 45px; font-weight: 400; margin: 10px 0 -10px 0; }
.aum .section-text .column-title p { padding: 0; }

.asset-mix .section-text { width: 100%; padding: 0 0 0 0; }
.asset-mix table { margin: 0 auto; max-width: 1025px; }
.asset-mix th { color: #FFFFFF; font-weight: 600; line-height: 30px; padding: 0 60px 10px 40px; }
.asset-mix .asset-heading { position: relative; border-bottom: unset; padding: 25px 120px 25px 40px !important; }
.asset-mix .asset-heading-background { position: relative; top: -60px; left: -50px; height: 50px; width: 0%; background: rgba(217, 217, 217, 0.20); transition: all 1s ease-in-out; transition-delay: .5s; }
.asset-mix .asset-heading-background.animated { width: calc(100% + 170px); }
.asset-mix .asset-heading p { position: absolute; top: 10px; font-weight: 600; z-index: 1; }
.asset-mix .asset-heading-value { position: relative; z-index: 1; }

.asset-mix tr.move-up { position: relative; top: -60px; }
.asset-mix tr.move-up2 { position: relative; top: -120px; }
.asset-mix tr.move-up3 { position: relative; top: -180px; }
.asset-mix tr.move-up4 { position: relative; top: -240px; }
.asset-mix td { color: #FFFFFF; font-size: 24px; font-weight: 400; line-height: 32px; border-bottom: 1px solid rgba(217, 217, 217, 0.20); padding: 10px 60px 10px 40px; }
.asset-mix td:first-of-type { padding: 10px 120px 10px 40px; }
.asset-mix .no-border td { border-bottom: unset; }

.video .section-text { width: 42%; padding: 30px 0 0 0; }

#local-purpose h1 { font-size: 40px; line-height: 60px; max-width: unset; }
#local-purpose .section-text { width: 59%; padding: 0; }
#local-purpose .footnote-link { color: #48484A; line-height: 30px; }
#local-purpose .footnote-link:hover { color: #fdb736; }

/* MASONRY IMAGES */
.masonry { padding: 33px 0 0 0; margin: 0 -15px 0 0; }
.masonry img { margin: 60px 0 0 0; opacity: 0; transition: all 1s ease-in-out; }
.masonry img.animated { margin: 0 0 0 0; opacity: 1; }

/* OVERLINES */
#overview .overline { min-width: 450px; }
#ceo .overline { min-width: 450px; }
#aum .overline { min-width: 500px; text-align: right !important; }
#asset-mix .overline { min-width: 500px; }
#bar-graph-returns .overline { min-width: 500px; text-align: right !important;  }

/* SLIDER */
.slides .content { position: relative; }

#timeline .dividing-line.animated { margin: 0 0 -90px -110px; }
#timeline .overline { position: relative; z-index: 1; }
#timeline .overline img { margin: 0 50px -24px 0; }
#timeline .slick-slide { margin: 41px 34px 0 0; border-left: 1px solid #FFFFFF; height: 815px; opacity: .2; transition: all 1s ease-in-out; }
#timeline .slick-slide.no-content { border-left: unset; }
#timeline .slick-slide.slick-current { opacity: 1; }
#timeline .timeline-slider { margin: 0 -20% 0 0; }
#timeline .timeline-slider .slide .overline { font-size: 32px; font-weight: 600; line-height: 32px; letter-spacing: 0; }
#timeline .timeline-slider .slide .title { font-size: 26px; font-weight: 400; line-height: 36px; height: 70px; padding-bottom: 10px; }
#timeline .timeline-slider .slide .timeline-image { width: 100% !important; overflow: hidden; padding: 30px 0 0 0; opacity: 0; transition: all 1s ease-in-out; }
#timeline .timeline-slider .slide .timeline-image.animated { padding: 0; opacity: 1; }
#timeline .timeline-slider .slide .timeline-image img { width: 100% !important; max-height: 325px; object-fit: cover; object-position: center center; }
#timeline .timeline-slider .slide .content { padding: 0 22px; }
#timeline .slick-prev { content: ''; cursor: pointer; font-size: 0; background: url(/wp-content/themes/eclipse360/assets/images/white-arrow.png); background-size: contain; border: unset; height: 60px; width: 60px; background-repeat: no-repeat; position: absolute; z-index: 1; bottom: -115px; left: calc(71% + 5px); transform: rotate(180deg); transition: all .5s ease-in-out; }
#timeline .slick-prev:hover { left: calc(71% + 15px); }
#timeline .slick-prev.inactive { display: none !important; }
#timeline .slick-next { content: ''; cursor: pointer; font-size: 0; background: url(/wp-content/themes/eclipse360/assets/images/white-arrow.png); background-size: contain; border: unset; height: 60px; width: 60px; background-repeat: no-repeat; position: absolute; z-index: 1; bottom: -115px; left: calc(71% + 80px); transition: all .5s ease-in-out; }
#timeline .slick-next:hover { left: calc(71% + 70px); }
#timeline .slick-next.inactive { display: none !important; }
#timeline .slick-dots li { display: inline-block; }
#timeline-nav { padding: 20px 0 90px 56px; margin: -85px 0 0 0; border-top: 1px solid #FFFFFF; z-index: 0; }
#timeline-nav .slide-nav { position: relative; display: inline-block; color: #FFFFFF; padding: 0 12px; opacity: .5; transition: all .5s ease-in-out; }
#timeline-nav .slide-nav.no-content { display: none; }
#timeline-nav .slide-nav .slide-nav-line { position: absolute; top: 17px; left: 50%; width: 1px; height: 35px; background-color: #FFFFFF; transform: translateY(-50%); }
#timeline-nav .slide-nav .slide-nav-text { font-size: 20px; font-weight: 400; line-height: 32px; padding: 35px 0 0 0; transition: all 1s ease-in-out; }
#timeline-nav .slide-nav.active .slide-nav-text { font-weight: 700; }
#timeline-nav .slide-nav.active { opacity: 1; }
#timeline-nav .slide-nav:hover { opacity: .8; }

/* STACKED BAR GRAPH */
.highcharts-axis.highcharts-yaxis { display: none; }
.highcharts-axis.highcharts-xaxis { display: none; }
.highcharts-button.highcharts-contextbutton { display: none; }
.highcharts-credits { display: none; }
.highcharts-legend text { cursor: default !important; color: #000000 !important; font-weight: 300 !important; }

/* STATS */
.stats .left { flex: 1; display: flex; flex-direction: column; }
.stats .right { flex: 3; }
.stats h2 { margin-bottom: 10px; color: #fff; font-weight: 300; }
.stats .left h3 { margin-top: 0; margin-right: auto; color: #fff; }
.stats .left h3::after, .underline::after { height: 2px; }
.stats .left h3::after { width: 100%; }
.stats { padding: 90px 30px; color: #fff; position: relative; }
.stats > .bg { position: absolute; pointer-events: none; top: 0; left: 0; width: 100%; height: 100%; }
.stats .container { display: flex; flex-wrap: wrap; padding: 0; }
.stats .right { padding-left: 60px; }
.stats .bg::before, .stats .bg::after { content: ""; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none; }
.stats .bg::before { background: linear-gradient( to right, rgba(0, 171, 189, 0.5), transparent, rgba(0, 54, 91, 0.7) 50% ); }
.stats .bg::after { background: linear-gradient(to bottom, transparent 70%, rgba(0, 54, 91, 0.7)); }
.stats .stat-wrap { display: flex; align-items: flex-start; flex-wrap: wrap; }
.stat { flex-basis: 33%; padding: 0 40px 40px 0; display: flex; flex-wrap: wrap; }
.stat .pre-text, .stat .number, .stat .text, .stat .symbol { font-weight: 700; line-height: 1.2; }
.stat .number, .stat .symbol, .stat .pre-text { font-size: 55px; }
.stat .subtext { margin-top: 10px; }
.stat .label { line-height: 1.3; }
.stat .text { flex-basis: 100%; margin-top: 5px; font-size: 45px; }
.stat:last-child { flex-basis: 67%; } 
.stat:last-child .subtext { display: flex; position: relative; }
.stat:last-child .subtext img { position: absolute; top: 0; right: 0; transform: translate(120%, -50%); width: 200px; }

/* TILES */
.tiles .content { position: relative; display: inline-block; width: calc(40% - 60px); padding: 0; vertical-align: top; z-index: 10; }
.tiles .section-heading { display: block; width: 100%; padding: 0 0 30px 0; }
.tiles .section-text { display: block; width: 100%; padding: 0; }

#global-aum .section-text { transition-delay: 1s; }
#global-aum .section-text p { line-height: 90px; }

.tiles .tiles-div { padding: 30px 0 0 0; margin: 0; }
.tiles .tile-column-1 { display: inline-block; vertical-align: top; width: calc(30% - 8px); padding: 8px 8px 8px 0; opacity: 1; transition: all 1s ease-in-out; }
.tiles .tile-column-2 { display: inline-block; vertical-align: top; width: calc(40% - 16px); padding: 8px; opacity: 1; transition: all 1s ease-in-out; }
.tiles .tile-column-3 { display: inline-block; vertical-align: top; width: calc(30% - 8px); padding: 8px 0 8px 8px; opacity: 1; transition: all 1s ease-in-out; }

.tiles .tile-image { position: relative; top: 60px; background-size: cover !important; background-position: bottom center !important; height: 324px; width: 100%; margin: 16px 0; overflow: hidden; opacity: 0; transition: all 1s ease-in-out; }
.tiles .tile-image.animated { top: 0; opacity: 1; }
.tiles .tile-column-2 .tile-image { height: 574px; }
.tiles .tile-column-3 .tile-image:first-of-type { margin: -74px 0 0 0; }
.tiles .tile-image .tile-content { position: absolute; bottom: -60px; left: 0; width: calc(100% - 50px); padding: 0 26px 20px 24px; opacity: 0; transition: all 1s ease-in-out; }
.tiles .tile-image .tile-content.animated { bottom: 0; opacity: 1; }

.tiles .tile-image .tile-percent { font-size: 45px; font-weight: 700; line-height: 55px; }
.tiles .tile-image .tile-title { display: inline-block; width: 35%; font-size: 16px; font-weight: 700; line-height: 30px; }
.tiles .tile-image .tile-title.no-subtitle { width: 100%; }
.tiles .tile-image .tile-subtitle { display: inline-block; width: 65%; font-size: 16px; font-weight: 600; line-height: 22px; text-align: right; }

/*#investment-focus .content { position: relative; background-color: #467B96; z-index: 1; }*/
#investment-focus .section-text { right: unset; left: -100%; }
#investment-focus .section-text.animated { right: unset; left: 0; }
#investment-focus .dividing-line.animated { margin: 0 0 -90px -180px; }

.tiles .investment-tiles { position: absolute; top: -151px; left: -14%; display: inline-block; width: 100%; height: calc(100% + 400px); vertical-align: top; }
.tiles .investment-tiles-background { position: absolute; top: 0; height: 100%; width: 100%; left: 50%; }
.tiles .investment-tiles .previous-investment { background: url(/wp-content/themes/eclipse360/assets/images/black-arrow.png); height: 62px; width: 62px; position: absolute; top: 540px; right: -105px; z-index: 2; background-size: contain !important; transition: all .5s ease-in-out; }
.tiles .investment-tiles .previous-investment:hover { right: -115px; }
.tiles .investment-tiles .next-investment { background: url(/wp-content/themes/eclipse360/assets/images/black-arrow.png); height: 62px; width: 62px; position: absolute; top: 540px; right: -185px; z-index: 2; background-size: contain !important; transform: rotate(180deg); transition: all .5s ease-in-out; }
.tiles .investment-tiles .next-investment:hover { right: -175px; }
.tiles .investment-links { padding: 90px 60px 0 0; margin: 0; }
.tiles .investment-link { position: relative; border-top: 1px solid #D9D9D9; width: 100%; color: #FFFFFF; font-size: 24px; font-weight: 300; line-height: 36px; padding: 10px 20px 10px 20px; }
.tiles .investment-links a:last-of-type .investment-link { border-bottom: 1px solid #D9D9D9; }
.tiles .investment-link.active { font-weight: 700; }
.tiles .investment-link .text { padding: 0 50px 0 0; }
.tiles .investment-link .arrow { background: url(/wp-content/themes/eclipse360/assets/images/blue-arrow-no-circle.png); background-size: contain; height: 14px; width: 33px; display: inline-block; position: absolute; right: 20px; top: 22px; transition: all .5s ease-in-out; }
.tiles .investment-link:hover .arrow { right: 0; }
.tiles .investment-flyout { position: absolute; top: 0; width: calc(70% - 230px); height: 100%; background-color: #F9F9F9; left: 100%; opacity: 0; transition: all 1s ease-in-out; }
.tiles .investment-flyout.active { left: calc(35% + 420px); opacity: 1; }
.tiles .investment-flyout-image { position: relative; background-size: cover !important; background-position: 50% 50% !important; height: 519px; width: 100%; }
.tiles .investment-flyout-content { max-width: 875px; padding: 101px 80px 0 92px; }
.tiles .investment-flyout-title { font-size: 36px; line-height: 48px; padding: 0 0 30px 0; }
.tiles .investment-flyout-text { font-size: 20px; font-weight: 400; line-height: 32px; }
.tiles .investment-flyout-content .column-title-piece { color: #48484A; }

.tiles .investment-accordion { display: none; }
.tiles .investment-accordion.active { display: block; }
.tiles .investment-accordion .investment-flyout-image { margin: 10px 0 0 -32px; width: 125%; }
.tiles .investment-accordion .investment-flyout-content { background-color: #FFFFFF; max-width: unset; width: 100%; margin: 0 0 0 -32px; padding: 60px 120px 60px 60px; }
.tiles .investment-link.accordion.active .arrow { transform: rotate(90deg); }
.tiles .investment-link.accordion.active:hover .arrow { right: 20px; }

/* VIDEO */
.video-with-image { position: relative; }
.video-with-image #video-placeholder-image { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; object-position: center center; opacity: 1; visibility: visible; transition: all .5s ease-in-out; }
.video-with-image #video-placeholder-image.inactive { opacity: 0; visibility: hidden; }

/* FOOTER */
#footer { position: relative; background-color: transparent; padding: 0 0 0 0; margin: -90px 0 0 0; border-top: 1px solid #FFFFFF; }
#footer .container { padding: 0 0 0 20px; max-width: 1440px; margin: 0 auto; }
#footer .footer-logo { display: inline-block; width: calc(100% - 567px); }
#footer .logo img { height: 36px; margin: 0 0 -10px 0; }
#footer .footer-title { display: inline-block; color: #FFFFFF; font-size: 18px; font-weight: 600; line-height: 90px; letter-spacing: 5.4px; padding: 0 50px; border-right: 1px solid #FFFFFF; }
#footer .footer-date { display: inline-block; color: #FFFFFF; font-size: 18px; font-weight: 600; line-height: 90px; letter-spacing: 5.4px; padding: 0 50px; }

/*****************************************************/
/* RESPONSIVE WIDTHS */
@media (max-width: 1750px) {
    #timeline .slick-slide { height: 730px; }
    #timeline .timeline-slider .slide .title { font-size: 22px; line-height: 30px; }
    #timeline .timeline-slider .slide .content p { font-size: 18px; line-height: 27px; }
}

@media (max-width: 1500px) {
    .tiles .investment-flyout.active { left: calc(20% + 420px); }
    .tiles .investment-flyout { width: calc(70% - 90px); }
}

@media (max-width: 1450px) {
    #video-image { height: 55vh; }
    #video-image .header-video { height: 55vh; }
    .side-button { height: 59px; }
    .side-button.sticky { width: 45px; }
    .side-button-icon { height: 35px; width: 27px; top: 10px; left: 10px; }
    .side-button-text { font-size: 14px; line-height: 17px; padding: 10px 0 0 55px; }
    
    .tiles .investment-flyout-content { padding: 69px 40px 0 30px; }
    .tiles .investment-flyout-bottom-triangle { bottom: -80px; }
}

@media (max-width: 1435px) {
    #timeline .slick-slide { height: 755px; }    
}

@media (max-width: 1400px) {
    .bar-graph.smaller-font .line-value { font-size: 14px; }
    .bar-graph.smaller-font .line-value.bold-value { font-size: 14px; }
}

@media (max-width: 1375px) {
    #header .container { padding: 0 20px; }
    .full-width.ticker .ticker-images img { margin: 60px 25px 0 0; }
    .full-width.ticker .ticker-images img.animated { margin: 0 25px 0 0; }
    #footer .container { padding: 0 20px; }
}

@media (max-width: 1325px) {
    #timeline .slick-slide { height: 780px; }
}

@media (max-width: 1300px) {
    #header .header-banner { top: 140px; height: 450px; }
    #header .header-banner-color { height: 550px; }
    #ceo-cio { padding: 600px 0 150px 0 !important; background: #00365b; }
    #ceo-cio .background-images .bg-image:first-of-type { width: 101% !important; height: 750px !important; top: -15vh !important; }
    .ceo-cio.overlay-animated .bg-image:nth-child(2) { display: none; }
    #ceo-cio .fifty-fifty-left { width: calc(100% - 120px); padding: 60px 30px 60px 30px; }
    #ceo-cio .fifty-fifty-right { width: calc(100% - 120px); padding: 0 30px 0 30px; }

    #global-aum { padding: 200px 30px 600px 30px !important; }
    .tiles .content { width: calc(100% - 60px); }
    .tiles .tiles-div { width: 100%; }
    .tiles .tile-image:last-of-type { margin: 60px 0 0 0 !important; }
    .tiles .tile-image.animated:last-of-type { margin: 15px 0 0 0 !important; }
    .tiles .tile-column-1 { position: relative; top: 559px; left: -8px; width: 100%; padding: 8px; }
    .tiles .tile-column-1 .tile-image { width: calc(50% - 16px); display: inline-block; }
    .tiles .tile-column-1 .tile-image.tile-image-2 { width: 50%; margin: 16px 0 0 16px !important; vertical-align: top; }
    .tiles .tile-column-2 { position: absolute; top: 180px; left: -8px; width: 100%; }
    .tiles .tile-column-2 .tile-image-3 { background-position: 50% 50% !important; }
    
    .tiles .tile-column-3 { position: relative; top: 534px; left: -8px; width: 100%; }
    .tiles .tile-column-3 .tile-image { width: calc(50% - 16px); display: inline-block; }
    .tiles .tile-column-3 .tile-image.tile-image-4 { margin: 0 !important; }
    .tiles .tile-column-3 .tile-image.tile-image-5 { width: 50%; margin: 0 0 0 16px !important; vertical-align: top; }
    .tiles .tile-image .tile-title { font-size: 12px; }
    .tiles .tile-image .tile-subtitle { font-size: 12px; }
    
    #local-purpose { padding: 0 30px 120px 30px !important; }
    #local-purpose .section-text { width: 100%; }
    
    .tiles .investment-links { padding: 60px 40px 0 0; }
    .tiles .investment-tiles-background { display: none; }
    .tiles .investment-flyout { display: none; }
    .tiles .investment-flyout-image-triangle { display: none; }
    .tiles .investment-tiles .previous-investment { display: none; }
    .tiles .investment-tiles .next-investment { display: none; }
}

@media (max-width: 1250px) {
    #timeline .slick-slide { height: 730px; }
    #timeline .timeline-slider .slide .title { font-size: 20px; line-height: 26px; }
    #timeline .timeline-slider .slide .content p { font-size: 16px; line-height: 26px; }
}

@media (max-width: 1230px) {
    .stats { padding: 60px 30px; }
    .stats .left, .stats .right { flex-basis: 100%; padding: 0; }
}

@media (max-width: 1200px) {
    .bar-graph.smaller-font .line-value { font-size: 11px; }
    .bar-graph.smaller-font .line-value.bold-value { font-size: 11px; }
    .bar-graph.smaller-font .line-label { font-size: 11px; }
    .ticker-images p { width: 30%; }
    .aum .section-text { padding: 30px 0 40px 0px; width: calc(100% - 50px); }
    .aum .section-text .column-title .column-title-piece { font-size: 65px; line-height: 75px; }
    .aum .section-text .column-subtitle-piece strong { font-size: 20px; line-height: 32px; }
    .aum .section-text .column-subtitle-piece { font-size: 20px; line-height: 32px; }
}

@media (max-width: 1111px) {
    #our-promise .fifty-fifty-left { width: 100%; margin: 0 0 0 5px; }
    #our-promise .fifty-fifty-right { width: 100%; margin: -150px 0 131px 0; }
}

@media (max-width: 1100px) {
    .aum .fifty-fifty-right { width: calc(50% - 120px); padding: 120px 60px 0 60px; }
    #timeline .slick-slide { height: 680px; }
    #timeline-nav .slide-nav { padding: 0 5px; }
    #timeline-nav .slide-nav .slide-nav-text { font-size: 16px; }
}

@media (max-width: 1050px) {
    #timeline { padding: 200px 30px 120px 30px !important; }
    #timeline .overline img { display: block; margin: -70px 0 0 0; }
    #timeline .dividing-line.animated { margin: 0 0 -90px -50px; }
}

@media (max-width: 1023px) {
    .side-button.sticky:hover { width: 210px; }
    #video-image { height: 40vh; }
    #video-image .header-video { height: 40vh; }
    .hide-on-mobile { display: none !important; }
    .stat { flex-basis: 50%; }
    
    #aum { padding: 120px 30px 90px 30px !important; }
    #aum .bg-image { height: 3550px !important; }
    .bar-graph .line-value { font-size: 16px; top: -25px; }
    .bar-graph .line-value.bold-value { font-size: 16px; }
    .bar-graph .line-label { min-width: unset !important; font-size: 16px; padding: 0 0 0 6px; }
    .bar-graph.smaller-font .line-value { font-size: 16px; }
    .bar-graph.smaller-font .line-value.bold-value { font-size: 16px; }
    .bar-graph.smaller-font .line-label { font-size: 16px; padding: 0 0 0 45px; }
    .bar-graph .line { min-width: unset !important; /*width: 16% !important;*/ }
    .bar-graph .benchmark-lines .line { width: 12% !important; }
    .bar-graph .benchmark-line { min-width: 120px !important; }
    .bar-graph #cumulative-value-added-by-bci .line-label { padding: 0 0 0 15px; }
    .bar-graph #assets-managed-in-house .line-label { padding: 0 0 0 45px; }
    .bar-graph .text { font-size: 16px; }
    .bar-graph .bar-graph-main-legend { font-size: 14px; padding: 10px 20px 0 0; }
    
    #overview .section-heading { margin-block-start: 0; }
    #overview .section-text { width: calc(100% - 50px); }
    #overview .bg-image { height: 135vh !important; }
    #ceo .section-heading { margin-block-start: 0; margin-block-end: 0; }
    #ceo .section-text { width: 100%; }
    #ceo-video .section-heading { margin-block-start: 0; margin-block-end: 0; }
    #ceo-video #vimeo-video { height: 55vw !important; margin: 30px 0 0 0; }
    #performance-with-purpose .fifty-fifty-left { width: calc(100% - 60px); }
    #performance-with-purpose .fifty-fifty-right { width: 100%; padding: 20px 30px 0 0; }
    .masonry img:nth-child(1) { width: calc(100% - 48px) !important; padding: 0 16px !important; height: 408px; object-fit: cover; object-position: top center; }
    .masonry img:nth-child(2) { width: calc(55% - 32px) !important; padding: 16px 8px 0 16px !important; height: 408px; object-fit: cover; object-position: 50% 30%; }
    .masonry img:nth-child(3) { width: calc(45% - 32px) !important; padding: 16px 16px 0 8px !important; height: 408px; object-fit: cover; object-position: 0% 50%; }
    
    #bar-graph-returns { padding: 0 0 90px 0; }
    .bar-graph .content { padding: 30px 0 0 0; width: calc(100% - 50px); }
    #returns { margin: 60px 0 0 0; width: 100%; }
    .bar-graph .dividing-line .line { width: 550px !important; }
    
    #asset-mix { padding: 120px 0 0 0; }
    .asset-mix .section-text { width: calc(100% - 50px); }
    #investment-focus { padding: 140px 30px 90px 30px !important; }
    #investment-focus .dividing-line.animated { margin: 0 0 -70px -50px; }
    
    #timeline .timeline-slider .slide .title { height: auto; }
}

@media (max-width: 999px) {
    #timeline .timeline-slider { margin: 0 -90% 0 0; }
    #timeline .slick-prev { left: calc(43% + 5px); }
    #timeline .slick-prev:hover { left: calc(43% + 15px); }
    #timeline .slick-next { left: calc(43% + 80px); }
    #timeline .slick-next:hover { left: calc(43% + 70px); }
}

@media (max-width: 900px) {
    .dividing-line { margin-bottom: -70px; }
    .dividing-line.animated { margin-bottom: -70px; }
    
    #video-image { height: 60vh; background-position: 30% 50%; }
    #video-image .header-video { height: 60vh; }
    .header-video { display: none; }
    #header .header-banner { left: 30px; width: 450px; }
    #header .header-banner-color { width: 450px; }
    #header .header-banner-text { font-size: 45px; line-height: 60px; left: 55px; }
    h4 { font-size: 20px; line-height: 27px; }
    .overline { font-size: 17px; }
    p { font-size: 16px; line-height: 30px; }
    
    .section-heading { font-size: 36px; line-height: 36px; }
    .fifty-fifty h2 { font-size: 36px; line-height: 36px; }
    .fifty-fifty .fifty-fifty-left .fifty-fifty-content p { font-size: 17px; line-height: 30px; }
    #overview .section-text { padding: 0 30px 0 0;}
    #overview .bg-image { height: 126vh !important; }
    
    .aum .fifty-fifty-left { width: 100%; padding: 60px 0 0 0; }
    .aum .fifty-fifty-right { width: 100%; padding: 60px 0 0 0; }
    
    .asset-mix th { font-size: 14px; line-height: 17px; }
    .asset-mix td { font-size: 14px; line-height: 17px; padding: 0 60px 10px 40px; }
    .asset-mix .asset-heading p { font-size: 14px; line-height: 17px; }
    .asset-mix .asset-heading-background { height: 37px; }
    .asset-mix tr.move-up { top: -70px; }
    .asset-mix tr.move-up2 { top: -140px; }
    .asset-mix tr.move-up3 { top: -210px; }
    .special-footnote { margin: -300px auto 120px auto; }
    
    #local-purpose h1 { font-size: 36px; line-height: 36px; }
    
    .fifty-fifty .quote .fifty-fifty-content .section-text p { font-size: 17px; line-height: 25px; }
    .fifty-fifty .fifty-fifty-right .fifty-fifty-content p { font-size: 17px !important; line-height: 25px; }
    .video .section-text { width: calc(100% - 50px); }
    .video .section-text iframe { width: 100% !important; height: 440px !important; }
    .bar-graph .benchmark-line { min-width: 120% !important; }
    .bar-graph .benchmark .line-value { left: 115% !important; }
    
    .tiles .content { width: 100%; }
    .tiles .investment-links { padding: 60px 0 0 0; margin: 0 -30px 0 0; }
    .tiles .investment-link { font-size: 20px; padding: 10px 0; }
    
    .tiles .investment-accordion .investment-flyout-content { padding: 30px 30px 30px 30px; width: calc(100% - 28px); }
    .tiles .investment-accordion .investment-flyout-image { width: 150%; }
    
    #ticker { padding: 0 10px 120px 10px !important; }
    #global-aum .section-text p { line-height: 22px; }
    .tiles .tile-image.animated:last-of-type { margin: -42px 0 0 0 !important; }
    .tiles .tile-column-1 .tile-image.tile-image-2 { margin: 16px 0 0 16px !important; }
    .tiles .tile-column-3 .tile-image.tile-image-5 { margin: 0 0 0 16px !important; }
}

@media (max-width: 800px) {
    .header-video { display: none; }
    .header-banner-text { font-size: 55px; line-height: 65px; }
    .tiles .tile-image .tile-content { padding: 0 15px 10px 15px; width: calc(100% - 30px); }
}

@media (max-width: 782px) {
    #header .logo { display: inline-block; width: unset; }
    #header .header-title { font-size: 12px; }
    #header .header-date { font-size: 12px; }
    
    .logged-in .side-button.sticky { top: 46px; }
    #timeline-nav .slide-nav .slide-nav-text { font-size: 12px; }
    
    #footer .footer-logo { display: inline-block; width: unset; }
    #footer .footer-title { font-size: 12px; }
    #footer .footer-date { font-size: 12px; }
}

@media (max-width: 700px) {
    #video-image { width: 100%; top: -115px; left: 0; }
    .bar-graph.smaller-font .line-label { padding: 0 0 0 30px; }
    .image-slider-nav-container { display: none; }
    #timeline .slick-prev { left: calc(20% + 5px); }
    #timeline .slick-prev:hover { left: calc(20% + 15px); }
    #timeline .slick-next { left: calc(20% + 80px); }
    #timeline .slick-next:hover { left: calc(20% + 70px); }
}

@media (max-width: 675px) {
    #video-image { top: -160px; }
    #header .header-title { padding: 0 30px 0 30px; }
    #header .header-date { padding: 0 30px; }
    #header .header-banner { left: 80px; top: 188px; }
    .side-button { top: 91px; }
    
    #content-container { position: relative; top: -55px; }
    
    .asset-mix .asset-heading { padding: 25px 0 15px 10px !important; }
    .asset-mix .asset-heading-value { padding: 0 10px 0 10px; }
    .asset-mix th { padding: 0 10px 10px 10px; }
    .asset-mix td:first-of-type { padding: 0 10px 0 10px; }
    .asset-mix td { padding: 0 10px 0 10px; line-height: unset; }
    .asset-mix td:first-of-type { width: 50%; }
    .asset-mix tr:first-of-type { display: table; width: calc(100% - 20px); }
    .asset-mix tr th { width: 25%; }
    .asset-mix tr th:first-of-type { width: 50%; }
    .asset-mix tr.move-up { display: table; top: -40px; width: calc(100% - 20px); }
    .asset-mix tr.move-up2 { display: table; top: -80px; width: calc(100% - 20px); }
    .asset-mix tr.move-up3 { display: table; top: -120px; width: calc(100% - 20px); }
    .asset-mix .asset-heading-background { top: -40px; }
    .special-footnote { margin: -170px auto 60px auto; }
    
    .tiles .investment-accordion .investment-flyout-image { height: 319px; width: 140%; }
    
    #performance-with-purpose .fifty-fifty-left { padding: 20px 60px 0 0; }
    #timeline .slick-slide { height: 690px; }
    #our-promise .bg-image { height: calc(100% + 57px) !important; }
    #footer .footer-title { padding: 0 30px 0 30px; }
    #footer .footer-date { padding: 0 30px; }
}

@media (max-width: 650px) {
    #global-aum { padding: 200px 30px 400px 30px !important; }
    #global-aum .section-text { text-align: left !important; }
    #global-aum .section-text p { font-size: 12px; }
    
    #investment-focus { padding: 120px 30px 60px 30px !important; }
    .tiles .tile-column-1 { top: 0; }
    .tiles .tile-column-1 .tile-image-1 { width: 100%; top: 336px; height: 248px; }
    .tiles .tile-column-1 .tile-image.tile-image-2 { width: 100%; top: 327px; height: 248px; margin: 0 !important; }
    .tiles .tile-column-2 .tile-image-3 { height: 350px; }
    .tiles .tile-column-3 { top: 327px; }
    .tiles .tile-column-3 .tile-image.tile-image-4 { width: 100%; }
    .tiles .tile-column-3 .tile-image.tile-image-5 { width: 100%; margin: 7px 0 0 0 !important; }
}

@media (max-width: 600px) {
    html { overflow-x: hidden; }
    #video-image { background-position: 40% 50%; }
    #header .header-banner { width: calc(100% - 160px); }
    #header .header-banner-color { width: 100%; }
    #header .header-banner-text { left: 5vw; padding: 0 5vw 0 0; }
    .header-triangle { display: none; }
    
    .up-arrow { display: none; }
    .down-arrow { display: none; }
    .overline { font-size: 12px; letter-spacing: 2.2px; }
    
    .header-banner-text { font-size: 45px; line-height: 55px; }
    .column-title-piece { font-size: 65px; line-height: 75px; }
    
    #overview .section-heading { width: 100%; padding: 30px 10px 0 0; }
    #overview .section-text { width: 100%; }
    #ceo .section-text { padding: 40px 30px 0 0; }
    .masonry img:nth-child(2) { object-position: 25% 30%; }
    .masonry img:nth-child(3) { object-position: 25% 50%; }
    .aum .fifty-fifty-left { padding: 30px 0 0 0; }
    .aum .fifty-fifty-right { padding: 30px 0 0 0; }
    .aum .section-text { width: 100%; }
    .bar-graph .content { width: 100%; }
    .asset-mix .section-text { width: 100%; }
    
    #our-promise .fifty-fifty-content h2 { font-size: 32px; line-height: 42px; margin: 0; }
    #our-promise .fifty-fifty-content h2 strong { font-size: 32px; line-height: 42px; }
}

@media (max-width: 560px) {
    #header .logo img { height: 22px; }
    #header .header-title { padding: 0 30px; letter-spacing: 2.4px; }
    #header .header-date { letter-spacing: 2.4px; }
    
    #overview .overline { min-width: 300px; }
    #ceo .overline { min-width: 300px; }
    #aum .overline { min-width: 250px; text-align: right !important; }
    #asset-mix .overline { min-width: 275px; }
    #asset-mix .dividing-line.animated { width: 330px !important; }
    #bar-graph-returns { padding: 120px 30px 120px 30px !important; }
    #bar-graph-returns .overline { min-width: 260px; text-align: right !important;  }
    #bar-graph-returns .dividing-line .line { width: 309px !important; }
    .bar-graph .line-label { font-size: 10px; }
    
    .tiles .tile-image { width: 100%; }
    
    .tiles .tile-image .tile-subtitle { font-size: 14px; }
    .tiles .tile-image .tile-location { font-size: 20px; }
    .tiles .tiles-all-div { padding: 0; }
    .video .section-text iframe { height: 250px !important; }
    #footer .footer-logo img { height: 22px; margin: 0 0 -5px 0; }
    #footer .footer-title { padding: 0 30px; letter-spacing: 2.4px; }
    #footer .footer-date { letter-spacing: 2.4px; }
}
    
@media (max-width: 500px) {
    #header .header-title { padding: 0 20px; }
    #header .header-date { padding: 0 19px; }
    .header-banner-text.animated { top: 65%; }

    .side-button { width: 50px; right: 0%; }
    .side-button:hover { width: 210px; }
    .side-button-text { letter-spacing: 0; padding: 10px 0 0 50px; }
    #asset-mix { padding: 120px 10px 0 10px !important; }
    .asset-mix th { font-size: 12px; line-height: 14px; }
    
    .masonry img:nth-child(1) { height: auto; }
    .masonry img:nth-child(2) { height: 272px; }
    .masonry img:nth-child(3) { height: 272px; }
    
    #timeline .overline img { margin: -40px 0 0 0; max-width: 200px; }
    #timeline .timeline-slider { margin: 0 -120% 0 0; }
    #timeline .slick-prev { left: calc(15% + 5px); }
    #timeline .slick-prev:hover { left: calc(15% + 15px); }
    #timeline .slick-next { left: calc(15% + 80px); }
    #timeline .slick-next:hover { left: calc(15% + 70px); }
    #footer .footer-title { padding: 0 16px; }
    #footer .footer-date { padding: 0 10px; }
}

@media (max-width: 450px) {
    .header-banner-text { font-size: 32px; line-height: 42px; }
    #header .header-banner-text { font-size: 30px; }
    #aum .bg-image { height: 3450px !important; }
}

@media (max-width: 400px) {
    #overview .bg-image { height: 183% !important; }
    #delivering-for-our-clients { padding: 125px 30px 30px 30px !important; }
    .masonry img:nth-child(2) { height: 193px; }
    .masonry img:nth-child(3) { height: 193px; object-position: 5% 50%; }
    .bar-graph .benchmark .line-value { top: -17px; font-size: 12px; }
    #timeline .timeline-slider { margin: 0 -130% 0 0; }
    #timeline .slick-prev { left: calc(12% + 5px); }
    #timeline .slick-prev:hover { left: calc(12% + 15px); }
    #timeline .slick-next { left: calc(12% + 80px); }
    #timeline .slick-next:hover { left: calc(12% + 70px); }
}

/* RESPONSIVE HEIGHTS */
/*
    Charlotte's devices:
    ipad 954 x 768
    samsung 1264 x 2668
    
    laptop: 647 x 1280
    big monitor: 927 x 1920
*/

/* BCI Laptop */
@media (max-height: 950px) {
    #overview .bg-image { height: 2175px; }
    .tiles .investment-flyout.active { left: calc(36% + 420px); }
    .tiles .investment-flyout-content { padding: 30px 130px 30px 30px !important; }
}

@media (max-height: 950px) and (max-width: 1450px) {
    #video-image { height: 85vh; }
    #video-image .header-video { height: 85vh; }
}

@media (max-height: 950px) and (max-width: 1023px) {
    #video-image { height: 65vh; }
    #video-image .header-video { height: 65vh; }
}

/* Phone */
@media (max-height: 750px) and (max-width: 450px) {
    #video-image { height: 90vh }
    #video-image .header-video { height: 90vh; left: -7%; }
}