/* ----------------------------------------------------------------
	Custom CSS

	Add all your Custom Styled CSS here for New Styles or
	Overwriting Default Theme Styles for Better Handling Updates
-----------------------------------------------------------------*/

.feature-box-border-vertical .feature-box { position: relative; }

.feature-box-border-vertical .feature-box:not(.noborder)::before,
.feature-box-border-vertical .fbox-active.feature-box:not(.noborder)::after {
	content: "";
	position: absolute;
	top: 0;
	left: 35px;
	width: 3px;
	height: 100%;
	background-color: var(--bs-gray-200);
}

.feature-box-border-vertical .fbox-icon i,
.feature-box-border-vertical .fbox-border.fbox-light .fbox-icon i {
	position: relative;
	z-index: 5;
	text-align: center;
	box-shadow: 0 0 0 6px #FFF;
	border: 1px solid #EEE;
	background-color: #FFF !important;
}

.feature-box-border-vertical .fbox-active.feature-box .fbox-icon i,
.feature-box-border-vertical .fbox-active.feature-box .fbox-border.fbox-light .fbox-icon i,
.feature-box-border-vertical .fbox-active.feature-box:not(.noborder)::after {
	background-color: var(--bs-primary) !important;
	border-color: transparent !important;
	color:#FFF;
}


.dark .feature-box-border-vertical .feature-box:not(.noborder)::before,
.dark .feature-box-border-vertical .fbox-active.feature-box:not(.noborder)::after {
	background-color: var(--bs-gray-600);
}

.dark .feature-box-border-vertical .fbox-icon i,
.dark .feature-box-border-vertical .fbox-border.fbox-light .fbox-icon i {
	box-shadow: 0 0 0 6px var(--bs-dark);
	background-color: var(--bs-dark) !important;
	color: var(--bs-gray-600);
	border-color: var(--bs-gray-600);
}

.dark .feature-box-border-vertical .fbox-active.feature-box .fbox-icon i,
.dark .feature-box-border-vertical .fbox-active.feature-box .fbox-border.fbox-light .fbox-icon i,
.dark .feature-box-border-vertical .fbox-active.feature-box:not(.noborder)::after {
	background-color: var(--bs-warning) !important;
	color:var(--bs-dark);
}