/*----------------
FONTLAR
-----------------*/
@font-face {
font-family: 'revolution_gothicregular';
src: url('../font/revolutiongothic_regular-webfont.woff2') format('woff2'), url('../font/revolutiongothic_regular-webfont.woff') format('woff'), url('../font/revolutiongothic_regular-webfont.ttf') format('truetype');
font-weight: normal;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'revolution_gothicextrabold';
src: url('../font/revolutiongothic_extrabold-webfont.woff2') format('woff2'), url('../font/revolutiongothic_extrabold-webfont.woff') format('woff'), url('../font/revolutiongothic_extrabold-webfont.ttf') format('truetype');
font-weight: normal;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'revolution_gothicextrabold_it';
src: url('../font/revolutiongothic_extrabold_it-webfont.woff2') format('woff2'), url('../font/revolutiongothic_extrabold_it-webfont.woff') format('woff'), url('../font/revolutiongothic_extrabold_it-webfont.ttf') format('truetype');
font-weight: normal;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'neosans_regular';
src: url('../font/neosanspro-regular-webfont.woff2') format('woff2'), url('../font/neosanspro-regular-webfont.woff') format('woff'), url('../font/neosanspro-regular-webfont.ttf') format('truetype');
font-weight: normal;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'neosans_bold';
src: url('../font/neosanspro-bold-webfont.woff2') format('woff2'), url('../font/neosanspro-bold-webfont.woff') format('woff'), url('../font/neosanspro-bold-webfont.ttf') format('truetype');
font-weight: normal;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'neosans_prolight';
src: url('../font/neosanspro-light-webfont.woff2') format('woff2'), url('../font/neosanspro-light-webfont.woff') format('woff'), url('../font/neosanspro-light-webfont.ttf') format('truetype');
font-weight: normal;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'neosans_probolditalic';
src: url('../font/neosanspro-bolditalic-webfont.woff2') format('woff2'), url('../font/neosanspro-bolditalic-webfont.woff') format('woff'), url('../font/neosanspro-bolditalic-webfont.ttf') format('truetype');
font-weight: normal;
font-style: normal;
font-display: swap;
}
.bg-dark {
background-color: #0f0f11 !important;  /* Yeni arka plan rengi */
}
.bg-blue {
background-color: #2861a2;
}
.btn-primary {
background-color: #2861a2 !important;  /* Yeni arka plan rengi */
}
.card {
border: none;
border-radius: 0;
}
/* Varsayılan logo boyutu */
.logo {
max-width: 380px;
transition: max-width 0.3s ease; /*Yumuşak Boyut Geçişi */
}
 @media (min-width: 1400px) and (max-width: 1599px) {
.logo {
max-width: 300px;
}
}
 @media (min-width: 1200px) and (max-width: 1399px) {
.logo {
max-width: 250px;
}
}
 @media (max-width: 1199px) {
.logo {
max-width: 190px;
}
}
.cross {
background: url(../images/cross.png) right top;
background-repeat: no-repeat;
background-color: #fff;
padding-right: 3%;
}
/* Hover ile dropdown açma sadece masaüstü için */
.navbar {
padding: 0; /* örnek varsayılan */
}
 @media (min-width: 992px) {
.navbar .dropdown:hover .dropdown-menu {
display: block;
margin-top: -3px; /* yukarıdan kayma olmaması için */
}
}
/* Dropdown menü stili */
.navbar .dropdown-menu {
background-color: #fff;
border-top: 3px solid #2861a2;
border-radius: 0;
padding: 0.75rem 1rem;
min-width: 300px;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}
/* Menüdeki her bağlantı öğesi */
.navbar .dropdown-menu .dropdown-item {
color: #000002;
font-family: 'neosans_regular';
padding-left: 1.5rem;
position: relative;
font-size: 1rem;
}
/* Menüdeki ok işareti */
.navbar .dropdown-menu .dropdown-item::before {
content: '»';
position: absolute;
left: 0.5rem;
color: #2861a2;
font-size: 1rem;
font-weight: bold;
}
.navbar .nav-link {
font-family: 'revolution_gothicregular';
font-size: 1.2rem;
color: #fff;
margin-right: 1.5rem;
}
@media (min-width: 1400px) and (max-width: 1630px) {
.navbar .nav-link {
font-family: 'revolution_gothicregular';
font-size: 1.2rem;
color: #fff;
margin-right: 0.50rem;
}
}
 @media (min-width: 1200px) and (max-width: 1399px) {
.navbar .nav-link {
font-family: 'revolution_gothicregular';
font-size: 1rem;
color: #fff;
margin-right: 0.30rem;
}
}
@media (max-width: 1199px) {
.navbar .nav-link {
font-family: 'revolution_gothicregular';
font-size: 1.2rem;
color: #fff;
margin-right: 0rem;
}
}
 @media (max-width: 992px) {
.navbar .nav-link.active {
border-bottom: none;
}
}
/* Mavi çizgi hover olayı*/
@media (min-width: 992px) {
.navbar .nav-link {
position: relative;
display: inline-block;
background-image: linear-gradient(to right, #2861a2 100%, transparent 0%);
background-position: 0 100%;
background-repeat: no-repeat;
background-size: 0% 3px;
transition: background-size 0.4s ease;
}
.navbar .nav-link:hover, .navbar .nav-link.active {
background-size: 100% 3px;
}
}
.navbar-toggler {
margin-top: 25px;
border: none;
box-shadow: none;
}
.navbar-toggler-icon {
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255,255,255,1)' stroke-width='3' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h26M4 15h26M4 23h26'/%3E%3C/svg%3E");
}
.navbar-toggler:hover .navbar-toggler-icon {
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(40,97,162,1)' stroke-width='3' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h26M4 15h26M4 23h26'/%3E%3C/svg%3E");
}
.navbar-toggler:focus, .navbar-toggler:hover {
border: none;
box-shadow: none;
}
.lang-text {
font-family: 'neosans_regular';
font-size: 1rem;
}
.contact-info i {
color: #2166aa;
font-size: 20px;
}
.contact-info span {
color: #2166aa;
font-family: 'revolution_gothicextrabold';
font-size: 1.2rem;
font-weight: bold;
margin-left: 5px;
}
.contact-info a {
color: #fff;
font-family: 'neosans_regular';
font-size: 1rem;
text-decoration: none;
white-space: nowrap;
}
/* Ekran 1399.98px ve daha küçükse: iletişim alanını küçült */
@media (max-width: 1399px) {
.lang-text {
font-family: 'neosans_regular';
font-size: 0.9rem;
}
.contact-info i {
color: #2166aa;
font-size: 18px;
}
.contact-info span {
color: #2166aa;
font-family: 'revolution_gothicextrabold';
font-size: 1.1rem;
font-weight: bold;
margin-left: 5px;
}
.contact-info a {
color: #fff;
font-family: 'neosans_regular';
font-size: 0.9rem;
text-decoration: none;
white-space: nowrap;
}
}
/*------------
SLİDE ALANI CSS
---------------*/
.tab-area {
display: grid;
grid-template-columns: minmax(0, 60%) 1fr;
gap: 1rem;
}
.info-area {
position: relative;
background-color: #f8f9fa;
overflow: hidden;
border-radius: 0px;
}
.info-slide {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 0;
transform: translateY(100%);
transition: transform 0.6s ease, opacity 0.6s ease;
z-index: 0;
}
.info-slide.active {
opacity: 1;
transform: translateY(0);
z-index: 1;
}
.info-img {
width: 100%;
height: 100%;
object-fit: cover;
position: absolute;
top: 0;
left: 0;
z-index: -1;
}
.info-text {
position: relative;
top: 20%;
left: 10%;
right: 10%;
color: white;
border-radius: 0px;
max-width: 80%;
z-index: 2;
}
.info-text h4 {
font-family: 'neosans_bold';
text-shadow: 2px 2px 4px rgba(0, 0, 0, 1);
}
.info-text p {
font-family: 'neosans_regular';
text-shadow: 2px 2px 4px rgba(0, 0, 0, 1);
}
.tabs {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 5px;
}
.tab-btn {
background: #333;
color: white;
padding: 1rem;
text-align: center;
cursor: pointer;
transition: background 0.3s;
}
.tab-btn:hover {
background: #555;
}
.product-area {
height: 345px;
overflow: hidden;
border-radius: 0px;
position: relative;
}
.product-slide {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
object-fit: cover;
opacity: 0;
transition: opacity 0.6s ease;
}
.product-slide.active {
opacity: 1;
z-index: 1;
}
 @media (max-width: 768px) {
.tab-area {
grid-template-columns: 1fr;
}
.tabs {
grid-template-columns: repeat(2, 1fr);
}
.info-area {
min-height: 400px; /* Mobil için yeterli yükseklik */
}
.info-text {
top: 10%;
left: 5%;
right: 5%;
max-width: 90%;
font-size: 0.9rem;
}
.info-text h4 {
font-family: 'neosans_bold';
text-shadow: 2px 2px 4px rgba(0, 0, 0, 1);
}
.info-text p {
font-family: 'neosans_regular';
text-shadow: 2px 2px 4px rgba(0, 0, 0, 1);
}
.product-area {
display: none;/*Küçük ekranlarda görünmediği için saklandı*/
height: 345px;
overflow: hidden;
border-radius: 0px;
position: relative;
}
}
.custom-card {
width: 100%;
height: 100%; /* tüm yüksekliği kaplasın */
padding: 1rem 0.5rem;
background-color: #f4f5f8;
text-align: center;
border-radius: 0;
box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1);
transition: box-shadow 0.3s ease;
cursor: pointer;
display: flex;
flex-direction: column;
justify-content: center;
}
.custom-card:hover {
box-shadow: 0 4px 15px rgba(0,0,0,0.15);
}
.card-icon {
max-height: 72px;
max-width: 100%;
height: auto;
width: auto;
display: block;
margin: 0 auto 15px;
}
.card-title {
font-family: 'neosans_bold';
font-size: 1rem;
color: #222429;
}
.regular-title {
font-family: 'neosans_regular';
font-size: 1rem;
color: #222429;
}
.footer-header {
font-family: 'neosans_bold';
font-size: 1.1rem;
color: #2861a2;
}
.footer-link {
text-decoration: none;
font-size: 1rem;
color: #FFF;
transition: transform 0.2s ease-in-out;
}
.footer-link:hover {
transform: scale(1.03);
}
.social-header {
font-family: 'neosans_bold';
font-size: 1.1rem;
color: #fff;
}
.instagram-icon {
background: linear-gradient(45deg, #feda75, #fa7e1e, #d62976, #962fbf, #4f5bd5);
color: white;
width: 40px;
height: 40px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 8px;
font-size: 1.7rem;
text-decoration: none;
}
.linkedin-icon {
background-color: #0077B5;
color: white;
width: 40px;
height: 40px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 8px;
font-size: 1.7rem;
text-decoration: none;
}
.youtube-icon {
background-color: #FF0000;
color: white;
width: 40px;
height: 40px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 8px;
font-size: 1.7rem;
text-decoration: none;
}
.whatsapp-icon {
background-color: #25D366;
color: white;
width: 40px;
height: 40px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 8px;
font-size: 1.7rem;
text-decoration: none;
}
.linkedin-icon i, .instagram-icon i, .youtube-icon i, .whatsapp-icon i {
transition: transform 0.2s ease;
display: inline-block;
}
.linkedin-icon:hover i, .instagram-icon:hover i, .youtube-icon:hover i, .whatsapp-icon:hover i {
transform: scale(1.07);
}
.copyright {
font-family: 'neosans_prolight';
font-size: 0.8rem;
color: #fff;
text-align: center;
}
.page-header {
background: url(../images/page-header.webp);
padding: 10px 0;
background-clip: initial;
background-color: rgba(0, 0, 0, 0);
background-origin: initial;
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
position: relative;
z-index: 0;
}
.page-header::before {
content: "";
display: inline-block;
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
z-index: -1;
}
.page {
position: relative;
}
.page h1 {
font-family: 'neosans_bold';
color: #2861a2;
font-size: 2rem;
text-align: center;
}
.page-title {
font-family: 'neosans_prolight';
font-size: 1rem;
color: #23252a;
text-align: center;
}
.general-title {
font-family: 'neosans_bold';
font-size: 1.5rem;
color: #23252a;
text-align: center;
}
.general-text {
font-family: 'neosans_regular';
font-size: 1rem;
color: #23252a;
text-align: center;
}
.banner-container {
position: relative;
display: inline-block; /* Görselin boyutuna göre şekillensin */
}
.corner-box {
position: absolute;
top: -10px;
left: -10px;
width: 150px;
height: 150px;
background-color: #2861a2;
z-index: 1;
}
.corner-right-box {
position: absolute;
top: -10px;
right: -10px;
width: 150px;
height: 150px;
background-color: #2861a2;
z-index: 1;
}
.banner-container img {
display: block;
position: relative;
z-index: 2;
}
.page-heading {
font-family: 'neosans_probolditalic';
font-size: 2rem;
color: #23252a;
}
.sub-heading {
font-family: 'neosans_regular';
font-size: 1.125rem;
color: #2861a2;
}
.contents-head {
font-family: 'neosans_bold';
font-size: 1rem;
color: #2861a2;
}
.contents-head-dark {
font-family: 'neosans_bold';
font-size: 1.2rem;
color: #23252a;
text-transform: uppercase
}
.subheading {
font-family: 'neosans_bold';
font-size: 1.2rem;
color: #2861a2;
}
.contents-text {
font-family: 'neosans_regular';
font-size: 1rem;
color: #575757;
}
.blue-text {
color: #2861a2;
}
.icons {
font-size: 2.5rem;
color: #2861a2;
line-height: 0;
}
.checks {
font-size: 2.2rem;
color: #2861a2;
line-height: 0;
border-radius: 0;
}
.property {
font-family: 'neosans_bold';
font-size: 1rem;
color: #23252a;
}
.section-title {
font-family: 'neosans_bold';
font-size: 1.2rem;
color: #2861a2;
text-decoration: underline;
}
/*-------------- 
VİDEOLAR CSS
----------------*/
.video-wrapper {
position: relative;
border-radius: 10px;
overflow: hidden;
cursor: pointer;
transition: 0.3s;
}
.video-wrapper:hover {
transform: scale(1.03);
}
.video-wrapper img {
width: 100%;
display: block;
}
/* Play ikonu */
.play-icon {
position: absolute;
top: 50%;
left: 50%;
width: 64px;
height: 64px;
background: url("https://img.icons8.com/ios-filled/100/ffffff/play--v1.png") no-repeat center center;
background-size: contain;
opacity: 0.9;
pointer-events: none;
transform: translate(-50%, -50%);
z-index: 2;
animation: pulse 1.8s infinite ease-in-out;
}

 /* Nabız (pulse) animasyonu */
    @keyframes pulse {
 0% {
 transform: translate(-50%, -50%) scale(1);
 opacity: 0.9;
}
 50% {
 transform: translate(-50%, -50%) scale(1.1);
 opacity: 1;
}
 100% {
 transform: translate(-50%, -50%) scale(1);
 opacity: 0.9;
}
}
/* Dalga efekti (ripple) */
.ripple {
position: absolute;
top: 50%;
left: 50%;
width: 80px;
height: 80px;
background: rgba(255, 255, 255, 0.3);
border-radius: 50%;
transform: translate(-50%, -50%);
animation: rippleEffect 1.5s ease-out infinite;
z-index: 1;
pointer-events: none;
}
 @keyframes rippleEffect {
 0% {
 transform: translate(-50%, -50%) scale(0.7);
 opacity: 0.6;
}
 100% {
 transform: translate(-50%, -50%) scale(2.5);
 opacity: 0;
}
}
/*---------------
REFERANSLAR CSS
-----------------*/
.references-head {
font-family: 'neosans_bold';
font-size: 1.2rem;
color: #23252a;
text-decoration: underline;
text-align: center;
}
.logo-card {
border: solid 6px #ebebeb;
border-radius: 0px;
box-shadow: 0 0 8px rgba(0, 0, 0, 0.05);
background-color: #fff;
padding: 20px;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
}
.logo-card img {
max-width: 100%;
max-height: 80px;
object-fit: contain;
}
/*----------------
ENDUSTRİLER CSS
-----------------*/						
.industry-box {
position: relative;
height: 450px;
overflow: hidden;
transition: transform 0.3s ease, box-shadow 0.3s ease;
border-radius: 0px;
}
.industry-box:hover {
transform: scale(1.03);
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
z-index: 2;
}
.industry-box img {
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 0px;
}
.diagonal-overlay {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 50%;
background-color: rgba(40, 97, 162, 0.9);
clip-path: polygon(0 40%, 100% 0, 100% 100%, 0% 100%);
color: #fff;
padding: 20px;
display: flex;
flex-direction: column;
justify-content: flex-end;
align-items: flex-end;
text-align: right;
border-radius: 0px;
}
.diagonal-overlay h5 {
font-family: 'revolution_gothicextrabold';
font-size: 2.2rem;
color: #fff;
}
.diagonal-overlay small {
font-family: 'neosans_prolight';
font-size: 1rem;
color: #fff;
text-decoration: underline;
}
 /* 5 sütun - Masaüstü (992px ve üzeri) */
@media (min-width: 992px) {
.custom-row {
display: flex;
gap: 18px;
flex-wrap: nowrap;
justify-content: center;
}
.custom-col {
flex: 0 0 calc((100% - 120px) / 4);
}
}

/* Altında kalan tüm boyutlar için (mobil ve tablet) */
@media (max-width: 991.98px) {
.custom-row {
display: flex;
flex-wrap: wrap;
gap: 18px;
justify-content: center;
}
.custom-col {
flex: 0 0 100%;
}
}

/* 768px - 991.98px arasında: 3 sütun */
@media (min-width: 768px) and (max-width: 991.98px) {
.custom-col {
flex: 0 0 calc(33.333% - 12px);
}
}

/* 0px - 767.98px arasında: 2 sütun */
@media (max-width: 767.98px) {
.custom-col {
flex: 0 0 calc(50% - 9px);
}
}
.clickable-box {
text-decoration: none;
color: inherit;
display: block;
}
/*----------------
İLETİSİM CSS
-------------------*/		
.social-icon {
width: 50px;
height: 50px;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 50%;
color: white;
font-size: 1.7rem;
text-decoration: none;
transition: transform 0.3s ease;
}
.social-icon:hover {
transform: scale(1.1);
}
.input {
height: 55px;
font-family: 'neosans_regular';
font-size: 1rem;
color: #666262;
}
.textarea {
height: auto;
font-family: 'neosans_regular';
font-size: 1rem;
color: #666262;
}
/*-----------------
ÜRÜNLER CSS KODLARI
-------------------*/
.product-wrapper {
position: relative;
max-width: 738px;
}
.product-text-box {
position: absolute;
top: 0;
right: 0;
width: auto;
min-width: 100px;
height: 100%; /* div'in yüksekliğini ekranın tamamına ayarla */
background-color: rgba(4, 24, 61, 0.8); /* Lacivert zemin */
display: flex;
align-items: center; /* yazıyı dikeyde ortalar */
justify-content: center; /* yazıyı yatayda ortalar */
writing-mode: vertical-rl; /* yazıyı dikey hizalar */
}
.product-text-box h2 {
font-family: 'neosans_bold';
font-size: clamp(1.2rem, 1.2vw + 1rem, 2.5rem);
color: #ffffff;
text-shadow: 2px 2px 4px black;
text-align: center;
}
.product-header {
font-family: 'neosans_bold';
font-size: 1.5rem;
color: #000000;
}
.product-sub-header {
font-family: 'neosans_bold';
font-size: 1rem;
color: #2861a2;
}
.product-content {
font-family: 'neosans_regular';
font-size: 1rem;
color: #686a6f;
}
.product-content li::marker {
 color: #2861a2;                 /* Marker rengi */
 font-size: 1.4em;            /* Marker boyutu */
}
.product-detail {
outline: none;
}
.product-detail h4 {
font-family: 'neosans_bold';
font-size: 1rem;
color: #2861a2;
}
.product-detail ol {
font-family: 'neosans_regular';
font-size: 0.9rem;
line-height: 1.2rem;
color: #000000;
list-style: none;        /* Varsayılan numarayı gizle */
counter-reset: item;     /* Sayaç başlat */
padding-left: 0;         /* Boşlukları kaldır */
margin: 0;
}
.product-detail ol li {
counter-increment: item; /* Sayaç her li'de artsın */
margin-bottom: 0.5em;
position: relative;
padding-left: 1.4em;     /* Numara için yer aç */
}
.product-detail ol li::before {
content: counter(item) "- "; /* Örn: 1- */
position: absolute;
left: 0;
color: #000000;
}
.property-blue {
font-family: 'neosans_bold';
font-size: 1.8rem;
color: #2861a2;
}
.property-blue-2 {
font-family: 'neosans_bold';
font-size: 1rem;
color: #2861a2;
}
.property-blue-3 {
font-family: 'neosans_bold';
font-size: 1.6rem;
color: #2861a2;
white-space: nowrap;
}
.property-blue-4 {
font-family: 'neosans_bold';
font-size: 1.2rem;
color: #2861a2;
white-space: nowrap;
}
.property-dark {
font-family: 'neosans_bold';
font-size: 1.1rem;
color: #000000;
display: block;
white-space: nowrap;
}
.property-dark-2 {
font-family: 'neosans_bold';
font-size: 1rem;
color: #000000;
}
.property-dark-3 {
font-family: 'neosans_bold';
font-size: 1.3rem;
color: #000000;
display: block;
white-space: nowrap;
}
.property-dark-4 {
font-family: 'neosans_bold';
font-size: 0.9rem;
color: #000000;
}
.property-gray {
font-family: 'neosans_regular';
font-size: 1rem;
color: #595959;
}
.property-regular {
font-family: 'neosans_regular';
font-size: 1rem;
color: #000;
}
.property-bold {
font-family: 'neosans_bold';
font-size: 1rem;
color: #000;
}
.property-light {
font-family: 'neosans_prolight';
font-size: 1rem;
color: #000;
}
@media (min-width: 1199px) and (max-width: 1399px) {
.property-blue {
font-size: 1.3rem;
}
.property-blue-2 {
font-size: 1rem;
}
.property-blue-3 {
font-size: 1rem;
}
.property-dark {
font-size: 1rem;
}
.property-dark-2 {
font-size: 0.8rem;
}
.property-gray {
font-size: 0.8rem;
}
.property-regular {
font-size: 0.8rem;
}
.property-bold {
font-size: 0.8rem;
}
.property-light {
font-size: 0.8rem;
}
}
/* Responsive white-space düzeltmesi */
@media (max-width: 768px) {
  .property-blue-3,
  .property-dark,
  .property-dark-3 {
    white-space: normal !important;
  }
}
.lightbox-modal-content {
background: transparent;
border: none;
box-shadow: none;
display: flex;
justify-content: center;
align-items: center;
}
.lightbox-container {
position: relative;
display: inline-block;
text-align: center;
}
.lightbox-img {
max-width: 100%;
max-height: 90vh;
width: auto;
height: auto;
display: block;
margin-left: auto;
margin-right: auto;
object-fit: contain;
}
@media (max-width: 768px) {
.lightbox-img {
max-width: 100%;
max-height: 70vh;
}
}
/* Oklar */
.lightbox-btn {
position: absolute;
top: 50%;
transform: translateY(-50%);
z-index: 10;
opacity: 0.9;
}
.prev-btn {
left: 0;
}
.next-btn {
right: 0;
}
/* Kapatma tuşu */
.lightbox-close {
position: absolute;
top: 10px;
right: 10px;
z-index: 11;
filter: invert(1); /* beyaz görünüm */
}
.image-wrapper {
position: relative;
overflow: hidden;
border-radius: 0px;
cursor: pointer;
max-height: 232px;
border: 5px solid #fff;
}
.image-wrapper img {
transition: transform 0.4s ease;
width: 100%;
}
.image-wrapper:hover img {
transform: scale(1.05);
}
.zoom-icon {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%) scale(1);
font-size: 2.5rem;
color: white;
background-color: rgba(0, 0, 0, 0.6);
padding: 15px;
border-radius: 50%;
opacity: 1 !important; /* Her zaman görünür */
transition: none;
pointer-events: none; /* Büyüteç ikonunun tıklamayı engellememesi için */
}
/* Modal içi kapatma butonu stili - beyaz */
.btn-close.btn-close-white {
filter: brightness(1) invert(1); /* Beyaz yapar */
}
.modal-content {
position: relative;
background-color: transparent !important;
border: none !important;
box-shadow: none !important;
}
.btn-close {
position: absolute;
top: 15px;
right: 15px;
z-index: 1051;
color: #fff;
}
.btn-close:focus {
outline: none;
box-shadow: none;
}
/*---------------------
ÇEREZLER
----------------------*/
#cookieBanner {
position: fixed;
bottom: 20px;
right: 20px;
z-index: 1050;
max-width: 320px;
box-shadow: 0 0 10px rgba(0,0,0,0.3);
background-color: rgba(33, 37, 41, 0.95);
}
/*-----------------
İKONLAR
-------------------*/
.icon-circle {
width: 90px;
height: 90px;
position: relative;
}
.icon-circle i {
color: #2861a2;
}
.icon-position {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.icon-button {
font-family: 'neosans_bold';
font-size: 1rem;
color: #fff;
}