/**
 * Bak Ambalaj — modern CSS
 * Visual match to live site; cleaned tokens, no vendor-prefix clutter, Swiper-ready.
 */

/* ==========================================================================
   Tokens
   ========================================================================== */
:root {
  --bak-red: #af2c36;
  --bak-red-soft: #f0848c;
  --bak-ink: #4a4c4f;
  --bak-ink-soft: #4b4b4b;
  --bak-muted: #8b8b8b;
  --bak-gray: #757575;
  --bak-gray-mid: #656868;
  --bak-gray-light: #9d9d9d;
  --bak-line: #dfdfdf;
  --bak-line-soft: #dedede;
  --bak-bg-soft: #f0f0f0;
  --bak-bg-think: #ededed;
  --bak-dot: #dadada;
  --bak-white: #fff;
  --bak-black: #000;
  --bak-shadow: 0 0 3px rgb(0 0 0 / 0.1);
  --bak-shadow-menu: 0 4px 5px 3px rgb(0 0 0 / 0.1);
  --bak-font: "Panton", "Segoe UI", sans-serif;
  --bak-container: 1280px;
  --bak-ease: 0.3s ease;
  --bak-ease-slow: 0.5s ease;
}

/* ==========================================================================
   Fonts
   ========================================================================== */
@font-face {
  font-family: "Panton";
  src: url("../fonts/Panton-Regular.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Panton";
  src: url("../fonts/Panton-Bold.woff") format("woff");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

/* ==========================================================================
   Base
   ========================================================================== */
*,
*::before,
*::after {
  box-sizing: border-box;
}

body {
  margin: 0;
  font-family: var(--bak-font);
  font-weight: 400;
  font-size: 14px;
  letter-spacing: 0.2px;
  color: var(--bak-muted);
  background: var(--bak-white);
  line-height: 1.45;
}

img {
  max-width: 100%;
  height: auto;
}

.img-responsive {
  display: block;
  max-width: 100%;
  height: auto;
}

ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

a {
  color: var(--bak-red);
  text-decoration: none;
  transition: color var(--bak-ease), opacity var(--bak-ease), background-color var(--bak-ease);
}

a:hover {
  text-decoration: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 600;
}

.container {
  width: 100%;
  max-width: var(--bak-container);
}

/* Legacy utility classes still used in markup */
.fr { float: right; }
.fl { float: left; }
.di { display: inline-block; }
.db { display: block; }
.dn { display: none; }
.pr { position: relative; }
.pa { position: absolute; }
.tc { text-align: center; }
.mp { margin: 0; padding: 0; }
.mb0 { margin-bottom: 0; }

/* ==========================================================================
   Header
   ========================================================================== */
#header {
  position: relative;
  z-index: 9;
  background: var(--bak-white);
  box-shadow: var(--bak-shadow);
}

#top {
  position: relative;
  height: 100px;
  padding-top: 15px;
}

#top .container,
#top .row,
#top .col-sm-12 {
  position: relative;
}

.logo {
  margin: 10px 0 0;
  text-align: center;
}

.logo img {
  margin: 0 auto;
}

.diller {
  position: absolute;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
  color: var(--bak-gray);
  font-size: 13px;
  line-height: 1;
  white-space: nowrap;
}

.diller a {
  color: var(--bak-gray);
  font-weight: 400;
  font-size: 13px;
}

.diller a:hover,
.diller a[aria-current="page"] {
  color: var(--bak-red);
}

#menuTop {
  height: auto;
  background: none;
  padding-bottom: 4px;
}

/* ==========================================================================
   Navigation (original look + Bootstrap 5 collapse)
   ========================================================================== */
.navbar-default.navbar {
  --bs-navbar-padding-x: 0;
  --bs-navbar-padding-y: 0;
  display: block;
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  box-shadow: none;
  text-align: center;
  min-height: 0;
}

/* Desktop: canlı sitedeki gibi hamburger yok */
.navbar-default .navbar-header {
  display: none;
}

.navbar-default .navbar-toggler {
  display: none;
}

.navbar-default .navbar-nav {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
  flex-direction: unset;
  flex-wrap: unset;
}

.navbar-default .navbar-nav > li {
  display: inline-block;
  float: none;
  margin: 0 10px 0 2px;
  position: relative;
}

.navbar-default .navbar-nav > li > a {
  display: block;
  padding: 13px 2px 10px;
  color: var(--bak-ink);
  font-weight: 600;
  text-decoration: none;
  transition: var(--bak-ease);
}

.navbar-default .navbar-nav > li:hover > a,
.navbar-default .navbar-nav > li > a:focus,
.navbar-default .navbar-nav > li.active > a {
  background: var(--bak-red);
  color: var(--bak-white);
  box-shadow: inset 0 3px 9px rgb(0 0 0 / 0.075);
}

.navbar-default .navbar-nav > li > ul {
  position: absolute;
  display: none;
  left: 50%;
  margin-left: -125px;
  width: 250px;
  padding: 0 20px;
  list-style: none;
  background: var(--bak-red);
  border-top: 1px solid var(--bak-red);
  border-radius: 0 0 5px 5px;
  box-shadow: var(--bak-shadow-menu);
  z-index: 20;
  text-align: left;
}

.navbar-default .navbar-nav > li:hover > ul {
  display: block;
}

.navbar-default .navbar-nav > li > ul li {
  border-top: 1px solid rgb(255 255 255 / 0.2);
}

.navbar-default .navbar-nav > li > ul li:first-child {
  border-top: 0;
}

.navbar-default .navbar-nav > li > ul a {
  display: block;
  padding: 10px 0;
  color: var(--bak-white);
  font-weight: 400;
  text-decoration: none;
  transition: opacity var(--bak-ease);
}

.navbar-default .navbar-nav > li > ul a:hover {
  opacity: 0.5;
}

@media (min-width: 768px) {
  .navbar-default .navbar-header,
  .navbar-default .navbar-toggler {
    display: none !important;
  }

  .navbar-default .navbar-collapse.collapse {
    display: block !important;
    height: auto !important;
    overflow: visible !important;
    padding: 0;
    visibility: visible !important;
  }

  .navbar-default .navbar-nav {
    text-align: center;
  }
}

@media (max-width: 767.98px) {
  .diller {
    position: absolute;
    top: 12px;
    right: 15px;
    transform: none;
  }

  #top {
    height: auto;
    min-height: 72px;
    padding: 12px 0 8px;
  }

  h1.logo {
    margin: 8px 0 0;
  }

  h1.logo img {
    height: 40px;
  }

  .navbar-default {
    margin-top: 8px;
    position: relative !important;
  }

  .navbar-default .navbar-header {
    display: block;
    text-align: center;
  }

  .navbar-default .navbar-collapse.collapse:not(.show) {
    display: none !important;
  }

  .navbar-default .navbar-collapse.collapse.show {
    display: block !important;
  }

  .navbar-default .navbar-toggler {
    display: block;
    width: 100%;
    margin: 0;
    padding: 0.65rem;
    border: 0;
    border-radius: 0;
    background: var(--bak-red);
  }

  .navbar-toggler:focus {
    box-shadow: none;
  }

  .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(255,255,255,1)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
  }

  #bakioglu {
    width: 100%;
    padding: 0;
    text-align: center;
  }

  .navbar-default .navbar-nav {
    width: 100%;
    margin: 0;
  }

  .navbar-default .navbar-nav > li {
    display: block;
    margin: 0;
    border-bottom: 1px solid var(--bak-line-soft);
  }

  .navbar-default .navbar-nav > li > a {
    display: block;
    padding: 10px 15px !important;
    background: #eee;
    font-size: 13px;
    color: var(--bak-ink);
  }

  .navbar-default .navbar-nav > li a:hover {
    background: var(--bak-red);
    color: var(--bak-white);
  }

  .navbar-default .navbar-nav > li:hover > ul {
    display: none;
  }

  .navbar-default .navbar-nav > li > ul {
    position: static;
    display: none;
    width: 100%;
    margin: 0;
    left: auto;
    box-shadow: none;
    border-radius: 0;
  }
}

/* ==========================================================================
   Hero slider (Swiper)
   ========================================================================== */
#sliderHome {
  position: relative;
}

#slider.swiper {
  overflow: hidden;
}

#slider .swiper-slide img {
  display: block;
  width: 100%;
  height: auto;
}

#slider .sliderContent {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 50%;
  z-index: 5;
}

#slider .sliderContent .container {
  position: relative;
  z-index: 100;
}

#slider h2,
#slider h3 {
  margin: 0;
  color: var(--bak-white);
}

#slider h2 {
  font-size: 59px;
  font-weight: 600;
}

#slider h3 {
  font-size: 72px;
  font-weight: 400;
}

#slider p {
  padding: 0 200px;
  color: var(--bak-white);
  font-weight: 400;
  font-size: 24px;
}

#slider .swiper-button-prev,
#slider .swiper-button-next {
  top: 50%;
  width: 16px;
  height: 28px;
  margin-top: 0;
  transform: translateY(-50%);
  background: url("../images/owl-arrow.webp") no-repeat;
  color: transparent;
}

#slider .swiper-button-prev {
  left: 30px;
  background-position: 0 0;
}

#slider .swiper-button-next {
  right: 30px;
  background-position: -35px 0;
}

#slider .swiper-button-prev::after,
#slider .swiper-button-next::after {
  content: none;
}

#down {
  position: absolute;
  bottom: -24px;
  left: 50%;
  z-index: 4;
  width: 48px;
  height: 48px;
  margin-left: -24px;
  border-radius: 48px;
  background: var(--bak-white) url("../images/down.png") no-repeat center;
  cursor: pointer;
  transition: var(--bak-ease-slow);
}

#down:hover {
  bottom: -30px;
  background-color: #eee;
}

#down.clicked {
  bottom: 50px;
  opacity: 0;
  pointer-events: none;
}

/* ==========================================================================
   Home sections
   ========================================================================== */
#products {
  position: relative;
  text-align: center;
}

#products .think {
  position: absolute;
  inset: 0 auto auto 0;
  width: 100%;
  height: 55%;
  background: var(--bak-bg-think) url("../images/think-flexible-logo-r.webp") no-repeat center;
  background-size: contain;
}

.homeImg {
  position: relative;
  padding-top: 178px;
  margin: 0 auto;
  opacity: 1;
}

#products h1,
#products h3 {
  margin: 60px 0 25px;
  font-size: 24px;
  font-weight: 600;
  color: var(--bak-gray-mid);
}

#products p {
  font-size: 16px;
  color: var(--bak-gray);
}

#projects {
  margin: 80px 0 0;
  overflow: hidden;
}

.proje {
  position: relative;
  z-index: 1;
  display: block;
  padding: 20px 20px 20px 100px;
  text-align: left;
  color: var(--bak-white);
  opacity: 1;
}

.proje h1,
.proje h3 {
  margin: 15px 0 0;
  font-size: 18px;
  font-weight: 600;
}

.proje p {
  font-size: 14px;
  font-weight: 400;
}

.proje.biten {
  background: var(--bak-red) url("../images/cat.webp") no-repeat 20px center;
}

.proje.biten::after {
  content: "";
  position: absolute;
  top: 0;
  left: -297%;
  z-index: -1;
  width: 300%;
  height: 100%;
  background: var(--bak-red);
}

.proje.biten p {
  color: var(--bak-red-soft);
}

.proje.devam {
  background: var(--bak-gray-mid) url("../images/movie.webp") no-repeat 30px center;
}

.proje.devam::after {
  content: "";
  position: absolute;
  top: 0;
  right: -295%;
  z-index: -1;
  width: 300%;
  height: 100%;
  background: var(--bak-gray-mid);
}

.proje.devam p {
  color: var(--bak-gray-light);
}

.proje:hover {
  color: var(--bak-white);
  opacity: 0.8;
}

#about {
  position: relative;
  z-index: 1;
  margin: 100px 0 50px;
  padding: 10px 0;
  background: var(--bak-bg-soft);
}

#about .container .col-sm-12::after {
  content: "";
  position: absolute;
  top: -25%;
  left: 0;
  z-index: -1;
  width: 100%;
  height: 140%;
  background: url("../images/world.webp") no-repeat center;
  background-size: contain;
}

#about h1,
#about h3 {
  margin-top: 25px;
  font-size: 24px;
  font-weight: 600;
  color: var(--bak-gray-mid);
}

#about p {
  margin: 30px 0 0;
  padding: 0 50px;
  font-size: 16px;
  font-weight: 400;
  line-height: 22px;
  color: var(--bak-gray);
}

#news h2 {
  margin: 30px 0 60px;
  text-align: center;
  color: var(--bak-red);
  font-weight: 600;
}

#news .haberBaslik {
  display: block;
  min-height: 3em;
  color: var(--bak-ink-soft);
  font-size: 24px;
  font-weight: 600;
}

#news .haberBaslik:hover {
  color: var(--bak-red);
}

#news p {
  color: var(--bak-gray);
  font-size: 14px;
}

#news .newsDate {
  color: var(--bak-red);
}

#newsCarousel.swiper {
  overflow: hidden;
  padding-bottom: 20px;
}

#newsCarousel .swiper-pagination {
  position: relative;
  margin-top: 50px;
}

#newsCarousel .swiper-pagination-bullet {
  width: 25px;
  height: 5px;
  border-radius: 5px;
  background: var(--bak-dot);
  opacity: 1;
}

#newsCarousel .swiper-pagination-bullet-active {
  background: var(--bak-red);
}

#logos {
  margin: 50px 0;
}

#logoCarousel {
  padding: 0 10px;
  text-align: center;
  overflow: hidden;
}

#logoCarousel .swiper-slide {
  width: auto;
  text-align: center;
}

#logoCarousel .swiper-slide img {
  height: 66px;
  width: auto;
  margin: 0 auto;
  opacity: 0.7;
  filter: grayscale(100%);
  transition: var(--bak-ease-slow);
  cursor: pointer;
}

#logoCarousel .swiper-slide img:hover {
  opacity: 1;
  filter: grayscale(0);
}

/* ==========================================================================
   Footer
   ========================================================================== */
#footerTop img {
  opacity: 0.7;
  filter: grayscale(100%);
  transition: opacity var(--bak-ease);
}

#footerTop img:hover {
  opacity: 1;
  filter: grayscale(0);
}

#footerTop .di {
  padding: 12px;
}

#footerTop .d-flex a,
#ispolicy,
#bth {
  font-size: 12px;
  color: #666;
}

.kvkk-link {
  margin-right: 18px;
  padding: 12px;
}

.holding {
  margin-top: 5px;
}

#footer {
  margin: 20px 0 0;
  padding: 35px 30px;
  border-top: 1px solid var(--bak-line);
  border-bottom: 1px solid var(--bak-line);
  background: var(--bak-red);
  color: var(--bak-white);
}

#footer a {
  color: var(--bak-white);
}

#footer .col-sm-6:first-child {
  text-align: left;
}

#footer .col-sm-6:last-child {
  text-align: right;
}

.sosyal {
  padding: 9px 5px 7px 15px;
  text-align: left;
}

.sosyal a {
  display: inline-block;
  width: 28px;
  height: 28px;
  margin: 0 4px 0 0;
  background: url("../images/social.webp") no-repeat;
  text-indent: -9999em;
  transition: opacity var(--bak-ease);
}

.sosyal a.fb { background-position: 0 0; }
.sosyal a.tw { background-position: -31px 0; }
.sosyal a.yt { background-position: -61px 0; }
.sosyal a.in { background-position: -94px 0; }
.sosyal a.ins { background-position: -127px 0; }

.sosyal a:hover {
  opacity: 0.6;
}

.copyright {
  margin-top: 10px;
  font-size: 12px;
  color: var(--bak-gray);
}

/* ==========================================================================
   Cookie bar
   ========================================================================== */
.cookie-disclaimer {
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 99999;
  width: 100%;
  background: var(--bak-red);
  opacity: 0;
  transform: translateY(100%);
  transition: transform 300ms cubic-bezier(0.4, 0, 0.2, 1), opacity 300ms cubic-bezier(0.4, 0, 0.2, 1);
}

.cookie-disclaimer.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.cookie-disclaimer_content {
  width: min(50%, 100%);
  margin: 0 auto;
  padding: 15px 0;
  color: var(--bak-white);
  font-size: 14px;
  font-weight: 400;
}

.cookie-disclaimer_content a {
  color: var(--bak-white) !important;
  font-size: 14px !important;
  text-decoration: underline;
}

.cookie-disclaimer_content .btn {
  display: inline-block;
  margin: 0 auto;
  padding: 5px 15px;
  border: 0;
  border-radius: 0;
  background: var(--bak-gray-mid);
  color: var(--bak-white);
  font-size: 14px;
}

.cookie-disclaimer_content .btn:hover,
.cookie-disclaimer_content .btn:focus {
  background: var(--bak-black);
  box-shadow: none;
  outline: 0;
}

/* ==========================================================================
   Video modal (Fancybox replacement)
   ========================================================================== */
.video-modal {
  position: relative;
  width: 70%;
  max-width: min(800px, 92vw);
  padding: 0;
  border: 0;
  background: var(--bak-black);
}

.video-modal::backdrop {
  background: rgb(0 0 0 / 0.65);
}

.video-modal__frame {
  position: relative;
  padding-top: 56.25%;
}

.video-modal__frame iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.video-modal__close {
  position: absolute;
  top: -2.2rem;
  right: 0;
  z-index: 2;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--bak-white);
  font-size: 1.5rem;
  line-height: 1;
  cursor: pointer;
}

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 1366px) {
  .cookie-disclaimer_content {
    width: 90%;
  }
}

@media (min-width: 981px) and (max-width: 1199px) {
  .navbar-default .navbar-nav > li {
    margin: 0 !important;
  }

  .navbar-default .navbar-nav > li > a {
    padding: 13px 10px 10px;
  }

  #menuTop .container,
  #logos .container {
    width: 100%;
  }

  #logoCarousel {
    padding: 0 20px;
  }
}

@media (min-width: 768px) and (max-width: 980px) {
  .navbar-default .navbar-nav > li {
    margin: 0 0 0 3px;
  }

  .navbar-default .navbar-nav > li > a {
    padding: 13px 5px 10px;
    font-size: 12px;
  }

  #menuTop .container {
    width: 766px;
  }

  #logoCarousel {
    padding: 0 20px;
  }

  #logoCarousel .swiper-slide img {
    height: 50px;
  }

  #footer {
    padding: 35px 15px;
  }
}

@media (max-width: 980px) {
  #slider .sliderContent h2 {
    font-size: 50px;
  }
}

@media (max-width: 991px) {
  #footerTop .row.d-flex {
    display: block !important;
  }

  #footerTop .justify-content-end {
    margin-top: 15px;
    justify-content: space-between;
  }

  #footerTop .justify-content-start {
    justify-content: space-between;
  }
}

@media (max-width: 768px) {
  #footerTop .text-center,
  #footerTop .text-left,
  #footerTop .text-right {
    display: flex;
    flex-direction: row;
    width: 100%;
    justify-content: center;
    align-items: center;
    text-align: center !important;
  }
}

@media (max-width: 767.98px) {
  #down {
    display: none;
  }

  #slider .sliderContent {
    display: none;
  }

  #products {
    margin-top: -55px;
  }

  .homeImg {
    top: 20px;
    opacity: 1;
  }

  #products p {
    padding: 0 15px;
  }

  #projects {
    margin: 50px 0 0;
    padding: 0;
  }

  #projects .col-sm-6 {
    margin: 0;
    padding: 0;
  }

  #about {
    margin: 50px 0;
  }

  #about p {
    padding: 0 15px;
  }

  #news .haberBaslik {
    font-size: 18px;
  }

  #news p {
    margin: 10px 0;
  }

  #newsCarousel .swiper-slide {
    padding: 0 15px;
  }

  #newsCarousel .swiper-pagination-bullet {
    width: 16px;
  }

  #logoCarousel {
    padding: 0;
    margin: 0 0 50px;
  }

  #logoCarousel .swiper-slide img {
    height: 40px;
    margin-bottom: 20px;
  }

  #footer {
    padding: 10px;
  }

  #footerTop .fl,
  #footerTop .fr {
    float: none !important;
    display: block !important;
    width: 100% !important;
  }
}

@media (max-width: 375px) {
  #footerTop .col-md-4 .d-flex,
  #footerTop .col-md-4.d-flex {
    display: block !important;
  }

  #footerTop .justify-content-center {
    margin-top: 15px;
  }

  #footerTop .kvkk-link {
    display: block;
    margin-bottom: 15px;
    text-align: center;
  }
}


/* ==========================================================================
   Inner pages (master layout)
   ========================================================================== */
#masterContent { margin-bottom: 30px; color: #717171; overflow: hidden; }
    #masterContent .icerik h1, #masterContent .icerik h2, #masterContent .icerik h3, #masterContent .icerik h4, #masterContent .icerik h5, #masterContent .icerik h6 { color: #af2c36; }
    #masterContent .icerik h4 { color: #656868; }
    #masterContent .icerik p { min-height: 10px; }
    #masterContent .icerik a { color: #af2c36; }

#masterImg { background: #af2c36; position: relative; height: 305px; overflow: hidden; }
#masterImg.smallMaster{height:180px}
    #masterImg > img { object-fit: cover; height: 100%; width: 100%; }
    #masterImg:after { content: ''; width: 100%; opacity: .5; z-index: 3; height: 100%; position: absolute; left: 0; bottom: 0; background: rgba(212,228,239,0); background: background: background: background: background: background: linear-gradient(to bottom, rgba(212,228,239,0) 0%, rgba(0,0,0,1) 100%); z-index: 2; pointer-events: none; }
.masterLeft #leftMenu h2 { display: none; }

.icerik { font-size: 14px; font-weight: 400; padding: 50px 10px 50px 0; text-align: justify; }

.logoHolder {
    margin-bottom: 5px;
    background: #fff;
    border: solid 2px #eee;
    padding: 5px;
    font-size: 18px;
    color: #656868;
}
.logoHolder span {
    display: inline-block;
    margin-left: 5px;
    border-left: solid 2px #eee;
    padding-left: 10px;
}

.breadcrumb { background-color: transparent; border-radius: 0; list-style: outside none none; margin-bottom: 0; padding: 10px 0 0; }
    .breadcrumb a { color: #ccc; font-weight: 400; }
        .breadcrumb a:hover { color: #eee; }
    .breadcrumb li { margin-bottom: 1px; }

    .breadcrumb > li + li::before { background: url("../images/breadcrumb-splitter.png") no-repeat scroll center center; content: ""; padding: 0 10px; }


    

#leftMenu { background: #656868; border-top: 10px solid #af2c36; padding: 30px 0 100px; z-index: 5; border-radius: 0px 0px 5px 5px; -webkit-border-radius: 0px 0px 5px 5px; }
/*#leftMenu:after{width:300%; height:100%; content:''; left:100%; top:0; position:absolute; background:#656868;  }*/

.nav-pills > li > a { border-radius: 0; border-bottom: solid 1px #777777; }
.nav-pills > li > a { background: url(../images/ok.png) no-repeat left -20px center; color: #fff; display: block; font-size: 15px; font-weight: 400; margin: 0 0 -2px; padding: 10px 15px; position: relative; transition: .3s ease; }
    .nav-pills > li > a:focus, .nav-pills > li > a:hover { background: #982730 url(../images/ok.png) no-repeat left 15px center; padding-left: 25px; text-decoration: none; transition: .3s ease; }
.nav-pills > li:last-child > a { border: none; }
.nav-pills > li.active > a, .nav-pills > li.active > a:focus, .nav-pills > li.active > a:hover { background: url(../images/ok.png) no-repeat left 15px center; color: #fff; padding-left: 25px; }


#masterContent .icerik ul { list-style-image: url(../images/rok.png); padding: 0; list-style-position: inside; }
    #masterContent .icerik ul li { margin-bottom: 10px; font-size: 14px; }

        #masterContent .icerik ul li a { color: #656868; transition: .3s ease; }
            #masterContent .icerik ul li a:hover { color: #af2c36; }

.masterRight .page-title, #masterContent .page-title { position: relative; padding-top: 30px; }
#masterImg .page-title { position: absolute; left: 0; top: 50%; margin-top: -50px; width: 100%; z-index: 3; }
.masterRight h2{ font-size: 30px; color: #fff; padding: 10px; margin: 0; position: relative; float: left; background: #af2c36; }
#masterContent .proTitle{text-align:center}
.proTitle h2 {font-size: 30px; color: #fff; padding: 10px; margin: 0; display:inline-block; background: #af2c36; }
#masterImg.productBanner .page-title h2 {background:none}
#masterImg { text-align: center; }
#masterImg.productBanner .breadcrumb {background:none}
    #masterImg h2 { display: inline-block; font-size: 30px; color: #fff; padding: 10px; margin: 0; position: relative; background: #af2c36; }
.masterRight .breadcrumb { margin: 0; padding: 16px 10px; position: relative; float: left; background: #656868; }
.proTitle .breadcrumb{float: none; display: inline-block; padding: 5px; margin: 0; position: relative; background: #656868; }
    .masterRight .breadcrumb:after { background: #656868; content: ''; height: 100%; width: 3000px; position: absolute; left: 0; top: 0; z-index: -1; }
#masterImg .breadcrumb { float: none; display: inline-block; padding: 5px; margin: 0; position: relative; background: #656868; }
    #masterImg .breadcrumb:after { display: none; }
.haber-item h4 { margin-top: 20px; height: 80px; text-align: left; }
.haber-item p { font-size: 14px; font-weight: 400; }

.g-recaptcha { border-radius: 10px; height: 73px; text-align: right; width: 290px; max-width: 100%; }
    .g-recaptcha div { margin: -2px 0 0 -1px; }
.form-controlC { border: 1px solid #e8e8e8; border-radius: 4px; background: #f9f9f9; }

.mapHolder { border: 1px solid #eee; padding: 10px; margin-bottom: 20px; }
.form-group { margin-bottom: 0; min-height: 60px; }
.form-control { padding: 10px 10px; height: 50px; color: #666; border-radius: 4px; box-shadow: none; font-size: 14px; }
.send { width: 100%; display: block; color: #fff !important; font-size: 16px; font-weight: 600; padding: 21px 20px; border-radius: 4px; margin-top: 10px; background: #656868; transition: .5s ease-in; }
    .send:hover { background: #af2c36; color: #fff; }
    .send:hover, .send:focus, .send.focus { color: #fff; }
.capHolder { overflow: hidden; width: 296px; max-width: 100%; }


.sube th { background: #af2c36; color: #fff; }
.sube td { padding: 10px; }
#masterContent .icerik .sube th h4 { color: #fff; padding: 20px; }

.pro { position: relative; overflow: hidden; background: #af2c36; transition: .5s ease-in; }
    .pro img { transition: .5s ease-in; height: 200px; width: 100%; object-fit: cover; }
.proName { color: #fff; position: relative; padding: 10px; font-size: 18px; transition: .5s ease-in; }
.pro:hover img { opacity: .7; }
.pro:after { z-index: 2; pointer-events: none; opacity: 0; content: ''; position: absolute; right: 0; top: -40px; margin-left: -20px; width: 40px; height: 40px; background: #af2c36 url(../images/magnify.png) center no-repeat; transition: .3s ease-in; }
.pro:hover:after { opacity: 1; top: 0; }

#masterContent .icerik .document { background: #656868; padding: 10px; color: #fff; display: block; margin-top: 10px; }
    #masterContent .icerik .document:hover { background: #af2c36; }

#timeline .timeline-item:before { content: ''; display: block; width: 100%; clear: both; position: relative; }
#timeline { width: 100%; margin: 30px auto 0; position: relative; padding: 0 0 0 10px; transition: all 0.4s ease; }
    #timeline .timeline-year { position: absolute; content: ''; left: 5px; top: -7px; font-size: 16px; color: #af2c36; font-weight: 600; }

    #timeline .timeline-item:first-child .timeline-year { font-size: 20px; top: -10px; }
    #timeline .timeline-item:last-child .timeline-year { font-size: 20px; top: -10px; }

    #timeline:before { content: ""; width: 2px; height: 100%; background: #af2c36; left: 4px; top: 0; position: absolute; }
    #timeline:after { content: ""; clear: both; display: table; width: 100%; }
    #timeline .timeline-item { margin-bottom: 50px; width: 100%; position: relative; float: right; }
        #timeline .timeline-item .timeline-icon { background: #af2c36; width: 10px; height: 10px; position: absolute; top: 0; left: 4px; overflow: hidden; margin-left: -14px; -webkit-border-radius: 50%; border-radius: 50%; }
            #timeline .timeline-item .timeline-icon img { position: relative; }
        #timeline .timeline-item .timeline-content { width: 90%; float: right; transition: all 0.3s ease; text-align: left; margin-top: -13px; }
            #timeline .timeline-item .timeline-content h2 { font-size: 14px; background: #656868; color: #fff; font-weight: 600; -webkit-border-radius: 3px; 3px; border-radius: 3px; float: left; }

            #timeline .timeline-item .timeline-content p { margin-top: 10px; clear: left; float: left; }

.sayfagaleri { margin-top: 20px; }
    .sayfagaleri hr { margin-bottom: 40px; }
    .sayfagaleri .img-thumbnail { margin-bottom: 5px; width: 100%; overflow: hidden; position: relative; }
        .sayfagaleri .img-thumbnail:after { background: #fff; height: 5px; width: 100%; position: absolute; left: 0; bottom: 0; content: ''; }
        .sayfagaleri .img-thumbnail img { width: 100%; object-fit: cover; transition: all 0.4s ease; }
            .sayfagaleri .img-thumbnail img:hover { opacity: .7; }

.mappa { border: solid 1px #eee; transition: .3s ease; }

.proHolder { text-align: center; margin-bottom:30px; padding: 10px; box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.25); transition: .3s ease; }
    .proHolder .proName { padding: 6px; background: #af2c36; color: #fff; font-size: 16px; font-weight: 500; transition: .3s ease; min-height: 60px; display: flex;justify-content: center;align-items: center;}
    .proHolder img { transition: .3s ease; }
    .proHolder:hover img { opacity: .7; }
    .proHolder:hover { box-shadow: 0px 4px 10px 4px rgba(0,0,0,0.15); }

    .icerik .newsHolder{border:5px #eee solid; height:320px; overflow:hidden; padding:20px; margin-bottom:20px; text-align: left; }
    .icerik .newsHolder .newsImg{height:120px; width:100%; text-align:center}
    .icerik .newsImg img{object-fit:cover; margin:auto; height:100%}
     .icerik .newsHolder h3{font-size:18px}


.icerik .all { width: 100%; display: block; color: #fff !important; font-size: 16px; text-align:center; font-weight: 600; padding: 5px; border-radius: 4px; margin-top: 10px; background: #656868; transition: .5s ease-in; margin-top:20px}
    .all:hover { background: #af2c36; color: #fff; }
    .all:hover, .all:focus, .all.focus { color: #fff; }

    .galHolder { margin-bottom: 20px; height: 150px; overflow: hidden; padding: 0; transition: 0.3s ease-in; }
    .galHolder img { object-fit: cover; transition: 0.3s ease-in; }
    .galHolder:hover img { opacity: .4; }
    .galHolder:after { opacity: 0; content: ''; top: 0; left: 0; position: absolute; width: 100%; height: 100%; background: url(../images/magnify.png) no-repeat center; pointer-events: none; z-index: -1; transition: 0.3s ease-in; }
    .galHolder:hover:after { opacity: 1; z-index: 2; }

    #sayfagaleriCarousel{padding:20px; border: 3px #eee solid; position:relative}
    #sayfagaleriCarousel .owl-controls{ position:absolute; right:25px; bottom:20px}
    #sayfagaleriCarousel .owl-dots .owl-dot span{background:#dadada; width:25px; border-radius:5px; height:5px}
    #sayfagaleriCarousel .owl-dots .owl-dot.active span,#news .owl-theme .owl-dots .owl-dot:hover span{background:#af2c36}

    #masterContent .icerik #tabs{list-style-image:none; list-style-position:inside; text-align:left; margin-top:20px}
#masterContent .icerik #tabs li { cursor: pointer; color: #656868; font-size: 18px;  background-color:#eee; padding:10px}
   #masterContent .icerik #tabs li.active { color: #fff; background:#af2c36 url(../images/ok.png) no-repeat right 10px center; }  
   
   .tabWrapper{padding:20px 15px}

   #katalog li{font-size:16px; border-bottom:solid 1px #eee;display:block;position:relative}
      #katalog li a{display:block;padding:10px 10px 10px 30px; }
      #katalog li.link{background:url(../images/link.png) no-repeat left center;}
      #katalog li.pdf{background:url(../images/pdf.png) no-repeat left center;}

      #ikIframe{border:solid 3px #eee}
     #masterImg.productBanner{height:150px}
     /*#masterImg.productBanner:after{display:none}*/

/* Bootstrap 5: stacked left menu (was .nav-stacked) */
#leftMenu .nav-pills {
  flex-direction: column;
}
#leftMenu .nav-pills .nav-link,
#leftMenu .nav-pills > li > a {
  border-radius: 0;
}

/* Breadcrumb: live site uses image splitter; keep simple slash spacing */
.breadcrumb > li + li::before {
  background: none;
  content: "/";
  padding: 0 8px;
  color: #ccc;
}

.masterRight .breadcrumb {
  list-style: none;
}
.masterRight .breadcrumb li {
  display: inline;
  color: #ccc;
}
.masterRight .breadcrumb a {
  color: #ccc;
}
.masterRight .breadcrumb a:hover {
  color: #eee;
}

/* Form label spacing on contact */
#masterContent .form-label {
  color: #656868;
  font-weight: 600;
  margin-bottom: 0.35rem;
}
#masterContent textarea.form-control {
  height: auto;
  min-height: 140px;
}

@media (max-width: 767.98px) {
  #leftMenu {
    margin-bottom: 20px;
    padding-bottom: 30px;
  }
  .masterLeft {
    float: none;
    width: 100%;
  }
  .masterRight {
    width: 100%;
  }
  .masterRight h2 {
    float: none;
    display: inline-block;
  }
  .masterRight .breadcrumb {
    float: none;
    display: block;
  }
  #masterImg {
    height: auto;
    min-height: 140px;
  }
  #masterImg > img {
    min-height: 140px;
  }
}

/* Contact form (CMS) */
#contact-form .send,
button.send {
  background: #af2c36;
  color: #fff;
  border: 0;
  padding: 10px 28px;
  font-family: "Panton", sans-serif;
  text-transform: uppercase;
  letter-spacing: .04em;
}
#contact-form .send:hover,
button.send:hover { filter: brightness(1.05); }
.form-consent-group { margin-top: .5rem; }
.form-consent-chk { display: flex; gap: .5rem; align-items: flex-start; margin: .4rem 0; font-size: .9rem; }
.insight-filter-bar { display: flex; flex-wrap: wrap; gap: .5rem; }
.insight-filter-btn {
  display: inline-block;
  padding: .35rem .75rem;
  border: 1px solid #ccc;
  color: #333;
  text-decoration: none;
  font-size: .85rem;
}
.insight-filter-btn.active,
.insight-filter-btn:hover {
  border-color: #af2c36;
  color: #af2c36;
}
.diller a.active { font-weight: 700; text-decoration: underline; }
