/*
 Theme Name:   Optic Asset Management
 Theme URI:    https://crushingpixels.com
 Description:  GeneratePress Child Theme by Crushing Pixels
 Author:       Shanda Watts
 Author URI:   https://crushingpixels.com
 Template:     generatepress
 Version:      0.1
*/

.optin-form.ff-default .ff-el-form-control {
	border-radius: 0;
	border-color: #0D416A;
}
.single-post .header-wrap .site-header {
	background: #0d2335 url(https://opticassetmanagement.com/wp-content/uploads/2024/09/layers-bg.png) no-repeat center / cover;
	background-position: 0 10px;
}
.single-post .header-wrap {
	position: static;
}
.single-post .simpletoc-list {
	margin: 0;
}
.single-post .simpletoc-list li {
	transition: all 0.3s;
	padding: 5px 10px;
}
.single-post .simpletoc-list li.active {
	background: rgba(13, 65, 106, 0.1);
	transition: all 0.3s;
}
.single-post .simpletoc-list a {
	color: #0D416A;
}
.sticky-sidebar-post {
	position: -webkit-sticky !important;
	position: sticky !important;
	top: 100px;
}
.optin-form.fluentform .ff-el-group.ff_submit_btn_wrapper {
	margin: 0;
}
.gb-query-loop-pagination .gb-block-is-current {
    background: #00698e;
    color: #fff;
}

/**Mega Menu **/
@media (min-width: 769px) {
	.main-navigation:not(.is_stuck) .inside-navigation {
		position: initial;
	}
	.inside-header {
		position: relative;
	}
	nav .main-nav .mega-menu {
		position: static;
	}

	nav .main-nav .mega-menu > ul {
		position: absolute;
		width: 70%;
		right: 0 !important;
		display: flex;
		flex-wrap: wrap;
	}

	nav .main-nav .mega-menu > ul > li > a {
		font-weight: bold;
		font-family: Outfit;
		font-size: 0.9em;
		font-weight: 600;
		text-transform: uppercase;
		letter-spacing: 0.2em;
		border-bottom: 1px solid #D7E8ED;
		margin-bottom:10px;
	}

	nav .main-nav .mega-menu>ul>li {
		display: inline-block;
		width: 25%;
		vertical-align: top;
	}

	nav .main-nav .mega-menu.mega-menu-col-2>ul>li {
		width: 46%;
		padding:2%;
	}

	nav .main-nav .mega-menu.mega-menu-col-3>ul>li {
		width: 33.3333%;
	}

	nav .main-nav .mega-menu.mega-menu-col-5>ul>li {
		width: 20%;
	}

	nav .main-nav .mega-menu > ul > li:hover > a,
	nav .main-nav .mega-menu > ul > li:focus > a,
	nav .main-nav .mega-menu > ul > li[class*="current-"] > a,
	nav .main-nav .mega-menu ul ul {
		background-color: transparent !important;
		color: inherit;
	}

	nav .main-nav .mega-menu ul .sub-menu {
		position: static;
		display: block;
		opacity: 1;
		visibility: visible;
		width: 100%;
		box-shadow: 0 0 0;
		left: 0;
		height: auto;
		pointer-events: auto;
		transform: scale(1);
	}

	nav .main-nav .mega-menu ul.toggled-on .sub-menu {
		pointer-events: auto;
	}

	nav .main-nav .mega-menu .sub-menu .menu-item-has-children .dropdown-menu-toggle {
		display: none;
	}

	.mega-menu-heading > a {
		color: var(--text)!important;
		font-weight:600;
		font-size:0.8em!important;
	}
}



.menu-btn a, .header-wrap #site-navigation:not(.toggled) .main-nav > ul > li.menu-btn[class*="current-menu-"] > a {
	background-color: var(--secondary-accent);
	color: var(--text)!important;
	font-size: 0.88888em;
	font-weight: 500;
	padding: 14px 40px;
	border-radius: 2px;
	margin: 5px;
	line-height: 20px!important;
	letter-spacing:normal;
	text-transform:none;
	transition: all 0.3s ease!important;
}
.menu-btn a:hover, .header-wrap #site-navigation:not(.toggled) .main-nav > ul > li.menu-btn[class*="current-menu-"] > a:hover {
	background-color: var(--button-hover)!important;
	color: #ffffff!important;
}

a.gb-button-tan {
	color: var(--text)!important;
	text-decoration:none;
	transition: all 0.3s ease;
}

.gb-button-default {
	color: #ffffff!important;
	text-decoration:none;
	transition: all 0.3s ease;
}

a.gb-button-tan:hover, 
a.gb-button-default:hover {
	color:#fff!important;
	text-decoration:none;
}



.main-navigation.sticky-navigation-transition .navigation-branding img{
	width: 214px;
}


.hero, .pageheader {
	background: linear-gradient(125.15deg, #0D2335 38.97%, #0D426A 93.27%);
}


.hero::before {
	content:"";
	z-index:1;
	position:absolute;
	top:0;
	right:0;
	bottom:0;
	left:0;
	pointer-events:none;
	background-image:url(https://opticassetmanagement.com/wp-content/uploads/2023/04/lines-1.svg);
	background-size:cover;
	background-position:center bottom;
	background-repeat:no-repeat;
	background-attachment:scroll;
	background-position: 0px 0px;
	background-repeat: repeat-x;
	animation: wave 14s cubic-bezier( 0.36, 0.45, 0.63, 0.53) .2s infinite alternate, swell 14s ease 2s infinite alternate;
	opacity: 1;
	will-change: transform;
}
.hero.resource-hero::before {
	background-position: 100% 35%;
}

.wavewhite::before {
	will-change: transform;
	z-index:0;
	animation: wavewhite 14s cubic-bezier( 0.36, 0.45, 0.63, 0.53) .2s infinite alternate;
}

.pageheader::before {
	content:"";
	z-index:1;
	position:absolute;
	top:0;
	right:0;
	bottom:0;
	left:0;
	pointer-events:none;
	background-image:url(https://opticassetmanagement.com/wp-content/uploads/2023/04/lines-1.svg);
	background-size:cover;
	background-position:center bottom;
	background-repeat:no-repeat;
	background-attachment:scroll;
	background-position: 0px 0px;
	background-repeat: repeat-x;
	animation: wave 14s cubic-bezier( 0.36, 0.45, 0.63, 0.53) .2s infinite alternate;
	opacity: 1;
	will-change: transform;
}

/*
Mobile Styles
================================================== */
/* Note: Add new css to the media query below that you want to only effect the Mobile and Tablet Portrait view */
@media only screen and (max-width: 767px) {
	.hero::before, .footer-cta::before {
		background-image:url(https://opticassetmanagement.com/wp-content/uploads/2023/04/lines-mobile.svg);
		animation: wavemobile 14s cubic-bezier( 0.36, 0.45, 0.63, 0.53) .2s infinite alternate, swellmobile 14s ease 2s infinite alternate;
	}
}



/**typography

.line {
line-height:0.1em;
margin:10px 0 20px; 
}

**/

.line mark {
	background:#fff; padding:0 20px;
	display:inline;



}

h3.line {
	display: flex;
	width: 100%;
	justify-content: center;
	align-items: center;
	text-align: center;

}

h3.line:before,
h3.line:after {
	content: '';
	margin: 0 20px 0 0;
	flex: 1 0 20px;
	border-top: 1px solid #D7E8ED;


}
h3.line:after {
	margin: 0 0 0 20px;
}
/**Footer **/
.footer-cta {
	background: linear-gradient(269.1deg, #0D2335 3.62%, #0D426A 56.95%, #01698E 99.21%);
}

.footer-cta::before {
	animation: wavefooter 14s cubic-bezier( 0.36, 0.45, 0.63, 0.53) .2s infinite alternate;
}

/*Footer Widgets**/
.quick-links-list, .optic-strategies-list {
	margin: 0;
	padding: 0;
	float: none;
	list-style-type: none;
	font-size: 14px;
	line-height: 18px;
	color: #0D426A;
	-webkit-column-count: 2;
	column-count:2

}
.quick-links-list li, .optic-strategies-list li {

	margin-bottom:12px;

}
@media only screen and (max-width: 767px) {
	.quick-links-list, .optic-strategies-list {-webkit-column-count: 1;
		column-count:1}
}

.quick-links-list a, .optic-strategies-list a {
	color:var(--text);
}
.quick-links-list a:hover, .optic-strategies-list a:hover {
	color:var(--link-hover);
}

.socket-branding {font-size: 12px;
	line-height: 150%;

	/* identical to box height, or 18px */
	text-align: center;
	letter-spacing: 0.02em;

	color: #0D6A90;
	margin-bottom:25px;

}

.socket-branding a {
	color: #0D6A90;
}

.copyright {
	font-size: 12px;
	line-height: 153%;
	text-align: center;
	letter-spacing: 0.015em;
	color: #0D426A;
}



/**Animation **/

/*HERO*/
@keyframes wave {
	0% {
		background-position: center bottom;
		background-size: 100%;
	}

	100% {
		background-position: right bottom;
		background-size: 150%;
	}
}
@keyframes swell {
	0%, 100% {
		transform: translate3d(0,0px,0);
	}
	25% {
		transform: translate3d(0,100px,0);
	}
}

/*HERO Mobile*/
@keyframes wavemobile {
	0% {
		background-position: center bottom;
		background-size: 200%;
	}

	100% {
		background-position: right bottom;
		background-size: 300%;
	}
}



@keyframes swellmobile {
	0%, 100% {
		transform: translate3d(0,0px,0);
	}
	50% {
		transform: translate3d(0,30px,0);
	}
}


/*Middle BG*/

@keyframes wavewhite {
	0% {
		background-position: center bottom;
		background-size: 100%;
	}

	100% {
		background-position: right bottom;
		background-size: 125%;
	}
}



/*CTA*/

@keyframes wavefooter {
	0% {
		background-position: center bottom;
		background-size: 100%;
	}

	100% {
		background-position: right bottom;
		background-size: 125%;
	}
}



/**line bg amimation **/
@keyframes animatedBackground {
	from {
		background-position: 0% 0%;
	}
	to {
		background-position: 100% 100%;
	}
}

/**gradient animation**/
@-webkit-keyframes hero-gradient {
	0%{background-position:0% 88%}
	50%{background-position:100% 13%}
	100%{background-position:0% 88%}
}
@-moz-keyframes hero-gradient {
	0%{background-position:0% 88%}
	50%{background-position:100% 13%}
	100%{background-position:0% 88%}
}
@-o-keyframes hero-gradient {
	0%{background-position:0% 88%}
	50%{background-position:100% 13%}
	100%{background-position:0% 88%}
}
@keyframes hero-gradient {
	0%{background-position:0% 88%}
	50%{background-position:100% 13%}
	100%{background-position:0% 88%}
}


/** Animated Arrow Down **/

.scrollarrow {
	text-align: center;
	position:absolute;
	bottom:30px;
	width:18px;
}

.bounce {
	-moz-animation: bounce 2s infinite;
	-webkit-animation: bounce 2s infinite;
	animation: bounce 2s infinite;
}

@keyframes bounce {
	0%, 20%, 50%, 80%, 100% {
		transform: translateY(0);
	}
	40% {
		transform: translateY(-30px);
	}
	60% {
		transform: translateY(-15px);
	}
}

/**Arrow Boxes **/
.bgarrow {
	position:relative;
	display:flex;
	align-items:center;

}

.bgarrow:after,
.bgarrow:before {
	content: " ";
	position: absolute;
	top: 0;
	right: -40px;
	width: 0;
	height: 0;
	border-top: 94px solid transparent;
	border-bottom:94px solid transparent;

	z-index: 2;
	transition: border-color 0.2s ease;
}

.bgarrows-wrap-flex .bgarrow {
	align-items:stretch;
}

.bgarrows-wrap-flex .bgarrow:after,
.bgarrows-wrap-flex .bgarrow:before {
	border-top: 103px solid transparent;
	border-bottom:103px solid transparent;
}

.bgarrow:before {
	right: auto;
	left: 0;
	border-left: 40px solid #ffffff;	
	z-index: 0;
}
.bgarrows-wrap .gb-grid-column:nth-child(1) .bgarrow, .bgarrows-wrap-flex .bgarrow:nth-child(1) {
	background-color:var(--text-link);
	--arrow-border-color:var(--text-link);
}

.bgarrows-wrap .gb-grid-column:nth-child(1) .bgarrow:after, .bgarrows-wrap-flex .bgarrow:nth-child(1):after {
	border-left: 40px solid var(--arrow-border-color);	
}

.bgarrows-wrap .gb-grid-column:nth-child(2) .bgarrow, .bgarrows-wrap-flex .bgarrow:nth-child(2) {
	background-color:var(--button);
	--arrow-border-color:var(--button);
}

.bgarrows-wrap .gb-grid-column:nth-child(2) .bgarrow:after, .bgarrows-wrap-flex .bgarrow:nth-child(2):after {
	border-left: 40px solid var(--arrow-border-color);	
}

.bgarrows-wrap .gb-grid-column:nth-child(3) .bgarrow, .bgarrows-wrap-flex .bgarrow:nth-child(3)  {
	background-color:#004d6d;
	--arrow-border-color:#004d6d;
}

.bgarrows-wrap .gb-grid-column:nth-child(3) .bgarrow:after, .bgarrows-wrap-flex .bgarrow:nth-child(3):after {
	border-left: 40px solid var(--arrow-border-color);	
}


.bgarrows-wrap .gb-grid-column:nth-child(4) .bgarrow, .bgarrows-wrap-flex .bgarrow:nth-child(4)  {
	background-color:var(--button-hover);
	--arrow-border-color:var(--button-hover);
}

.bgarrows-wrap .gb-grid-column:nth-child(4) .bgarrow:after, .bgarrows-wrap-flex .bgarrow:nth-child(4):after {
	border-left: 40px solid var(--arrow-border-color);	
}


.bgarrows-wrap .gb-grid-column:nth-child(4) .bgarrow:after, .bgarrows-wrap-flex .bgarrow:nth-child(4):after {
	border-left: 40px solid currentColor;

}


@media only screen and (max-width: 1024px) {
	.bgarrows-wrap-flex .bgarrow:after,
	.bgarrows-wrap-flex .bgarrow:before {
		top: 100%;
		left: 50%;
		border: solid transparent;
		content: "";
		height: 0;
		width: 0;
		position: absolute;
		pointer-events: none;
		border-left: 30px solid rgba(136, 183, 213, 0) !important;	
	}

	.bgarrows-wrap-flex .bgarrow:after {
		border-color: rgba(136, 183, 213, 0);
		border-top-color: #88b7d5;
		border-width: 30px;
		margin-left: -30px;
	}
	.bgarrows-wrap-flex	.bgarrow:before {
		border-color: rgba(194, 225, 245, 0);
		border-width: 36px;
		margin-left: -36px;
	}

	.bgarrows-wrap-flex .bgarrow:nth-child(1):after {
		border-top-color: var(--text-link);	

	}

	.bgarrows-wrap-flex .bgarrow:nth-child(2):after {
		border-top-color: var(--button);	

	}

	.bgarrows-wrap-flex .bgarrow:nth-child(3):after {
		border-top-color: #004d6d;	

	}
	
    .bgarrows-wrap-flex  .bgarrow:nth-child(4):after {
		border-top-color:  transparent;

	}


}

@media only screen and (max-width: 800px) {
	/* Add your Mobile Styles here */

	.bgarrow:after,
	.bgarrow:before {
		top: 100%;
		left: 50%;
		border: solid transparent;
		content: "";
		height: 0;
		width: 0;
		position: absolute;
		pointer-events: none;
		border-left: 30px solid rgba(136, 183, 213, 0) !important;	
	}

	.bgarrow:after {
		border-color: rgba(136, 183, 213, 0);
		border-top-color: #88b7d5;
		border-width: 30px;
		margin-left: -30px;
	}
	.bgarrow:before {
		border-color: rgba(194, 225, 245, 0);
		border-width: 36px;
		margin-left: -36px;
	}
 

	.bgarrows-wrap .gb-grid-column:nth-child(1) .bgarrow:after {
		border-top-color: var(--text-link);	

	}

	.bgarrows-wrap .gb-grid-column:nth-child(2) .bgarrow:after {
		border-top-color: var(--button);	

	}
	
    .bgarrows-wrap .gb-grid-column:nth-child(3) .bgarrow:after {
		border-top-color:  transparent;

	}

    
}




/**Desktop Only **/
@media only screen and (min-width: 768px) {
	body .wpDataTablesWrapper table.scroll {
		width:100%!important;


	}

}


/**Desktop Only **/
@media only screen and (min-width: 1024px) {


	body .wpDataTablesWrapper div.wdtscroll {

		overflow-x: unset!important;

	}
}

#wpDataChart_1 .highcharts-axis-title {
	display:none;
}

.highcharts-axis-labels text {
	font-family: Outfit!important;
}

#wpDataChart_3 .highcharts-label text {
	font-family: Outfit!important;
	font-weight:400!important;
	color: black!important;
	font-size: 0.7em;
	font-weight: bold;
	fill: black!important;
	outline:none!important;
	filter:none!important;
}

.highcharts-pie-series text .highcharts-text-outline {
	stroke:#fff!important;
}

/**Form Buttons **/

.ff-btn-submit {
	font-size: 0.88888em;
	font-weight: 500;
	padding: 12px 40px!important;
	border-radius:2px!important;
}


/**Get Started Buttons **/
.get-started-boxes {
	opacity: 0; /* Initially hide the content */
	transform: translateX(-100%); /* Initially position the content outside the viewport */
	transition: opacity 0.5s ease-in-out, transform 0.5s ease-in-out;
}

.sal-animate {
	opacity: 0;
	transform: translateY(20px);
	transition: opacity 0.3s ease, transform 0.3s ease;
}
.sal-animate.sal-animate-enter-done {
	opacity: 1;
	transform: translateY(0);
}

#investorContent ol li, #advisorContent ol li {
	margin-bottom:1em;
}

body.page-id-774 .footer-cta .gb-button {
	display:none!important;
}

.highcharts-data-label-hidden {
	opacity:1!important;
}

@media only screen and (max-width: 1024px) {
  
}

@media only screen and (max-width: 1024px) and (min-width: 768px) {
    .sticky-scroll-left {
        position: sticky !important;
        top: 0rem;
    }
}

.sticky-scroll-left-inner {
	position:sticky;
	top:8rem;
}


.sticky-list a {
    text-decoration: none;
    display:block;
    padding-left:1rem;
}

.sticky-list a.active {
    color:var(--button-hover);
    background-color: #cae1e7;

}


.border-box {
    box-sizing: border-box;
}


.content-box {
    box-sizing: content-box;
}


.arrow-border::before {
    content: '';
    position: absolute;
    left: -6.813px; /* Align the arrow with the left border */
    top: -10px; /* Adjust to move the arrow above the content */
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-bottom: 10px solid var(--button-hover); /* Color of the arrow */
}