/* ----------------------------------------------------------------	Custom CSS	Add all your Custom Styled CSS here for New Styles or	Overwriting Default Theme Styles for Better Handling Updates-----------------------------------------------------------------*/
/* style.css line: 13200 */
:root {
	--cnvs-themecolor:	#040273; /* 1abc9c */
	--cnvs-themecolor-rgb:	4, 2, 115; /* 26, 188, 156 */
	--cnvs-heading-color:	#191970  ; /* var(--cnvs-contrast-900) */
	--tech-linkcolor: #58A6FF; 		/* = 88, 166, 255 */
	--tech-silver: #C0C0C0;			/* = 192, 192, 192 */
	--tech-green: #008000; 			/* = 0, 128, 0 */
	--tech-teal: #008080; 				/* = 0, 128, 128 */
	--tech-dark-purple: #151327; 		/* = 21, 19, 39 */
	--tech-very-dark-purple: #0f0d1d; 	/* = 15, 13, 29 */
	--tech-blue: #3c72fc;				/* = 60, 114, 252 */
	--tech-text-1: #1F3B4D; 			/* = 241, 59, 77 */
	--tech-text-2: #0D1117; 			/* = 13, 17, 23 Midnight Charcoal */
	--tech-text-3: #1C2128; 			/* = 28, 33, 40 Slate Graphite */
	--tech-text-4: #2D333B; 			/* = 45, 51, 59 Steel Navy */
	--catalog-black: #150e19; 			/* = 21, 14, 25 */
	--catalog-dark-blue: #192847; 		/* = 25, 40, 71 */
	--catalog-featured-box: #812468; 	/* = 129, 36, 104 Plum */
	--tech-border-color: var(--tech-teal);
}

/* Custom Cursor */
.cnvs-cursor {
	--cnvs-cursor-size: 0.75rem; /* 0.75rem */
	--cnvs-cursor-bg: #3261d6;
	--cnvs-cursor-action-bg: #3261d6;
	--cnvs-cursor-action-size: 2rem;
	transition: transform 0.15s ease;	/* 0.05s ease */
}

.cnvs-cursor-follower,
.cnvs-cursor-dot {
	width: calc(var(--cnvs-cursor-size) * 2);
	height: calc(var(--cnvs-cursor-size) * 2);
	background: var(--cnvs-cursor-bg);
	opacity: var(--cnvs-cursor-opacity);
	border-radius: 50%;
	transition: 0.25s ease;	/* 0.25s ease*/
}

.cnvs-cursor-follower {
	transition: transform 0.75s ease;
}

.cnvs-cursor-dot {
	--cnvs-cursor-size: 0.25rem;	/* 0.25rem; */
	border: 0;
	transition: transform 0.75s ease; /* ekledim */
}
/* Custom Cursor END */

/* benim eklediğim renkler */
.tech-silver {
	color: var(--tech-silver) !important; /* = 192, 192, 192 */
}

.tech-green {
	color: var(--tech-green) !important; /* = 0, 128, 0 */
}

.tech-teal {
	color: var(--tech-teal) !important; /* = 0, 128, 128 */
}

.tech-themecolor {
	color: var(--cnvs-themecolor) !important;
}

.tech-headingcolor {
	color: var(--cnvs-heading-color) !important;
}

.tech-linkcolor {
	color: var(--tech-linkcolor) !important; /* = 88, 166, 255 */
}

/* grey-black with dark blue tones */
.tech-text-1 {
	color: var(--tech-text-1) !important; /* = 241, 59, 77 */
}

.tech-text-2 {
	color: var(--tech-text-2) !important; /* = 13, 17, 23 Midnight Charcoal */
}

.tech-text-3 {
	color: var(--tech-text-3) !important; /* = 28, 33, 40 Slate Graphite */
}

.tech-text-4 {
	color: var(--tech-text-4) !important; /* = 45, 51, 59 Steel Navy */
}

.line, .double-line { /* style.css line: 13953 */
  border-top-color: var(--tech-border-color); /* rgba(var(--cnvs-themecolor), 0) */
}

.promo { /* style.css line: 23850 */
	--cnvs-promo-border: 1px solid var(--tech-border-color); /* rgba(var(--cnvs-themecolor), 0.15) */
}

.fancy-title { /* style.css line: 28219 */
  --cnvs-fancy-title-border-color: var(--tech-border-color); /* --cnvs-fancy-title-border-color: rgba(var(--cnvs-contrast-rgb), 0.1); */
}

/* Featured Box | style.css line: 23934 */
.feature-box {
  --cnvs-featured-box-bg-light:	var(--cnvs-contrast-200);
  --cnvs-featured-box-bg-dark:	var(--cnvs-heading-color); /* 343a40 */
}
/* üstteki dark değerini ve girişteki themecolor ile heading rengi değişince başka bir şeye gerek kalmadı */

/* Featured Box - slider'ın hemen altındaki her h3, h2 yaptım ve ana css'ten h3'ün kodunu alıp aşağıdaki h2 olarak değiştirdim
 * Icon linkleri de referans olarak aşağıda:
 * fa- : Font Awesome		https://fontawesome.com/search?o=r&m=free
 * bi- : Bootstrap Icons	https://icons.getbootstrap.com/#icons
 * uil- : Unicons			https://iconscout.com/unicons/explore/line
 * Kullanma şekli:
 * <i class="bi-envelope-alt"></i> */
.fbox-content h2, .fbox-content .h2 {
	font-size: var(--cnvs-featured-box-font-size);
	font-weight: var(--cnvs-featured-box-font-weight);
	font-family: var(--cnvs-primary-font);
	text-transform: var(--cnvs-featured-box-font-tt);
	margin-bottom: 0;
	color: var(--cnvs-featured-box-font-color);
}
.fbox-content h2 + .fbox-icon, .fbox-content .h2 + .fbox-icon {
	margin-top: 1.5rem;
	margin-bottom: 0 !important;
}
.fbox-content h2 span.subtitle, .fbox-content .h2 span.subtitle {
	display: block;
	margin-top: 5px;
	color: var(--cnvs-heading-color);
	font-weight: 300;
	text-transform: none;
}
/* Featured Box Content */
.fbox-content p {
	color: var(--tech-text-1);
}

/* Showcase Sticky */
.section-showcase-sticky .list-group-item {
	position: absolute;
	top: 0;
	left: 0;
	color: #212529;
	border: 0;
	width: 100%;
	height: 100%;
	padding: 0;
	margin: 0;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	pointer-events: default;
	display: flex;
	justify-content: center;
	align-items: center;
	opacity: 0;
	transition: opacity .3s ease;
}

.section-showcase-sticky .list-group-item.active {
	opacity: 1;
	background-color: #000;
}

.section-showcase-sticky .list-group-content>div {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding-left: 4rem;
	padding-right: 4rem;
	border-bottom: 1px solid var(--tech-green); /* rgba(255, 255, 255, .15) = 15% white transparent border */
}

/* Showcase-sticky bölümünde resim üzerinde yazı göstermek için */
div.showcase-sticky-image-text-holder{
	display: flex;
    align-items: center;
    align-content: center;
    flex-direction: column;
    justify-content: center;
    height: 100%;
    flex-wrap: wrap;
}

div.showcase-sticky-image-text {
	background-color: rgba(255, 255, 255, 0.45); /* 50% white transparent background */
	color: #000; /* Opaque black text */
	padding: 1.5em;
	width: 75%;
}

div.showcase-sticky-image-text h3 {
	margin-bottom: 0;
}

div.showcase-sticky-image-text h4 {
	margin-bottom: 1em;
	font-style: italic;
}

/* Swiper */
.swiper-pagination-progress {
	--cnvs-swiper-bar-size: 2px;
	--cnvs-swiper-bar-color: var(--cnvs-contrast-200);
	--cnvs-swiper-bar-active-color: var(--cnvs-contrast-1000);
	position: absolute;
	left: 0;
	bottom: 0px;
	width: 100%;
	height: auto;
	border-radius: 0;
	opacity: 1;
	margin: 0px;
	background-color: transparent;
}

.swiper-pagination-progress .swiper-pagination-bar,
.swiper-pagination-progress .swiper-pagination-bar-active {
	position: absolute;
	bottom: 0;
	border-radius: 0;
	left: 0;
	z-index: 1;
	width: 100%;
	height: var(--cnvs-swiper-bar-size);
	margin: 0px;
	background-color: var(--cnvs-swiper-bar-color);
}

.swiper-pagination-progress .swiper-pagination-bar-active {
	z-index: 2;
	width: 0%;
	background-color: var(--cnvs-swiper-bar-active-color);
}

.active .swiper-pagination-progress .swiper-pagination-bar-active {
	animation-name: swiperbarAnim;
	animation-duration: 5s;
	animation-timing-function: ease-in;
	animation-iteration-count: 1;
	animation-direction: alternate;
	animation-fill-mode: forwards;
}

@keyframes swiperbarAnim {
	0% {
		width: 0;
	}

	100% {
		width: 100%;
	}
}

.swiper-tab-link {
	--swiper-tab-title: #AAA;
	--swiper-tab-content: ;
	counter-increment: step-counter;
	position: relative;
	overflow: hidden;
	margin-bottom: 5px;
	padding: 20px 0;
	cursor: pointer;
}

.swiper-tab-link::before {
	content: "0" counter(step-counter)'.';
	position: relative;
	display: inline-block;
	font-size: 26px;
	font-weight: 600;
	min-width: 50px;
	margin-right: 5px;
	color: var(--swiper-tab-title);
	font-family: monospace;
	line-height: 1;
}

.swiper-tab-link .swiper-tab-title {
	display: inline-block;
	color: var(--swiper-tab-title);
	margin-bottom: 0;
	font-size: calc(1.275rem + 0.3vw);
}

.swiper-tab-link .swiper-tab-content {
	margin-bottom: 0;
	padding-top: 10px;
	margin-left: 5px;
	line-height: 0;
	opacity: 0;
	vertical-align: middle;
	font-size: 1rem;
	transition: line-height 0.6s cubic-bezier(.4, 0, .2, 1), opacity .1s .1s cubic-bezier(.4, 0, .2, 1);
}

@media (min-width: 768px) {
	.swiper-tab-link .swiper-tab-content {
		margin-left: 60px;
	}
}

.swiper-tab-link.active .swiper-tab-content {
	opacity: .8;
	line-height: var(--cnvs-line-height-content);
	transition: line-height 0.5s cubic-bezier(.4, 0, .2, 1), opacity .15s .15s cubic-bezier(.4, 0, .2, 1);
}

.swiper-tab-link.active {
	--swiper-tab-title: #000;
}
/* Swiper END */


/* Text Fill Effect */
.text-fill-effect {
	--cnvs-text-fill-placeholder: rgba(var(--cnvs-contrast-rgb), 0.1);
	--cnvs-text-fill-color: linear-gradient(to right, var(--cnvs-contrast-1000), var(--cnvs-contrast-1000));
	-webkit-text-fill-color: var(--cnvs-text-fill-placeholder);
	position: relative;
	background-image: var(--cnvs-text-fill-color);
	background-size: calc(var(--cnvs-scroll-start) * 100%) 100%;
	background-repeat: no-repeat;
}

.text-splitter.scroll-detect span {
	opacity: calc(0.1 + (1 * var(--cnvs-scroll-percent)));
	transform: rotateX(20deg);
	transition: all .3s ease;
	transition-delay: 0s;
}

.text-splitter.scroll-detect.scroll-detect-inview span {
	transform: rotateX(0);
	transition-delay: calc(.04s * var(--cnvs-split-index));
}
/* Text Fill Effect END */

/* Flip Card bölümlerindeki h3 etiketleri */
div.flip-card-inner h3 {
	color: white;
	font-size: 1.5rem;
	font-weight: 450;
}

/* İletişim'deki linkler için */
#iletisim a {
	color: white; /* = 88, 166, 255 */
}

#iletisim a:hover {
	color: var(--tech-linkcolor); /* = 88, 166, 255 */
}

.tp-mask-wrap .revo-slider-emphasis-text {
	padding: 0.5em 0.75em !important;
}

.tp-mask-wrap {
	margin: 0.5em 0.75em !important;
}